Greenfield UI to Work with Existing Backend for Freight Intelligence Client
Overview
The client, a supply chain technology solutions provider, offers a freight management platform that helps companies and customers manage the quality and accuracy of shipments with greater ease.
This Dot Labs helped develop an easy-to-navigate interface that would allow users to access all relevant data and metrics with a single click.
Services Provided
We built a greenfield application interface to integrate with an existing backend. Our primary goal was to work with the client’s senior management and technical team to help bring the product to market.
The platform provides supply chain visibility so companies can proactively respond to potential challenges. Its high level features automatically track and notify users of accidents, changes in container temperature, freight velocity, delivery locations, and more through an interactive map that helps users visualize and contextualize updates.
Tech-stack
- Lit for lightweight and performant Web Components.
- Typescript to improve code quality and reliability.
- Here Map API to build highly customized map and location based features.
- Cypress to provide an end to end (E2E) testing suite to improve code reliability.
- Rollup to compile newer ES6 modules into Legacy code for greater browser support.
- Storybook to support the development of UI components in isolation. This helps improve the quality and reusability of the components
This Dot Labs is a development consultancy focused on providing staff augmentation, architectural guidance, and consulting to companies.
We help implement and teach modern web best practices with technologies such as React, Angular, Vue, Web Components, GraphQL, Node, and more.
The client is an American supply chain technology company offering advanced security and intelligence to companies moving freight. Its platform elevates supply chain visibility, and empowers companies to proactively respond to potential challenges by automatically tracking and notifying users of accidents, changes in container temperature, freight velocity, delivery locations, and more.
Working Within Client Requirements
In order to make their codebase more flexible, the client team asked that the project be built with a limited number of dependencies and external packages.
While the developers at This Dot Labs built the user interface, the client team worked on the API. In order to best promote this collaboration, our team took an agile approach, allowing a rapid feedback loop that helped quickly and effectively wire the two ends.
Advanced Visualization for Freight Management
The interface allows users to look at the physical location of a tracker, stored with the pallet or package for example, enabling users to see the location of a tracker on the map, including the nearest address, with just one click.
Once a user has located their tracker, they can also check various metrics, including its speed and direction of travel, and the temperature of its environment.
Customized Control Over the Shipment Process
Understanding that a variety of users at different scales need to be able to benefit from the same interface, users are able to adjust their visual preferences, including whether they want to see individual trackers on the map, or clusters of trackers based on proximity. Users can also see both historical and projected freight movement for each tracker, or simply choose to see real time visuals.
Customizable notifications automatically alert users whenever a chosen condition is met, from when a package reaches within a certain distance from a specific location, to if a tracker’s battery level falls below a chosen percent. This process can be refined even further by using geofencing, which allows users to send custom notifications when trackers enter a particular area on the map, which can be automatically generated, or hand drawn using tools offered by the interface, offering street level specificity.
Store Documents to Centralize Freight Administration
In order to help marry the freight visualization and administration processes, the team at This Dot introduced documentation storage on the interface, which allows users to view and download documents and images uploaded from a mobile app in relation to an active tracker. This can help users better manage their administrative workload, identify damage or get paid for shipments more quickly, and better communicate with recipients.
Let's see how This Dot can help you
Are you looking for a development consulting firm that can provide staff augmentation, architectural guidance, and consulting to your company? Look no further than This Dot Labs. Our team of experienced developers and managers can help you implement and teach modern web best practices, and deliver your projects on time and within budget. Contact us today to learn more about our services and how we can help you achieve your development goals.
You might also like
Portfolio
Our clients are building for the future. Explore This Dot Labs' portfolio, and see how we have helped them achieve their diverse technical goals.
Developer Experience: Building Blocks for AMP Success: This Dot Labs Innovative Approach to Open Source Education
topics covered in this case study:
The team behind the Google HTML-based web development framework, Accelerated Mobile Pages (AMP), approached This Dot Labs for an educational strategy and resources. Our team provided an array of developer experience and advocacy services to help attract and empower new users.
Building a Web 3 Ecosystem: Chainlink and This Dot Labs Deliver a Comprehensive Resource for Developers
topics covered in this case study:
In collaboration with Chainlink Labs, This Dot Labs both designed and developed the Ecosystem Map application with the goal of delivering a product that could scale to feature a large number of resources while remaining simple to navigate, fully responsive, and accessible.
Launching Smart Contract Database (DB), an Open-Source Website for the Chainlink Developer Ecosystem
topics covered in this case study:
Supported by a Chainlink Community Grant, This Dot Labs recently created Smart Contract Database (DB), an open-source website for the Chainlink developer ecosystem.
- See full portfolio