CarQuest

A conversational AI web app that guides non-expert users to find, compare, and buy cars suited to their lifestyle

Project at a Glance

The problem:
CarQuest addresses the challenges buyers face in finding cars. Traditional auto sites assume users know models and technical specs, pushing many to rely on advice from car-savvy friends. Platforms like Cars.com often have limited inventory, high prices, or may not be trustworthy, making the car-buying process overwhelming and time-consuming.

The solution:
A responsive web app that guides users in choosing a pre-owned car based on lifestyle, through natural conversation. It helps users search, compare, and purchase cars using aggregated data from multiple car sources. Designs directly informed launched MVP.

My role:
UX/Product Designer and Project Manager

Team size:
Myself and 3 others (4 people total)

Timeline:
3 weeks

Skills Design:
Prototyping, wireframing, creating low-to-hi fi mockups; component creation; interaction design; visual design; storyboards, discovery stakeholder and user interviews, competitor analysis, heuristic analysis, usability testing, 5-second testing

Tools:
Figjam; Canva, Google Forms and Docs, Trello, Slack

Privacy note:
Stakeholder and company name have been anonymized; case study published with explicit stakeholder permission

Our stakeholder's goal was to create a web app that was new to the world, addressing challenges faced by non-car-savvy buyers. We started from essentially scratch, as the stakeholder had left the design vision open-ended.

The Goal

To create a web app that uses conversational AI to recommend cars and enable users to search, compare, and buy vehicles based on their lifestyle and needs.

Users were non-car-savvy individuals (e.g., laypeople)

They typically relied on others for advice and struggled with the fragmented experience of comparing information across different sources

We did face two main constraints:

1. Complexity: The stakeholder provided us with a 5-page document with detailed project requirements. We had to prioritize and narrow the scope to fit the our design sprint's time frame.

2. Blue: The only firm design requirement was the use of the color blue, which the stakeholder was passionate about for its futuristic look and its association with trust and calm.

We applied the Design Thinking double diamond UX process to create the CarQuest web app from scratch, following the phases of Discover, Define, Develop, and Deliver.

I led and managed the UX design team while performing each step of the user-centered design process. Specifically, I:

  • DESIGN

    • Performed a thorough competitive analysis

    • Co-created the user persona

    • Co-affinitized and synthesized all research results

    • Sourced many digital artifacts to a mood board and UI inspiration document

    • Contributed to the style guide and brand templates (e.g., slide decks) for all stakeholder meeting deliverables

    • Created initial sketches and designed our product from 0-to-1 based on research learnings

    • Took the lead on all screens and prototypes at each phase of fidelity (e.g., low, medium, and high) for mobile

  • RESEARCH

    • Created the entirety of all research plans (discovery interviews, usability testing and 5-second testing guides) and overall testing strategy

    • Conducted approximately half of all live research sessions performed

    • Consulted on survey design

  • PROJECT MANAGEMENT

    • Conceptualized, planned, and led all stakeholder meetings

    • Created outlines and scripts for our presentation to stakeholders

    • Polished all high-fidelity deliverables for a handoff and implementation

Phase 1, Discover: User Research

Our initial discovery research involved:

Discovery interviews with potential users (excerpt of insights shown);

A survey (excerpt shown);

A heuristic evaluation (excerpt shown); and

A competitive analysis of chatbots like ChatGPT and various car-buying platforms (excerpt shown).

We collaborated closely with the three-person founding team, primarily the Product Manager, and presented to the Engineering and Machine Learning Leads. They provided us with four conceptual wireframes as inspiration, emphasizing that we had full creative license to modify as needed.

We faced several design challenges, including bridging the gap between how non-car-savvy users naturally talk about cars and how existing websites present information, which often focuses on technical specs and jargon.

CarQuest aims to integrate these "two languages" by allowing users to search in their own words. Another challenge was combining separate elements - chatbots and car-buying platforms - into a seamless, user-friendly flow.

For inspiration, we drew from futuristic UIs and non-car-related sites, like Slack for web app structure and Yelp for search refinement.

Our mood board featured images of AI, robots, "friendly car" aesthetics, and lifestyle shots, emphasizing a color scheme with blues and purples.

Phase 2, Define: Synthesis

To guide our design process, we developed a user persona named Janine, a 34-year-old paralegal living in Los Angeles.

She enjoys taking fun trips with her two kids, but after a recent divorce, she found herself without a car. Now, needing a vehicle that fits her lifestyle and budget, Janine feels overwhelmed by the traditional car-buying process (as shown in the storyboard below).

Janine’s struggles informed our problem statement:

Janine finds the traditional car buying process frustrating and is seeking a more straightforward approach to finding a vehicle that aligns with her lifestyle and needs.

Phase 3, Develop: Ideation & Prototyping

For the ideation process, our biggest challenge was designing a new digital product from scratch while bridging two "languages" - how non-experts talk about cars and the technical details often found on car-buying sites. We created a seamless, user-friendly flow that combined the conversational AI flow with comprehensive car-buying features.

We explored different directions for the product’s look and feel.

One approach leaned toward a friendly, intuitive design, like chatting with a helpful friend, while the other aimed for a futuristic, tech-savvy aesthetic.

Ultimately, we balanced these extremes to create a modern, approachable design (style tile below), part of a larger integrated style guide that supports the user experience, making the complex feel simple.

Our discovery research insights informed our initial sketches and wireframing process.

We conducted usability and 5-second tests after each stage of design. In total, we tested 15 users across both mobile and desktop. Each round of testing enabled us to iterate and refine the design further.

Phase 4, Deliver: User Testing

After reviewing our notes, affinity diagram, and 2x2 priority matrix, our top takeaways that were reflected in subsequent iterations were:

1) Quiz Introduction Refinement: We began with an open-ended text box but found it lacked direction. So, we switched to simpler, easier questions and added example text to guide users through their responses.

2) Clarifying Purpose: Early participants thought CarQuest was just a quiz, not a tool to search and buy real vehicles. We updated the home screen to clearly explain CarQuest’s mission.

3. Name Reversion: We tested changing the name to CarBot, but feedback from an A/B variant test led us to revert to CarQuest, which we ultimately kept.

Above, you can view a walkthrough video of the web app prototype.

So What? Results & Outcomes

Our stakeholder and his co-founders were highly impressed with our work, describing the web app as "excellent", "exactly what they were looking for" and "ready for implementation."

They also noted that our presentation was more professional than that of several well-established agencies they had previously worked with, despite those agencies having entire design teams.

We collaborated with the team to coordinate an implementation schedule in late 2024. We worked closely with their Lead Engineer to ensure that our CarQuest vision would launch as their MVP (which it did!)

Lessons Learned

Through this project, we learned that...

  • 1. It was valuable to navigate the complex relationship between user-centered design and stakeholder expectations and constraints.

  • 2. Integrating aspects of two inspirational aesthetics is challenging but rewarding.

  • 3. Lastly, the double diamond process can be messy, nonlinear, and iterative.
Next

Nonprofit Mobile-first Responsive Redesign