Asset Management Dashboard For A Railway Giant
Asset Management Dashboard For A Railway Giant
- 1
Strategy
We created mobile and web apps to revolutionise the processes of a railway giant over a project which spanned over two phases, each lasting for a period of seven weeks.
- 2
Analysis Planning
We were given the freedom to choose the appropriate tech stacks and we picked out React for the Frontend along with Redux and Redux Saga for the Backend to create the web version of the app while the team decided that Flutter was the best bet for the mobile application.
- 3
UI/UX
As a part of the UI/UX process, the team on-call designed login screens and the UI for the application. This involved creation of Access suites, Asset summaries UI and the basic layout of the app to provide an enhanced experience to the user.
- 4
Development
As the application was meant to cater to the railway industry, the team integrated maps along with the dashboard API for a streamlined experience along with a Fleet screen for a detailed view of actual train models and screens and a report system to detect a train’s health.
- 5
Testing
Both versions of the app were put through rigorous testing before each feature release to ensure that the development process was going without any hurdles along with a separate time slot set when the product would be sent to the client for UAT.
- 6
Delivery
The end of the project resulted in a successful and robust application being delivered to the client who was ecstatic not just at the outcome of the project but the team’s ability to meet deadlines.
As a heavy industry parts manufacturer, the client's establishment dates to the early 1900's and has now been termed as 'one of the world's largest bearing manufacturers'. Starting out from Europe, the company now has establishments all over the globe and has a steady track record of over a hundred years. With a century worth of expertise in lubricants, bearings and seals, the client aims to change the world through manufacturing solutions and bring a revolution in the industrial climate.
In 2019, we met the client at a national level conference in the capital of the country and had a casual discussion about business, post which the client explored GeekyAnts by scourging through the Internet and landing on our Start websites for dashboards made in various technologies. On the back of that, they reached out to us in a more transactional capacity. With the client's business in the Railways industry, they wanted our help in building a monitoring system for trains that would help maintain hardware in real-time.
We got a chance to involve in two different engagements with the client. The first one was for building a web dashboard to complement their monitoring system and manage trains in real-time. This was under a fixed time model that would last for 7 weeks, divided into 3 major milestones and would include design, development and integration to create a full working dashboard.
The second engagement was for upgrading the dashboard created through the first engagement and create a mobile app version of the same too. This engagement was also under the same model with a total time period of 7 weeks again, with a combined 4 major milestones for all tasks, which would run parallely.
Keeping the complexity and the time constraint of the project, it was an important project for us, and we had to put our best foot forward with the right team to tackle this mission. The entire project was to run parallely and two teams were employed for the job. One team would take up the job of designing an impeccable dashboard for the client and the other would translate it into a mobile app. For the dashboard, 3 expert developers were employed to take up this challenge, led by one of our Engineering Managers who would lead the project and architect it. For the mobile app, 1 developer was put in charge, headed by another Engineering Manager who would look over the entire process of development.
A web-app for railway monitoring systems
The web-app would work in tandem with hardware put in place to monitor train assets such as axle-box, wheels et cetera.
An upgrade of the existing web-app which would feature new functions such as monitoring gearboxes and traction motors as well.
A mobile app version of the monitoring system dashboard to provide mobility and ease of access.
The project consisted of two major workflows. One would result in the we app requested and the second would give birth to a mobile app, complementing the web-app and adding mobility features to it. The client gave us full right to decide the best tech stack for the project and based on our experience and expertise, React was chosen as the technology to build the web app in because React offers a lot of flexibility in terms of development and gives the freedom to choose packages to use based on the requirement of the apps. Behind React, Redux was the chosen State Management technique and Redux Saga was chosen for handling network calls, purely because of their ability to handle large sets of data and making a massive amount of network calls. For the mobile app, Flutter was the chosen technology because of its ability to handle 3D models well and render them in 60fps, thereby minimizing input lags and provide accurate model data.
Although the scope of the project was initially defined, we still chose to adopt an Agile approach towards development. We wanted to make sure that the user experience is great and all relevant information is available on screen and not missed out. For that, we kept sharing builds with the client constantly for feedback. A total of three milestones were decided which would hold multiple sprints within them. The first step in the development process was to set up the infrastructure for the apps and design login screens and UI. This involved creation of Access suites, Asset summaries UI and basic layout of the apps, followed by integration of Dashboard API and maps integration. The second milestone involved the creation of the actual train models and screens for their detailed view through the Fleet Screen. Creating accurate models for the trains and rendering them on the web and mobile app were the heavy ones here and were handled smoothly. The third milestone was to build a report system for train health and defects as well as plotting graphs to visualize overall health of each sensor on the vehicle. This task was divided into integrating APIs for maps in vehicle screens, assed details, Ui for reports and history screens. All these tasks were completed while the mobile app was being built simultaneously and resulted in a perfectly working asset monitoring web app.
The decisions made to translate the web app into the mobile app were precise due to the nature of the backend that was provided by the client. The tech stack was already in place and our work here was to translate the web app in to the existing mobile app as an enhancement. For the mobile app, the assets used were common from the web-app and the real changes lay in the development process. The entire revamping process was divided into two phases. In the first phase, the entire codebase was efactored and a search feature was added.This feature was particularly tricky because we had to implement caching of responses to have it in-app. Subsequently, chart generation was improved and alarms were listed user management features were added. In the second phase, mixed trains model to top train view compositions were added with event failure feedback and performance improvements for larger fleets.
Both the apps were tested manually and rigorously. Every new feature that was built was tested through different scenarios and re-tested with newer features. At every sprint, a fully tested build was shared with the client to test and report any bugs or discrepancies found in the app. A separate time frame was set to fix such anomalies and, at the end, provide a fully functional app to the client.
The sheer technicality of this project posed a lot of functional challenges in front of our developers but they found a way to beat them all. The app was going to handle a large number of network requests, which involved fetching information such as updates from sensors, which were made possible through large API calls to fetch data. This greatly increased load times and sometimes led to infinite loading screens. This was fixed my digging into the API call and isolating the important and relevant calls by priority and loading them first while loading the rest in a background thread, utilizing parallelism. As the server was overloaded with calls, to prevent failure, it started rejecting these calls. To fix this problem, a custom queuing service was built which would sit in between the API service layer and the controller. This service identified calls that were successful and the ones that failed and gave controller its tasks so that the calls in the app don't expire. Another major roadblock was the sheer number of trains and their individual designs. The challenge here was to detect and visualize alarms on trains easily and efficiently. Keeping in mind the different compositions of trains, we made individual assets which represent a single entity and built an algorithm to detect the type of trains the build parts and bogies automatically. In the mobile and web app, with so many features on-board, there was a matter of performance. Performance was managed by making good use of lazy loading on the JS based pages and uglifying and minifying, that helped us reduce the size of the app.
- Google Maps was used for the maps API in the apps.
- Git was used to store source code and manage versioning of the app.
- Bootstrap with SCSS helped in designing the top view for the trains.
- Redux & Redux Saga were instrumental in architecting the application in a layer approach.
In the end, what the client wanted was an app system that would work in collaboration with the legacy system set in place and that is exactly what was delivered to them. According to the client, the timelines were met with and deadlines were fulfilled with grace and ease. A special mention was given to the teams that worked on the project for their knowledge and professionalism. The client mentions our change handling ability to be nothing less than spectacular. The engagement was high quality and management was par excellence. The client is beyond satisfied with the quality of our work and our work ethic. We feel pleased to work with such a client to have such words associated with us makes us humble and even more passionate about what we do. Another happy client is another win for GeekyAnts.