UX/UI mobile app, website Redesign Case Study

This ux redesign case study was created by the UX/UI Designers Szymon Wiśniewski and Maria Krupskaya. Our UI UX Design Team is highly specialized in creating a unique user experience for any software, web and mobile applications alike. Seek the expertise of our UI/ UX design team and ensure the best quality of your product by choosing the best Python Web Development Company.

Updated: 23.12.2022

About

Tarot Routing uses state-of-the-art algorithms to plan more efficient last-mile driving routes faster than humans can. Customers reduce their driving time by 30% and, of course, reduce their CO2 emissions, petrol consumption, driver salaries, and maintenance costs.

Challenge

Tarot Routing was in the MVP stage when Profil Software began working on it. They needed to develop substantial new features in order to create an offering sufficient for clients looking for Enterprise Software Development Services. Both ui elements and design elements needed to be worked on. Additionally, as Tarot Routing's user base increased, they needed to address platform resiliency and scalability more and more.

As you may see below on the before and after pictures, our team improved the visuals, making the app more user-friendly. Important information is displayed in a manner that allows for a quicker understanding and effortless search.

Solution

Profil Software's full-stack development team has developed many substantial features in the Route Optimization Software, Tarot Routing, including Map-Based Drag & Drop Route Adjustments, Websockets for real-time updates, Real-Time Driver Tracking, Cross-Platform Mobile App, and Frontend Unit Tests.

UX Review

The web service and the app Tarot Analytics was losing the love of users, due to a myriad of reasons. Along with the competition, one major factor for the high customer churn was a clumsy design which negatively affected the customer experience. Our ui ux team used their expertise in mobile apps design, ui design and ux design to bring the design up to date and satisfaction of its users. One should always take care of creating the best user experience to prevent customer churn.

Old design vs new design

What we could see in an old design?

• No trust through communication with the user
• Lack of connection with the real world
• No consistency within the product
• No error prevention whatsoever
• Ancient, inconsistent, hideous visuals
• Issues with compatibility and responsiveness

We needed to come up with a way to turn all the weaknesses of the old design into the strengths in the process of the app redesign.

This is why we focused on implementing these things into the new design:

• introducing a more consistent, more transparent and modern design to improve user journey
• improving user interface and communication with the user
• making the app more responsive and reducing compatibility issues to clear out pain points
• implementing error prevention
• enabling the connection with the real world

Let's take a look at the old and new design:

The goal was to deliver mobile-friendly and user-friendly, responsive design to create a seamless and attractive user experience across all devices to increase user engagement and functionality of the web and mobile app design. That required us to not only go through the ux process but also to involve our software testing services in the process as well.

Our Approach and process

Context Study

Our client struggled with the outdated look and feel of his service. Our task was to refresh the appearance and the experience. Our UI UX Team conducted user research and created 2 profiles of target users. 2 user profiles were the drivers and the managing people. The drivers were supposed to use mainly the mobile application.

Target Audience

Using the results of the information given during the user testing phase and the analysis conducted thanks to user surveys, we created three personas that embody the traits of the target audience.

Our workflow

1.Rebranding

Creating the Style Guide

The goal is to make people aware that our client updated his brand. Both web design and mobile app design was changed with accordance to user interviews.

Our UI/UX designers have developed a design system to establish the brand's identity in the minds of users and product owners. The design process was set up on the basis of the way a user interacts with the app, design thinking, business goals and brand guidelines.

1. Web App Redesign

Changing and updating the content, structure, format, and navigation of the service to improve performance were all very important to us. We wanted to introduce an app redesign that would be good enough to retain existing users and make sure that when users interact with the app they don't have any trouble navigating it.

Timeline

The timeline feature lets you Drag and Drop to reallocate or reorder your jobs. In the new design you can watch the map update automatically and see the impact on your ETAs. We made sure the user can choose their favorite timeline's position so that when users navigate the app they can do it quicker.

As you can see the old design was less clear and thus users had to waste their time on inspecting the screen. Our new design made the whole process easier for user and less time-consuming.

Tracking

Tarot Analytics let its customers track the driver to the door, just like Uber. As you can see on the picture above, the old design was outdated and it was not as easily accessible due to the poor concept of the design. The new design brought some fresh air, making the process of tracking simpler. It shows more useful information and displays it in a way that is easy to read. Tracking one car out of all of them became an uncomplicated process with the new design.

Below you can look at more screenshot of the new improved design that played a crucial role retaining the users.

The clients also get real-time ETAs, and self-service PoD so they don't have to call them 100x per day anymore.

2. Mobile App Redesign

We applied all the rebranding decisions to keep the application up to date and make the app design look and feel fresh. Our ui and ux design services always include following the UX design process that gives users an intuitive and pleasurable experience and also gives room for improvements of the design.

Themes

Light & Dark Mode

The ux research carried out revealed a frequent problem faced by drivers was the poor visibility and contrast of the application due to their shifts.

To prevent this from happening, our ux designer came up with a solution in the form of screen modes (Light & Dark). It improved ux design and made the final product much more user friendly, which is something you should always strive for as not listening to your potential client is one of the reasons why startups fail and one of the software development challenges that any startup has to overcome.

For this reason we always recommend conducting Product Discovery Workshops before and during the development process to ensure that your business goals align with user needs and that your product will succeed. If you're unsure of whether it's important for your bussiness or want to learn more about the process, you can do it from our article on 6 steps on how to do Product Discovery Workshop.