Shopmanager - Customer Capture Flow

Shopmanager - Customer Capture Flow

Boosted shop efficiency by 30% and increase work order customer information captured by 45% through a user centered redesign of the work order system

Boosted shop efficiency by 30% and increase work order customer information captured by 45% through a user centered redesign of the work order system

Shopmanager SaaS Platform

Shopmanager SaaS Platform

Shopmanager SaaS Platform

Product Design

Product Design

Product Design

2 Months

2 Months

2 Months

Members Template
Members Template
Members Template

Introduction

As a UX designer, I’m always seeking real-world challenges where I can refine my end-to-end design skills. In exploring issues across auto repair shops, I discovered a persistent complaint about the customer capture process within ShopManager, a cloud-based software for managing scheduling, parts, and billing.

Their existing system displayed all data fields on one massive screen, with zero steps or instructions. Service advisors found it confusing, technicians rarely knew where to look for essential details, and shop owners lamented the lack of an organized workflow. I posed one main question:

How might we transform a cluttered single screen into a clear, guided experience that helps staff capture customer and vehicle details with confidence?



Research and Initial Assumptions

To ground my approach, I needed to understand the full scope of the problem and verify some assumptions about the one-screen user experience.



Value Proposition – Why Should It Be Made?

By redesigning this single screen to be more structured, we could:

  • Remove Clutter: Display only the relevant fields at each stage, so staff can focus on what matters.


  • Reduce Errors: Provide real-time prompts or validations, ensuring complete and accurate customer/vehicle info on the first try.

  • Empower Communication: Clarify each piece of data so technicians and owners don’t have to decipher a jumbled interface or re-ask the same questions.




Personas – Who Is It For?
  • Busy Professionals (Service Advisors): They have minimal time to fill out details. They need a tool that’s instantly understandable, especially when the phone rings mid-entry.

  • Seasoned Shop Owners: They’re looking for an organized method to see overall shop status. Confusing single screens with hundreds of fields hamper that visibility.

  • Technicians: They don’t enter data as often, but they must quickly verify or find details on the same screen. A more structured layout helps them interpret info at a glance.





Ideation


System Map

To visualize how everything fits together, I drafted a system map with the entire flow of a new work order:




Though it’s all on one screen, the system map highlighted how multiple conceptual steps could live in one interface if done carefully.






Wireframes

I created low-fidelity wireframes showing a single page broken into sections:


Early user feedback (from a handful of service advisors and technicians) showed appreciation for the collapsible panels—“At least now I know where to look,” one said. Another recommended a persistent “Review” panel on the right, so you can see updates in real time.




Visual Design

With wireframe insights in hand, I moved on to set the foundation for the visual design:








Solutions

A Single, Yet Organized, Screen for Customer Capture:


Step 1:
Starting screen, user is prompted to start with the customer type (Retail or Dealer), and either search for an existing customer or add a new customer. If its an existing customer, there will be a vehicle selection (saved customer vehicles or add new vehicle), or simply add a new customer and save a vehicle under that customer



Step 2:
Sales information, selecting sales rep, payment terms, selecting shop branch, date, and time



Step 3:
Order status information, user is prompted to select customer status (eg: waiting or dropped off their vehicle), select order status, along with other options tailored to customer needs



Step 4:
Order Review screen, final review to make sure all customer and vehicle information is captured before starting and entering product and service related information






Vehicle Type Illustrations






I took the initiative to design custom inclusive vehicle type icon graphics for easy vehicle type identifications, which later on also proved to increase user satisfaction in terms of easy vehicle type recognition.







Search iterations
  • I noticed issues with the existing search such as usability, increased error rates, and increased TOT.

  • I proposed the mega search menu, a larger search menu with various filters based on the variant.

  • This proved to be useful, and cut down the time on task, and reduced entry errors by 46%






Sidebar Modals





High Fidelity Flows

Flow for New Retail Customer


Flow for Existing Retail Customer


Flow for New Dealer Contact


Flow for existing Dealer Contact


Flow for Remaining Steps - Sales - Status - Review



Impact & Results

  • Reduced Time
    Post-implementation pilot shops reported a 30% reduction in time to capture a new customer’s info.

  • Improved Validation
    Data-entry mistakes (like incomplete VINs) dropped by 40%, thanks to validation.

  • Reduced Errors
    Staff said the wizard flow was more intuitive, requiring less training for new hires.




Reflection

  1. Direct User Feedback is Crucial
    Speaking with actual advisors and technicians helped me see how they jump in and out of the single screen. Many tools skip context, leaving users to piece it together themselves.

  2. A Single Screen Doesn’t Have to Be Overwhelming
    Carefully placed headings, collapsible panels, and real-time validation can maintain clarity while keeping everything accessible.

  3. Further Testing Needed
    Given the chaotic nature of an auto shop, it would be helpful to run a usability test during peak hours, measuring how quickly staff can start and finish a new order with minimal errors.




Conclusion

By reorganizing the single-screen customer capture flow into clearly delineated sections, ShopManager staff can record vital information in a fraction of the time—with fewer mistakes and no guesswork about “where to click next.” The solution remains all-in-one but thoughtfully chunked, ensuring a simpler, more intuitive experience for service advisors, technicians, and owners alike.

