Order Wrangler
The Order Wrangler is an administrative tool that I have designed for our internal stakeholders. It provides a centralized platform for tracking all order-related issues and improving order management efficiency.
My Role
As the lead designer, I oversaw the entire design process, from concept to implementation. This involved research, user interviews, mockups, prototypes, user testing, and ensuring QA standards.
Collaborating with operations and fulfillment PMs, we worked with engineers and a diverse range of stakeholders to make informed decisions aligned with our objectives.
Project Overall Problem
Stakeholders weren't able to reference a single source, and in some cases, any source, for end-to-end order visibility from Cart through Delivery and beyond. When they tried to understand the connection between Sales Orders (SOs) to Item Fulfillments (IFs); determine workloads and consolidation opportunities, they needed to research across a number of applications and service make their workflow cumbersome.
Business Objectives
The business objectives are:
Enhancing order management efficiency
Enhance engagement efficiency
Streamline issue resolution processes.
Improving stakeholder & customer satisfaction
Target Users
Primary Users (M1) :
the Customer Experience team
Secondary Users:
Sales; Account Executives; Community Builders; Transportation Team; Operation Team
How Might We...
HMW improve users' understanding of cart-to-delivery connection?
HMW enhance workload analysis and consolidation opportunities?
HMW effectively provide critical order information to relevant stakeholders?
Key Metrics
Together as a team, we collaboratively identified the metrics to measure success and guide the design process. Some of the key metrics are:
In-season order processing time
Average customer call duration.
Issue resolution speed
Stakeholder/ customer satisfaction rate
Measurements
The Process
The Challenge
At the very beginning, this project has A broad scope and vague directives make it difficult to define a clear direction. Therefore, it requires us Conduct research to pinpoint focus areas and define directions within a limited timeframe.
"Order Wrangler," an initiative to improve the Order-to-Cash process, began with a two-week internal fundamental research session. We developed a concise discussion guide, refined with input from our in-house researcher, and conducted sixteen focus group studies with potential stakeholders from various departments.
During the focus group studies, we concentrated on two key areas:
Evaluate strengths and weaknesses of the current order management process and seek improvement suggestions.
Inquire about potential stakeholders' preferences for a tool that enhances the process, prompting them to describe its features, purpose, and functionality.
We compiled interview notes on a spreadsheet and collectively synthesized feedback, revealing a focus on Order Automation and Order Visibility. Considering feedback and analyzing potential benefits, the team prioritized enhancing Order Visibility due to immediate benefits and positive company-wide user research feedback.
Order Visibility
Reduce Promise Risk
Streamlining Complex Workflows
Ensuring Data Accessibility
Minimize Third-party System Limitations
2. Define
After the discovery phase, we pinpointed design constraints and established defined milestones, with Milestone 1 focusing on:
Centralized Platform: Develop a centralized admin tool that consolidates all critical order-related information into a single platform.
Information Only: The tool's primary purpose is to provide users with enough information to understand what went wrong with the order, allowing them to resolve the issue outside of the tool.
CX Team and Desktop Only: The first milestone project will primarily focus on the CX (customer experience) team as our target user group. Therefore, the design will focus on desktop use.
Define Use Cases
In defining use cases, I ensure a thorough exploration of user interactions by capturing all potential scenarios, including edge cases. Then, I prioritize maintaining focus on the main use cases, which represent core functionalities crucial for system functionality and user satisfaction.
Equipped with the Technical Knowledge as a Designer
To design a user-friendly admin platform for the Order-to-Cash process, I collaborated with key stakeholders and PMs, gaining insights into technical aspects like order fulfillment, shipment, and operations.
Order Status Flow
With the information in mind, I begin by utilizing flowcharts to visually represent my comprehension of the various order statuses required to be labeled within the platform. Subsequently, I synchronize with project managers (PMs) and stakeholders to validate my understanding and ensure alignment among all parties involved.
Then I designed a flow chart to visualize item relationships in the Order-to-Cash process, revealing the need for displaying comprehensive information at the item level. Following this, I created a user flow chart to visualize the steps users take to complete tasks in the platform, along with the necessary page types for design.
3 Ideation | Collaboration
When presenting solutions to stakeholders, I consistently articulate the rationale behind each option, including their respective pros and cons, and actively invite stakeholder feedback to ensure thorough consideration.
I firmly believe that attention to detail is key to crafting a superior user experience. Therefore, I prioritize conducting usability tests, even for minor enhancements, whenever necessary.
Team Review
Key Feedback:
We are all in agreement to proceed with the slide-in panel solution.
Users prefer having all information readily available in one place rather than navigating to separate pages.
Solution:
Remove the cart detail page
Incorporate all order-related information onto the order detail panel as a third section.
4 Prototype | Validation
The next step in the design process is to create an interactive prototype for user testing. I utilized our design system library to create components that are easy to maintain for the OW project. Throughout the entire design process, I consistently consulted with engineers to ensure technical feasibility.
User Testing
To ensure that the design and content met our users' expectations and was intuitive and easy to use, I created a usability test plan and conducted usability tests.
Tested with 5 admin users. Tool: google meet & Figma prototype
Overall findings:
The design was easy to navigate.
Users were able to find order-related information quickly.
The design and content met users' expectations.
Areas to improve and to-dos:
Users prefer larger spacing for displaying all information to facilitate quick scanning and avoid excessive scrolling
Users need to be able to share information in different formats with relevant stakeholders.
Prefer to have the order number remain at the top while scrolling down.
Avoid separate "Key Info" section.
Group items by planning dates for quick identification of delays.
After reviewing the key findings from the user testing, I began updating my design and the prototype.
5 Launch for Milestone One
At the final stage of the design wrap-up, I created detailed design Gherkins to communicate all story-level and interaction-level information with our engineers. We held a design walkover meeting with our engineers. After they implemented the design, I conducted QA on the staging site for the final product to troubleshoot design and bug-related problems before launch.
6. Thoughts
Collaborating with technical PMs to design an internal tool was challenging as they were not used to thinking from a user's perspective. However, it was a valuable experience that allowed me to improve my communication skills when advocating for the needs of the users.
Next steps:
Gather feedback from stakeholders and and address any outstanding issues to prepare for opening access to more users.
Ensuring mobile-friendliness for use in the field.
Key Insights:
Move Fast with Ambiguity: Recognizing that moving fast with ambiguity is crucial, I continuously refine solutions based on quick feedback loops and close collaboration with the PM and engineering team.
User Clarity through Visualization: Sometimes, users' design change requests may not align with their actual needs. However, through visualizations, users gain clarity on their true needs, underscoring the importance of visual communication in understanding user requirements.
