top of page
An App for Car Accidents
Mobile Design System
Overview & Goals
CCC Intelligent Solutions offers a wide variety of mobile application products to its customers. Among them is Quick Estimate - an application that provides users a way to send photos and information about their recent car accident to their insurer to quickly obtain an estimated cost of repair and recommendations on repair shops suitable for their claim. It's a stressful and annoying situation, as users must navigate through the multiple steps of a complicated claim process to get their car back onto the road as fast as required.
How do we improve upon the current version of Quick Estimate and design it in a way that is optimized for flexibility, ease of use, and scalable for future changes in workflow?
1.0's Flow vs 2.0
This project's working title is Mobile Modules 2.0, which gets its name from the concept that there are specific reoccurring mini-flows that appear across various CCC applications, e.g. a common flow for guiding the user to take photos of their vehicle. These smaller building blocks are named modules, and are mixed and matched to create app flows for unique use cases, such as Quick Estimate. These blocks before the redesign were developer constructs, determined by the development team to implement applications in a systematic way.
The previous design for Quick Estimate features a linear flow that strings together these blocks and asks the user to complete them in one blind shot. The 2.0 redesign proposes an alternate approach where these modules are design-driven and decided on how to best guide the user through the claims process step-by-step.
The Hub & Spoke Screen
The main UX update for the redesign was the introduction of the home screen. Nicknamed the hub and spoke, the home screen features three views centered around the tasks that a user must complete to reach their final goal: obtain a cost of repair for their vehicle, and to schedule an appointment with a repair facility. The new view features a list of remaining tasks and the amount of time it takes to complete them. Additionally, future tasks are unlocked as the user progresses, and provides clarity that the entire process need not be completed in one shot. All work is saved, and the user may navigate this process on their own schedule. Future tasks are still shown to demystify the claims process - users get a clear, partitioned list of what steps they must complete.
UI Updates: The Design System
The app's UI was also updated to match modern design practices and introduce patterns that can be scaled into other mobile apps in CCC's portfolio. In addition to reusable components, the art style for onboarding illustrations were drawn and developed to further define the visual language of apps in the organization.
Additional UX Updates
Certain screens also got revised as a result of the new design system. Some older designs for example densely packed multiple data inputs onto one screen. Those forms were broken out so that each question received it's own screen. The number of clicks stays the same, but those clicks are now spread out so that the user has an easier time processing and answering these questions. This system also makes this flow more easily configured if certain insurance carriers wanted to add or omit any questions, and avoids the necessity of redesigning the same screen over and over again.
Additional UX Updates
In a similar vein, the linear photo capture flow was redesigned to introduce more clarity and flexibility. Users can now complete the general photos and damage photos of their vehicle in any order. Previously, users had to follow a strict set order of photos in a carousel pattern. This was replaced by an overhead diagram that allows the user to pick and choose which photos they want to take and in what order. The app is more upfront and clear about what is being asked, and the user can complete this step in whatever way best suits them.
Moderated user testing was done to test the app's new designs with users via usertesting.com. Additionally, in-person testing was done to further understand how users felt about the new photo capture process by being asked to use the app to take photos of their own car. Feedback from users were incorporated into the designs before final handoff to development.
bottom of page