Scope: 10-week long re-design project focused on defining and designing a MVP Portal Design
My Role: Lead UX Researcher & UX Designer
Client: Automotive Client
The client wanted to re-imagine and consolidate their two current rating platforms into one single, unified portal experience. This project focused on re-designing an MVP Portal to allow F&I Managers at car dealerships to rate and contract car warranty products for consumers.
+ Understand current state user flows and identify areas of improvement to increase overall user satisfaction
+ Simplify the overall UX of the existing tools into
one single experience based to save dealers time
+ Improve the overall experience for dealers using the system so it's easier and faster to sell warranty products
User Interviews, Design Workshops, Wireframes, Prototyping, UX/UI Design, Usability Testing, Surveys
A straightforward and clear starting point to make it easy for F&I managers to get started creating a new quote for a customer.
The top navigation was simplified to make it clear was dealer the user was logged in as. The design of the top nav was also chose to ensure it could be flexible to expand and include new features.
Streamlined steps were created to make it easy for the F&I manager to follow the process and steps that need to be completed to finalizing the contract, ensuring fewer mistakes and time spent collecting all the information.
Design a rate selection grid that enhanced the current state, by simplifying drop down menus and indicators.
Final summary view cleanly shows the F&I Manager and customer all of their selections and final prices before finalizing the contract.
Implemented a "Dealer View" toggle to make it easy for Dealers to manually adjust their profit margins while keeping it hidden from customers.
Generative Research
Discover
Ideate & Prototype
Deliver
Test
More below on why we tested
after delivering designs
Competitive Analysis, 4 Semi-structured user interviews, and 3 interviews with internal portal SMEs
Used insights from generative research to determine design requirements & create wireframes.
Created a prototype of the new experience to gather feedback from stakeholders.
Refined the design based on usability test, and created a design system to apply final visuals
1:1 usability studies to validate the new process and determine overall ease of use.
Wireframes
Hi-Fidelity Designs
Where I joined the project
Development Handoff
Qualitative Usability Testing
Prototype
Our team conducted a Competitive Analysis, Semi-structured user interviews with Dealer Groups, and Internal Stakeholder Cognitive Walkthroughs to better understand the current state and start identifying future state needs.
Review other rating and contracting tools to identifying potential areas of opportunity and gaps in the current portal experience.
1. What features is the current portal missing that could add value?
2. What trends exist in other platforms that the new portal design should include?
Learn more about how the current portals function, and observe the current features in use in a live cognitive walkthrough.
1. Better understand current portal capabilities and potential scope.
2. What assumptions do our stakeholders have about the current portal design, and what if anything have they heard from their customers?
4. How do the two current platforms differ, and how are they they same?
Capture qualitative data from F&I Managers currently using the platforms to understand what works well, and areas from improvement. We interviewed F&I Managers from the same Dealer Groups together.
1. How do F&I Managers feel about the platform today? What tasks do they perform on the portal to fulfill their responsibilities?
2. What prevents current users from being able to efficiently create a quote and contract for their customers?
3. What are the “quick wins” for improving the MVP design?
Triangulated insights from our Semi-Structured Interviews, Internal Stakeholder Cognitive Walkthrough, and Competitive Analysis.
Participants interviewed revealed they informally interview the customer at the start of the rating process to understand their needs. The platform should be easy to customize necessary information to fit customer needs.
One of the current platforms had a complicated process of choosing the right price, which required lots of scrolling and clicking to find the right rate for the customer's needs, and ultimately increased time for the user to create a quote.
2 of the 4 Dealer Groups we interviewed were using alternative platforms as their main tool because it offered a better DMS system to manage all their customers’ information.
Floating Action Buttons (FABs) were off to one side and requires users to click into each one in order to complete the process, which forced them to navigate back and forth between screens to complete simple tasks like selecting a rate, or adding a product.
F&I Managers will sometimes be at their desk or sometimes be in the open main area of the car dealership.
Compared to other proprietary systems on the market being used, some participants wanted more capabilities, such as e-signature, to make their day-to-day easier.
Stakeholder involvement:
We reviewed the new prototyped experience with our stakeholders and business analysts to iterate on the design based on refined requirements to ensure we were capturing technical details required.
Screens focused on the following areas
+ Landing Screen Create a Quote
+ Search for Existing Quote
+ Choose Customer Products & Get a Rate
+ Add a Payment Plan
+ Finalize the Quote to a Contract
Our client changed their mind about the timeline & deliverables:
Despite our team advocating the importance of testing the wireframes. However, the client agreed to do a usability study after the final hi-fidelity designs were complete -- better test late than never!
1. Is the new portal design easy to use?
2. Are F&I Managers able to successfully create a new quote and contract for a customer?
3. How do participants feel about the new design and revised rating and contracting process?
4. What is the overall user satisfaction?
11 participants | 7 current users of Portal 1 | 4 current users of portal 2
The client provided us a list of participants for we could reach out to, given their personal connection and relationships with dealerships. We requested a mix of participants that current use both portals.
1. Starting a Quote for a Customer
2. Adding Product & Rates to a Quote
3. Adding a Monthly Payment Plan
4. Finalizing the Quote to a Contract
+ 11 of 11 participants noticed & found the ”Change” button
+ 10 of 11 participants felt the “Create New Quote” inputs were clear to understand and start the quote
+ 7 of 11 participants liked the table/grid view and thought it was easy to use
+ 10 of 11 participants were able to change the product price without any issues
+ 8 of 11 participants were able to easily identify when a product was added
+ 8 of 11 participants liked the information provided by the “Dealer View” toggle
+ 5 of 11 participants liked the ability to “VOID”a contract directly on the “Success” screen
+ 7 of 11 participants found the term 'Uses and Attributes' confusing; would prefer a different term for that section
Recommendation: Change “Uses and Attributes to a term that is more familiar to F&I Managers, such as “Quote Add-ons” or “Surcharges”
+ Include only add-ons that require selection and make any that could be automatically added to the product rating be automatic
+ 4 of 11 participants said they would not want to print a grid view as it would provide the customer with too many options to choose from
+ 6 of 11 participants felt that Print Prices button was redundant and not needed
+ 5 of 11 participants did not notice the Quotes bar
Recommendation: Remove redundancy with the print options by making print prices option more subtle
+ To print grid, create a subtle link within the grid modal to remove redundancy but have it available for users that want it
+ 6 of 10 participants were not clear how “Uses & Attributes” affected product options
+ 5 of 10 participants would have expected selections from the initial screen to increase product rates
+ 4 of 10 participants expected some options to appear under “Options/Surcharges” dropdown, while others be added automatically
Recommendation: Show selected “Uses & Attributes”on Step 2 to allow users to make updates, and consider renaming “Uses & Attributes” to “Surcharges”
+ Add a button to show “Uses & Attributes” on this screen, and upon selecting would behave similarly to filter selections
+ 5 of 11 participants wanted a "Back" button to go back and change a product rate
+ 5 of 11 participants knew the stepper was clickable and successfully navigated back to Step 2 with it
+ 3 of 11 participants did not expect stepper to be clickable
Recommendation: Add a “BACK” button on the bottom left of the footer that allows users to navigation back to the previous step
+ The stepper should still be functional and potentially easy learned behavior, but this provides another intuitive way for users to navigate the quote + contracting process and eliminate any confusion
+ 4.2 average rating on participant satisfaction using the system to complete the scenarios
+ 4.3 average rating on how easy participants found the portal
+ 4.8 average rating on how confident participants were in completing the F&I process correctly
Script Limitations for 1:1 User Interviews: The client was concerned their partners and competitors would learn about the new platform re-design, and request we approach user interviews under the guise of "general market research".
This greatly limited our ability to directly ask current users about their experience using the platform, which made it difficult to gain insights about areas of improvement. We requested to do internal stakeholder walkthroughs of the platforms where we could ask more direct question. If we had more say, I would have requested we find participants that were willing to sign an NDA, and potentially have paused the user interviews until the client was comfortable sharing the news about the re-design.
The client gave us an extremely limited list of participants, sometimes internal employees who weren't true users.
+ We worked with the client to explain why the insights derived from internal users would be biased and potentially inaccurate to a user's experience. This helped us work with the client get more target participants.
There was mismatch in expectations around the generative research producing the business requirements and user stories for the final design.
+ Level-setting expectations and team dynamics upfront is important ensure everyone's are being accounted for.
+ We also found new ways to collect and solicit feedback on research and designs by using tools such as MURAL so the client could have visibility into the work.
Our original timeline was delayed due to some of the above challenges, causing the client to request removing user testing. Despite our design team pushback, we ultimately had to deliver final designs before getting user feedback on the wireframes.
+ Learned how to be flexible and complete final designs as best as possible. As we designed, we documented specific areas and tasks we would like to test.
+ We convinced the client to still do a usability study on the wireframes afterwards, explaining it would validate some their concerns and provide insights about specific elements.
+ If I could go back, I would have taken more time specifically on this step to before concept testing or A/B testing on several main aspects of the flow, such as selecting a rate for a product, to confirm we were headed in the right direction.
Delivered final, responsive designs that were streamlined and designed to reduce user cognitive load
+ The generative research we conducted ensured we were deriving design decisions based on insights
+ The final designs were more streamlined by providing clear steps compared to the original portal, which had the potential impact to increase product sales.
Handed off full usability report to the client which validated design improvements & next steps
+ The usability study provided validation that in general users were happy with the new design and felt it was an improvement from the current system
+ The report included design recommendations that could have be designed and implemented in the first sprints of the MVP development
Insights into future state needs and digital capabilities the portal should consider
+ User insights from generative research sessions and usability studies provided the client with features and ideas to consider in the next phase of work
+ These insights could be used to drive a future state roadmap
+ I would have advocated for more brainstorming and co-design sessions to help define the new flow before finalizing the wireframes. This would have helped stakeholders feel more involved, and would have allowed us to ideate more and test different concepts.
+ Request we do user shadowing at some of the car dealerships to see how F&I managers use the tool with a customer. Seeing the process live and getting a chance to view the experience would have helped us understand the flow and pain points.
+ User testing, even if not at the ideal part of the process, is still better than no testing!
+ How to be flexible and still derive insights even when research sessions or participant selection isn't ideal.
+ Stakeholder buy-in and understanding the value of the UX process largely influences pivots in the direction of a project, and in the outcome of key decisions. In specific situations it's important to remain flexible and creative, finding new methods and workarounds to ensure the team is able to get insights from users to drive key decisions.
+ Understanding stakeholder dynamics is important to learn upfront, for example if a stakeholder is personally attached to their product like in our case. This can help the team strategically manage initial timeline and approach conversations to ensure the client is onboard with the UX process and its value.