Client gateway for equipment manufacturer

Itransition integrated four customer data sources into a unified gateway to speed up after-sales services and give access to educational materials for better quality, on-the-spot maintenance, and support.

Home
Portfolio
Client gateway for equipment manufacturer

Context

Cerulean is a market leader in test and measurement solutions for the tobacco, food, and packaging industries with clients in 94 countries. They manufacture and provide quality and process control tools, as well as test and measuring equipment. They are part of COESIA, a group of innovation-based industrial and packaging solutions companies operating globally.

Their goal is to help their clients save costs on new equipment, its disposal, and recycling. For this, they offer localized maintenance and support, a parts store, equipment modernization, training, documentation, and consultancy, including AR-powered remote assistance. Before collaborating with Itransition, the customer’s business data was stored in their management system which gathered it from different disjointed sources: CRM, DMS, the Cerulean COESIA website, and the equipment spare parts website. Service requests were managed by phone, email, and CRM tickets. When an issue arises, engineers visit the equipment site to make fixes for planned or emergency maintenance. However, they had trouble accessing equipment documentation, user manuals, and videos. To view client details, engineers searched through the CRM and to access different data - their existing management system. To order parts, they had to access the online parts identifier website.

This was a lengthy multi-step after-sales maintenance process, so Cerulean decided to create a client gateway connecting all customer systems in a single space to improve the quality of the after-sale equipment service, speed it up, and simplify it. The customer chose Itransition because of our extensive expertise in developing and setting up integrations as part of previous projects in the finance, real estate, and ecommerce domains.

Solution

Itransition’s team created a MiCerulean gateway for the customer’s clients, such as department managers and production engineers with access to equipment and its parts. MiCerulean is the main user and data management system hosted on AWS and gathering data from the following sources:

A web-based CRM application utilized by Cerulean for technical support ticket management. The CRM stores asset history, client information, and all equipment information. We used the REST API integration method.
Cerulean's SharePoint provides access to files associated with the user's assets. We integrated it via REST API and video content via AWS S3 to ensure the necessary high level of security.
Cerulean COESIA website
Cerulean spare parts website

The functionality of MiCerulean includes the management of users with different roles and access rights. User management ensures access is given to persons with equipment authorized by their contract and guarantees continuity even when users with the most powerful access rights and privileges leave the company. To support these workflows, Itransition designed a complex access rights hierarchy that matches diverse company processes, making the gateway model restricted and secure. When users log into MiCerulean, their pages are automatically linked to their equipment’s documentation, its parts, and corresponding learning files. End-clients have the right to create additional users and grant them rights according to their permissions and work tasks.

The gateway consists of the following modules:

System administration module with asset documents and software asset details (tech info), service history, and user-specific links to the parts store
Learning module with equipment documentation, training manuals, user guides, video instructions, and how-tos
FAQ module

Technical support is available via location-specific Company contacts. Each site representing a location has a list of its equipment, and those pages contain asset and service history tabs as well as an external link to the specific product on the Cerulean spare parts website. This way, users don’t have to search through the full set of original parts and can proceed to make an order immediately, improving equipment availability and uptime.

Equipment page with ‘Find parts’ link - super user view

The equipment page also features service tickets for easy progress tracking, as well as localized contact details.

The help icon opens a description box with directions for using the gateway.

Learning videos, datasheets, whitepapers, user manuals - end user view

Also, the pages feature recent additions to the official documentation, keeping all the information up-to-date.

Training videos are featured to help in-house specialists stay on top of the latest updates in the equipment they service.

Our team also developed a feature that uses QR code stickers on equipment to give engineers access to a shorter version of the MiCerulean asset details page. If those details aren’t enough, the engineer can sign in and access the full page via their profile. Now, clients can independently solve small issues on the spot, including fixing a small machine malfunction, a disconnected or incorrectly connected cable, installing a new filter, or setting the required airflow.

Process

The project team consisted of project managers, business analysts, tech leads, QA experts, designers, and frontend, backend, and SharePoint developers. The tech lead set up the environment and the designer created preliminary layouts. As soon as the customer greenlit the system design, frontend developers began work. We then added backend and SharePoint developers and a QA team. In addition to cooperation with our team, the customer enlisted the help of a third vendor, discussing various options for implementing the project and validating estimates.

