A Scalable Web Application with a Customizable UI
Description
Our client is Transaction-Network, a start-up from Germany that uses a B2B application to digitally transform after-sales support. Their goal is to provide a complete digital customer platform to machine manufacturers so they can grow their business and achieve success in sales and customer service.
The challenge
The start-up needed a team of experienced developers to build a digital platform for producer-consumer interactions. The software available on the market wasn’t enabling them to meet their business goals. The technology was difficult to scale, and it stood as a challenge to the company’s plans to grow.
Additionally, the available applications had poor UI. Manufacturers who wanted to communicate with their consumers could not customize their portals in accordance with their needs. Each client’s page looked similar enough in branding that it negatively impacted their success.
The company needed a new well-built app that combined asset-management, e-commerce, customer service and monitoring applications. They were looking for a team of Angular experts to build them a completely new web application that will simultaneously provide a rich user experience to their customers and enable the company to meet its business goals.
The solution
Our developers began building a reliable, scalable and customizable application with a rich user experience. The first step was the UI. The team composed a design system and implemented it as a reusable UI component library to ensure consistency now and in the future.
The first version of the product was an e-commerce web application that featured a catalog of machine parts available for purchase. However, after observing the way users interact with the application, our developers came up with the recommendation that in fact, two applications will be the best option – one for Original Equipment Manufacturers (OEM) and one for customers. The client agreed, so our developers began working on splitting one application into two.
From the customer application, users can browse machines and purchase spare parts for them. The app also has multiple after-sales support features. These include 3D models of machines, client discounts, and machine documents and manuals. Additionally, customers can schedule maintenance jobs directly from the application.
On the other hand, the application for OEMs enables users to correspond with their clients. They can respond to service requests, create a newsfeed, inform about new retrofits and customize their online shop based on their brand book.
While working on the functionalities, our team also focused on improving the architecture of the apps, so that the products are scalable in the future. Despite each application having different features and the customization of each machine manufacturer’s portal, they share UI similarities thanks to a design system and component library that highlight the fact they belong to the same company, Transaction Network.
The result
Both applications bring a rich, flexible, and customizable UI to every user. The application for machine manufacturers is a white label application. It offers support for a custom color palette and designated spaces for brand logos so everyone can customize their UI in accordance with their brand book.
Additionally, many of the app functionalities have built-in parameters. They behave differently depending on factors such as which application they belong to, what permissions a given user has, and what licenses his company has purchased.
The apps are also compatible and widely open for integration with other tools and systems, depending on the needs of the user. Machine manufacturers and those buying the machines can perform every action and access all the information they need inside the application.
Scaling and making other significant changes to the applications is simple thanks to a couple of factors:
- Our developers relied on the monorepo strategy, which means all of the code is kept in one place.
- The architecture is modular, so each function is closed off in a separate lazy-loaded module.
- The apps are very adjustable, both on a functionality level and an integration level. This enables easy and precise platform adjustments to a specific client and the ability to integrate the platform with outside systems to manage things such as sales, prices, and product availability.
- The team started the project with a design system and created a catalog of reusable components.
All of these contributed to making the process of splitting one application into two quick and efficient and will enable any further changes to be made with the same ease.
What’s more, the products are safe and reliable due to being built with Angular, the framework created and maintained by Google. The team at Google ensures the framework is regularly updated and addresses any bugs or code vulnerabilities immediately. This makes each product built with Angular as well as any data stored on them secure.
Technology
- Angular
- Nx monorepo
- Nx cloud
- Ngrx
- Storybook
- Chromatic
- Nest.js
- Cad Exchanger
- Mjml
- Bitbucket Pipelines
- Pactflow
- Sonarcloud
- Snyk
- AWS S3
References
“House of Angular impressed us with the quality of Angular Development. We see their high expertise in that area. They met our expectations regarding creativity, communication, and openness to our ideas.”
- Gerd Bart, CEO at Transaction Network
“We have cooperated with House Of Angular in few projects and they always supported us with top Angular specialists”
- Jan, CEO at NetInteractive
“We have worked with House Of Angular for few years and the quality of the developers is outstanding. We feel like we have a true partner throughout the process. They are really interested on our long-term success”
- Bram, CEO at Equicty
“We’ve had a long-lasting partnership with House Of Angular. They are the best Angular specialists I have been working with”
- Norbert, Senior Manager at defacto realations GmbH
“We have worked with House Of Angular during the development of our main products. They proved to be really professionals in that area”
- Roger, Development Manager at Hatteland Technology
“The conception, planning and implementation of the software projects fully met our high expectations. The specialists knowledge was always evident in the careful and reliable working style”
- Tobias, CEO at Devlab
Together with House of Angular, we have been working on the development of our product. The skills and quality of the developers are exactly what we needed. We have gained invaluable knowledge, and the quality of our product has soared.
- Martin Merkel, Senior Consultant Product Management, MEDiiO GmbHWe develop top solutions in Angular
If you need high quality Angular you are in right place. We’ve done it for many years for top world brands
Hire us