I’m excited about the potential of this new interface. The structured single screen is a testament to how you can meet users’ real-world demands without subjecting them to multi-step wizards or scattered fields. With ongoing feedback and iterative improvements, I believe the updated flow can continue to help shops run more smoothly and keep their focus on what truly matters—servicing vehicles and delighting customers.

Introduction

As a UX designer, I’m always seeking real-world challenges where I can refine my end-to-end design skills. In exploring issues across auto repair shops, I discovered a persistent complaint about the customer capture process within ShopManager, a cloud-based software for managing scheduling, parts, and billing.

Their existing system displayed all data fields on one massive screen, with zero steps or instructions. Service advisors found it confusing, technicians rarely knew where to look for essential details, and shop owners lamented the lack of an organized workflow. I posed one main question:

How might we transform a cluttered single screen into a clear, guided experience that helps staff capture customer and vehicle details with confidence?



Research and Initial Assumptions

To ground my approach, I needed to understand the full scope of the problem and verify some assumptions about the one-screen user experience.



Value Proposition – Why Should It Be Made?

By redesigning this single screen to be more structured, we could:

  • Remove Clutter: Display only the relevant fields at each stage, so staff can focus on what matters.


  • Reduce Errors: Provide real-time prompts or validations, ensuring complete and accurate customer/vehicle info on the first try.

  • Empower Communication: Clarify each piece of data so technicians and owners don’t have to decipher a jumbled interface or re-ask the same questions.




Personas – Who Is It For?
  • Busy Professionals (Service Advisors): They have minimal time to fill out details. They need a tool that’s instantly understandable, especially when the phone rings mid-entry.

  • Seasoned Shop Owners: They’re looking for an organized method to see overall shop status. Confusing single screens with hundreds of fields hamper that visibility.

  • Technicians: They don’t enter data as often, but they must quickly verify or find details on the same screen. A more structured layout helps them interpret info at a glance.





Ideation


System Map

To visualize how everything fits together, I drafted a system map with the entire flow of a new work order:




Though it’s all on one screen, the system map highlighted how multiple conceptual steps could live in one interface if done carefully.






Wireframes

I created low-fidelity wireframes showing a single page broken into sections:


Early user feedback (from a handful of service advisors and technicians) showed appreciation for the collapsible panels—“At least now I know where to look,” one said. Another recommended a persistent “Review” panel on the right, so you can see updates in real time.




Visual Design

With wireframe insights in hand, I moved on to set the foundation for the visual design:








Solutions

A Single, Yet Organized, Screen for Customer Capture:


Step 1:
Starting screen, user is prompted to start with the customer type (Retail or Dealer), and either search for an existing customer or add a new customer. If its an existing customer, there will be a vehicle selection (saved customer vehicles or add new vehicle), or simply add a new customer and save a vehicle under that customer



Step 2:
Sales information, selecting sales rep, payment terms, selecting shop branch, date, and time



Step 3:
Order status information, user is prompted to select customer status (eg: waiting or dropped off their vehicle), select order status, along with other options tailored to customer needs



Step 4:
Order Review screen, final review to make sure all customer and vehicle information is captured before starting and entering product and service related information






Vehicle Type Illustrations






I took the initiative to design custom inclusive vehicle type icon graphics for easy vehicle type identifications, which later on also proved to increase user satisfaction in terms of easy vehicle type recognition.







Search iterations
  • I noticed issues with the existing search such as usability, increased error rates, and increased TOT.

  • I proposed the mega search menu, a larger search menu with various filters based on the variant.

  • This proved to be useful, and cut down the time on task, and reduced entry errors by 46%






Sidebar Modals





High Fidelity Flows

Flow for New Retail Customer


Flow for Existing Retail Customer


Flow for New Dealer Contact


Flow for existing Dealer Contact


Flow for Remaining Steps - Sales - Status - Review



Impact & Results

  • Reduced Time
    Post-implementation pilot shops reported a 30% reduction in time to capture a new customer’s info.

  • Improved Validation
    Data-entry mistakes (like incomplete VINs) dropped by 40%, thanks to validation.

  • Reduced Errors
    Staff said the wizard flow was more intuitive, requiring less training for new hires.




Reflection

  1. Direct User Feedback is Crucial
    Speaking with actual advisors and technicians helped me see how they jump in and out of the single screen. Many tools skip context, leaving users to piece it together themselves.

  2. A Single Screen Doesn’t Have to Be Overwhelming
    Carefully placed headings, collapsible panels, and real-time validation can maintain clarity while keeping everything accessible.

  3. Further Testing Needed
    Given the chaotic nature of an auto shop, it would be helpful to run a usability test during peak hours, measuring how quickly staff can start and finish a new order with minimal errors.




Conclusion

By reorganizing the single-screen customer capture flow into clearly delineated sections, ShopManager staff can record vital information in a fraction of the time—with fewer mistakes and no guesswork about “where to click next.” The solution remains all-in-one but thoughtfully chunked, ensuring a simpler, more intuitive experience for service advisors, technicians, and owners alike.

I’m excited about the potential of this new interface. The structured single screen is a testament to how you can meet users’ real-world demands without subjecting them to multi-step wizards or scattered fields. With ongoing feedback and iterative improvements, I believe the updated flow can continue to help shops run more smoothly and keep their focus on what truly matters—servicing vehicles and delighting customers.

View NEXT CASE STUDY

View NEXT CASE STUDY

View NEXT CASE STUDY