Itransition started the project with requirements elaboration and documentation creation, mapping out the primary scope, and setting up the environments. The first demo to Cerulean helped evaluate the functionality and improve the future solution based on customer feedback. We also prepared specifications, which were verified and approved by the customer.

First, we implemented an MVP with the following main modules:

System user management
Assets module integration with CRM
Integration with CRM to receive equipment data
Help center
Other information pages

To set up efficient collaboration, Itransition specialists identified the customer's stakeholders responsible for particular functionality and established a transparent process for identifying, analyzing, preparing, and approving requirements with them. Since our system is integrated with a third-party vendor, we also established communication with them.

We used elements of the Agile methodology as well as Kanban because client dependencies prevented us from creating a pull of future work. We held weekly sessions discussing requirements and updates and conducted workshops on demand. Demo results were presented to the customer throughout the whole cooperation. To sync our team members up, we utilized daily stand-ups, grooming sessions, and retrospectives. We also provided monthly budget reports and project management reports, including project status and timesheets, to the customer.

Since the project’s scope has changed, we had to reevaluate the system’s functionality. For this, our team carried out rediscovery to capture modified requirements and update the client's cost expectations. The team made additions to the original assessment of the assumptions to capture the new scope and created a new estimate based on the received requirements and details.

Within the altered scope, we added new features such as notifications, access by QR code, and a learning module, which required integration with the customer's SharePoint to store existing equipment training materials.

Itransition established a change request management process on the project for change requests concerning extending functionality, adding a feature, developing and implementing requests, and updating current system documentation. The flow helps us speed up change processes; minimize manual entry, errors, and reworking; lower risks of requests approved improperly; provide a unified experience for all parties; and discover and eliminate process bottlenecks.

To optimize SharePoint operations, we added a dedicated specialist for consultations and subsequent setup of the document workflow and integration options with the gateway. The expert also communicated closely with the customer, discussing the existing restrictions and possible security solutions.

In the course of our interaction with the customer, disagreements arose regarding their proposed data integration method through file sharing on their server instead of using the standard REST API. During the discussions, we explained the advantages and disadvantages of both approaches and as a result, they decided in favor of REST API.

Technologies

Itransition helped to realize Cerulean’s project vision using the best technical solutions. Our team took an active part in discussions regarding the project’s vision, individual requirements, design, and technological implementation.

Itransition delivered a high-level technical design of the solution, including its high-level architecture, and suggested the best-fitting technology framework. Our software deliverables were the web application components deployed in a dedicated environment, source code, and source code documentation.

The backend of the Cerulean web application is written in PHP using the Symfony framework. The backend API is a gateway for UI Gateway for three data sources, namely Cerulean/COESIA (web), the CRM, and the SharePoint-based document management system. We used API Platform as an API framework to speed up and streamline the development, minimize API development and deployment efforts, and seamlessly integrate with the Symfony ecosystem. We also benefited from flexible data handling, built-in API documentation, and stress-free extensibility.

The front-end was written in TypeScript using the ReactJS framework. The UI layer is a ReactJS application that receives data from the backend via REST API using JWT as an authentication mechanism. Developers utilized Ant Design as a UI library. ReactJS was chosen for its component-based modular architecture that improves code and component reusability, maintainability, and scalability, making managing and updating UI elements easier. We also benefited from unidirectional data flow from parent to child components which facilitated data change tracking, simplified debugging, and reduced potential bugs.

Our team used Git for version control and the Doctrine ORM framework - to simplify database operations. Our experts used Nginx to accelerate content and application delivery and facilitate system availability.

To establish document exchange, we created a separate website for public files and developed an internal script for SharePoint that synchronizes documents. The script also adds the necessary attributes to documents based on business logic from the closed internal website to a new public one. Our developers also adapted to the built-in SharePoint REST API. Now, small documents are received via the HTTP API since this cannot be done directly. Large video files are uploaded to AWS S3 using a script. Direct public links to such video files are generated in the app to reduce the network load and avoid interface lags.

AWS stack

We used AWS Elastic Container Service (ECS) for deployment due to its following benefits:

