Vehicle Inspection App
Modernizing the way our auto inspectors work
The Team
UX Team: Jens D., me
Product Team: Brett C., Jessica G., Christian B.
Lead Architect (Development): Mudassir A.
*Several others were involved b
My Role
UX Architect + Designer
Utilized and Reviewed Research
Consulted on feature prioritization
Consulted with Product and Dev teams to ensure we were building the correct tool
Designed the native application
The Client
Cox Automotive - Manheim
Cox Automotive Manheim is an automotive auction company. They help dealers buy and sell used vehicles.
I work on their Client Services team, building various applications to help our employees do their jobs more efficiently. For this specific project, I have been focusing on mechanical inspectors, and how we can make their inspection process easier.
Project Overview
Bringing efficiency to an archaic process
Post-sale inspections are a necessity at Cox Automotive Manheim. The vehicles that are sold on auction day must be inspected and finalized before they can be sent on to their new homes at various dealerships across the USA. Some of these auction locations sell upwards of 500 vehicles in one day, making speed (but also thoroughness) a very important aspect of the post-sale inspection process.
Our inspectors were using an outdated platform called ePSI (e-Post Sale Inspection tool) to input any issues or concerns they come across, lugging around a very expensive (and very heavy) rugged laptop computer, and struggling with internet connectivity all while trying to inspect as many vehicles as possible in a workday.
Our company was about to purchase over $1,000,000.00 in new rugged laptops (aptly named “the brick”) when my team recommended a much cheaper solution, that eliminated the need to purchase additional equipment at all.
We simply had to ask ourselves this very important question:
How might we make the Post Sale Inspection process easier, while simultaneously reducing wasted time and company spending?
The Solution
A Native Application which they can access through their own Android devices, or company-issued (and prolific) TC75 phones and Zebra Tablets. This app has been modernized and designed to make the inspection process much more seamless and easy-to-use.
Building an App
The Initial Solution
After our initial discovery sessions and learning about what our users wanted, I built an Axure prototype to test on our users.
How did we get to this solution?
Originally, I wanted the Builder Page to look like this:
I wanted the designer to be able to drag and drop different page templates onto a pre-built “flow” to make it look a lot like a user flow.
The problem is, when I showed it to designers, the first comment I got was “Woah this is a lot.”
The point of a wizard is to simplify and direct your user, to make it so easy a 5-year-old can do it. So I simplified it.
Designer reactions to the Activity Builder feature:
“This is SO MUCH BETTER!”
“I like that I don’t have to think at all. I have 2 choices, name my Activity, and start building a page. Easy”
Building Question & Content Pages
Integrating the Question and Content pages into the Wizard
As you saw in the first feature, you get 2 choices when you want to build a page:
Content
Question
The Content Wizard page is simple, it looks like this:
User puts the templated information in the designated areas
Page Preview: this is how this content page will look for our designer’s user
The Question Wizard is more complicated.
We have 5 Question types that had to be integrated into the Activity Wizard. For times sake, here’s an example of the Question Wizard with a 2 answer multiple choice Question:
Here’s the Question Page Wizard
Designers can preview the Question, as well as what happens when the user clicks the correct or incorrect answer
How did we get to this solution?
We knew we needed to make these pages as intuitive as possible, so we wanted to mimic what the designers already know: the actual pages they have been and will be building.
So first, we had to templatize those pages, not only so we could mimic them in the builder, but also so we could give the page specs to engineers.
This was my attempt at making sure we fully understood the page anatomy, so we could properly templatize and organize information in the wizard
The Original Idea, in all it’s glory.
This is my co-designer Zoe’s 1st version of the Multiple Choice 2 Answer Question Wizard page.
We changed a lot from this original idea to the final version. We had to update our input fields for accessibility and consistency reasons. I’ll fill you in on what happened with the input fields in a mini-case study. They had to be redesigned.
As for the rest of it, we realized from early feedback that this was not an intuitive way for our users to build a page.
We work with a lot of visual people. They needed to see the layout of the page they were building as they were building it, similar to Figma.
This also did not mesh well with the way the Activity Wizard was built, so Zoe and I tackled this together, created new components, and came up with the result you see
Did the Design work?
Yes and no. The Question page needs more iteration.
The Bad
Our users found that using a modal to choose the question type from a long list was quite tedious. This idea is currently being re-considered.
Our users did not like having to click “Add Justification” in order to get a text input box, we plan on making this text box readily available
The Good
Our users felt the new layout was significantly easier to understand
Our users navigated the new layout more quickly with significantly less questions
Next Steps
We Are Not Done, the Activity Wizard Needs More Consideration
A list of considerations that need to be made:
Adding a “Save as Draft” feature
Determining who has say over publishing content live to the website (and how to restrict and allow access)
Determining users and the user flows for each level of access
Determining the animation used for reordering pages in the Activity Builder Page
Considering alternative methods to modals for selecting the Question or Content pages
Updating the Question Wizard so that all text input boxes are visible at all times (rather than selecting “add justification”)
Testing the current Activity Wizard on our users to get more input
Determining whether we need to adjust the page min/max for an Activity
What I Learned
Collaborating with Zoe, my Co-Designer
During this project, Zoe and I delegated the work. However, we were both working on pieces of a larger pie, so we understood the need to collaborate more, because each step of the wizard needed to maintain consistency. We also knew we needed to figure out exactly how this full activity building wizard would work. We spent a lot of time together in these weeks, figuring things out and talking through problems that came up. And I think collaborating in this way (and with the others) made this one of the interface designs I am most proud of.
Collaborating with Product Management & Senior Designers
Not only was I able to collaborate with my fellow designer, Zoe, I was also able to utilize our Product Manager, Aaron, as well as one of my mentors, Alyssa. I went to Aaron early and often with different ideas and he was able to help me maintain my focus and direction.
Collaborating with Engineers
It was also extremely useful to discuss with our engineers the feasibility of some of the features we were considering. Here are some of the the things I learned after showing the engineers what we were proposing to create:
I learned that it’s easier for an engineer to build another page than create a pop-up (at least the engineers we have). However, it might be worth the trade-off for them to learn the skills.
I also learned that it was much more involved for them to build a drag-and-drop image uploader than just having the image upload button.
I learned that it would be easy to create a text editing tool, but it would take them a long time to style it to fit our aesthetic.
Feature Iterations Chart
If you’d like to deep dive into all the features and iterations that went into each feature, please feel free to check out the chart of the Activity Wizard Features and how they evolved over the process of it’s creation!