Client

One of the largest suppliers to the plastics industry, building, installing, and supporting a wide range of systems and equipment for various consumer and medical businesses.

Challenges

The client recognised the existential need to modernise and digitalise. Their daily operations were hindered by outdated systems, which impacted customer satisfaction and overall business performance.

Data Monitoring and System Performance

The primary objective was to monitor and process data from customer machines located in various customer factories. The project sought to drive the client’s growth to the next level while ensuring full availability and uptime.

Angular Application Modernisation

The client aimed to upgrade and further develop the organisation to operate efficiently, scale effectively, and meet modern technological standards.

• The existing layout was outdated and no longer met the new requirements, making the application difficult to navigate and use. This hampered user experience and efficiency, slowing down operational processes.
• The lack of essential features complicated the mold and sample testing processes, making them cumbersome and time-consuming. This inefficiency not only affected the workflow but also delayed project timelines, impacting the client's ability to meet customer demands promptly.
• The existing unit testing practices were insufficient, leading to unreliable and hard-to-maintain code. This increased the risk of bugs and system failures that could disrupt services and negatively affect customer trust and business continuity.

This challenge underscored the need for a comprehensive update to the Angular framework and Angular Material, aiming to improve usability, streamline testing processes, and enhance code reliability.

Solution

To improve and progress both internally and externally, together we had to adopt a complex approach.

Data Monitoring and System Performance

We focused on enhancing a web solution that predicts system performance deterioration and proactively identifies system problems by incorporating the latest features and integration capabilities.

This included introducing cloud-based operations, maintaining production and tooling, and improving always-on scaling and performance. The web application solution integrated various components of injection molding systems, including injection molding machines, molds, hot runners, auxiliaries, and ongoing monitoring services with comprehensive Business Intelligence (BI) reporting.

What we achieved?

• Real-time Data Monitoring and Analysis:

1. Monitors live data generated after each cycle, and utilizes it to generate alerts, reports, predictions, etc
2. Displays insights in both - the customer panel and the admin panel

• Connectivity Monitoring: Monitors the connectivity status of machines and provides relevant notifications also at both ends
• Configuration Management: Manages the configuration of customers' machines, users, and plants
• Technological Foundation: The solution leverages Microsoft Azure technologies
• IoT Integration: Telemetry data from machines is sent to an IoT Hub
• Communication Infrastructure: Azure Service Bus facilitates communication across different parts of the architecture
• Data Storage: Utilizes Cosmos DB, ADX, SQL, and Data Lake for storing diverse types of data
• Event Handling: Azure FunctionApps act as event subscribers to process incoming data and trigger actions

Angular Application Modernisation

We upgraded it to the latest version of the Angular framework. Additionally, our solution included an upgrade also of Angular Material to its most recent version.

How we did it?

• Changed and improved the layout to accept new requirements and to make the application more user-friendly
• Implemented new features that will simplify the process of mold and sample testing
• Increased the unit testing and code coverage
• SPA (Single Page Application) approach was implemented for the client’s application. There are many benefits to SPA solutions on both the customer experience side and back-end design side of the equation.

Microsoft .NET 6/7/8 is used as a base technology stack for the backend platform. The framework is open source but created and maintained by Microsoft Corporation and created with performance and cross-platform paradigms in mind. Using the framework, one code could be built and deployed on various operating systems like Windows, Linux and Mac OS. The framework is several times faster than the traditional blown framework and can support a much bigger load of users because of its remarkable performance.

Technologies

• Angular SPA
• Angular 16
• Angular Material 16
• Azure Cosmos DB
• Cosmos DB
• SQL DB
• .Net Core
• Data Lake
• MSAL OAuth 2.0 Authorization Code Flow with PKCE

Benefits

By addressing both data monitoring and system performance, as well as Angular application modernisation, the Qinshift development team has brought significant improvements to the client's operations.

Data Monitoring and System Performance

Many critical features have been implemented, including:

• Monitoring centre overview
• Onboarding and contract management
• High-priority downtimes with work order introduction (WCY)
• Monetisation
• Machine status overview
• Global variables with mathematical functions

These enhancements balanced costs, improved performance, and ensured the client's operations were efficient, scalable, and aligned with modern technological standards. This ultimately led to improved customer satisfaction and business performance.

Angular Application Modernisation

By introducing new technology trends, we provided the client with an application featuring a modern design and enhanced ease of use. This included a more user-friendly environment for creating samples, notes, meetings, and NC requests. Additionally, performance was increased by optimising data persistence, and responsiveness and concurrency issues were resolved by refining processes, requests, and transactions.