Effortless scalability of the containerized application with the ability to handle varying traffic levels without interruptions.
Simplified container management thanks to the orchestration service allowing us to define and control apps and their lifecycle.
High availability with automatic load balancing across containers and availability zones, ensuring resilience to failures.
Seamless integration with other AWS Services to enhance app functionality and security.
Robust security features to protect apps and data.
The pay-as-you-go pricing model eliminates the need to pay for unused resources thanks to automatically scaling resources up and down based on demand, achieving rational resource utilization.

To improve the performance and reliability of our applications, we incorporated Amazon CloudFront, a content delivery network service. The team can easily cache and deliver app content closer to users, reducing latency and improving performance. Additionally, CloudFront acted as a shield, helping to protect our apps from DDoS attacks by employing intelligent traffic filtering and request rate limiting. This integration with CloudFront added an extra layer of security and scalability to the infrastructure and provided extra protection against DDoS attacks, ensuring continuous system availability and safeguarding user experience.

Our team implemented CloudWatch dashboards with real-time key project metrics such as resource utilization, response times, error rates, and throughput to facilitate comprehensive monitoring. Customized dashboards allow us to track and monitor specific aspects of our project and provide performance and health insights. Using it, we can identify issues, anomalies, or bottlenecks and make data-driven decisions to address them.

We prepared the stage environment on AWS and showed demos on this environment to the customer. Itransition also developed a solution for secrets substitution using Secret Manager and secrets key in ECS containers and set up zero downtime for deployment.

We also used other AWS services:

AWS S3 for hosting static files
AWS Route53 for DNS management
AWS Certificate Manager for certificate management
AWS KMS (Key Management Service) for data encryption
AWS ECR (Elastic Container Registry) for container image storage
AWS ECS for container management
AWS CloudFront as CDN
ALB (Application Load Balancer) as load balancer
Aurora RDS (MySQL) as the database
AWS ElastiCache for cache storage

QA

Our QA engineers performed new feature testing (NFT), performance testing, API testing, and regression testing. Code is covered by functional, unit, and auto-review tests.

We used the following tools:

BrowserStack for cross-browser testing, testing on various devices and OS versions
Postman for REST API testing
PHPUnit for integration and unit tests
Infection library for unit tests

Using Infection, we created quality unit tests by automatically generating and applying mutations to the codebase. We could evaluate feedback, identify areas of weakness in the test suite, and streamline test development.

QA experts delivered functional quality reports that included the overall quality level of the tested build, a summary of performed tests, defects ranged by severity, and necessary recommendations.

Writing functional and unit tests on the backend allowed us to reduce the number of errors, saving time that could have been spent on manual testing. Also, regression testing didn’t reveal any errors.

DevOps

Itransition’s team implemented a DevOps infrastructure using technologies and practices to optimize application deployment and management. To orchestrate our infrastructure, we used Terraform, an infrastructure as code (IaC) tool for efficient resource provision and management.

We established a sophisticated CI/CD pipeline using Jenkins. This automation server allowed us to streamline software delivery from development to production. With each code commit, Jenkins performed automated testing, code quality checks, and deployment to designated environments, guaranteeing a streamlined error-free release process.

We created two environments to facilitate efficient development and testing. This allowed us to isolate our development environment from the production environment and ensure stable and reliable production release. This setup also allowed us to test and validate changes thoroughly before making them available to users.

To deploy apps with zero downtime and disruption, the team leveraged ECS Fargate, a serverless container orchestration service. Our apps were dynamically scaled and managed, handling varying traffic levels while maintaining optimal performance and reliability.

Security and access management were critical aspects of the project, so addressed various related challenges and implemented robust access controls and security measures throughout the project.

The team configured all CI static analysis tools: PHPStan, Psalm, PHPCSFixer, and Rector. Docker and Docker Compose were selected as containerization tools.

Results

We created a client-oriented gateway inspired by end-users’ feedback and requests that enables instant access to information from four company data sources integrated into one easy-to-use space. Access to the client gateway is available via service packages as part of after-sales support.

MiCerulean automates after-sales maintenance to achieve:

On-the-go access to CRM, documentation, user manuals/videos, and website data
6x faster document searching
2x faster spare parts ordering
20% fewer costly onsite visits