CASE STUDIES
CUSTOM ORDER CREATOR
The aim of the project was to create intuitive mock-ups (wireframe’s) of a custom order wizard that would enable Wetroomsdesign’s customers to order custom-sized sub-tiled shower trays in an easy and clear way.
Author | Bartłomiej Biegun |
|---|---|
Services | Web UI, UX Design |
Used Apps | Figma, Blender, Asana |
Problem Genesis
The problem I tackled in the „Custom Order” project stemmed from the complexity and inefficiencies users faced when placing custom product orders. Many users found it difficult to navigate existing systems, leading to confusion and errors in their orders. My goal was to create a simplified, user-friendly solution that would streamline the customization process and reduce these frustrations.
I started by conducting extensive desk research, analyzing existing solutions and finding suitable examples of successful product customizers, such as mycs. This research helped me identify best practices and common pain points in custom order systems. After gathering sufficient data, I sketched out the initial concept of the customizer tool, focusing on simplifying the flow and making the interface as intuitive as possible.
With the sketches in place, I moved on to the design phase using Figma, where I began creating the first wireframes and prototypes. This allowed me to start building a solution that would address the key issues discovered during my research, ensuring that users could easily customize products and track their orders with minimal effort.
After developing the initial wireframes, I refined the design by iterating through several versions to ensure a seamless user experience. My focus was on creating a visual hierarchy that guided users step by step through the customization process, minimizing confusion and ensuring clarity at every stage. I also integrated user-friendly features like real-time previews and clear progress indicators to make the experience more interactive and transparent.
Solution
To address the challenges identified during the research phase, I designed a custom order solution that focused on simplicity, clarity, and user empowerment. The core elements of the solution revolved around streamlining the entire customization process, ensuring that users could easily navigate through each step without confusion.
Key features of the solution included:
- Intuitive Customization Flow: The design emphasized a step-by-step process that guided users through each customization option, reducing the likelihood of mistakes or misunderstandings.
- Real-time Visual Previews: As users made selections, they could see instant visual updates, allowing them to understand exactly how their choices impacted the final product. This feature increased user confidence and satisfaction.
- Clear Progress Indicators: Throughout the process, users were provided with clear feedback on their progress, ensuring they always knew where they were in the customization journey and what steps remained.
- Simplified Order Management: Once the customization was complete, the solution offered straightforward order management, allowing users to track their orders and make changes with ease.
- Component Design for Web Integration: The solution was designed as a flexible component, intended to be installed on websites. I developed a series of mockups that demonstrated how this custom order component could be integrated into the existing layout of wetroomsdesign.co.uk, showcasing its usability and adaptability.
Though the component was not programmed, the detailed design provided a comprehensive guide for future development and integration, ensuring the custom order process would enhance user experience and meet business needs.
Project in Details
- Project Name: Custom Order Solution
- Duration: February 2023 – April 2023
- Research Phase: Desk research conducted, including analysis of existing product customizers like mycs
- Design Phase: Multiple wireframes and mockups created to refine user flow and interface
- Key Insights: Identified user frustrations with complex custom order systems, leading to the design of a streamlined, user-friendly solution
- Tools Used: Figma (for wireframes and prototypes), Miro (for brainstorming and process flow mapping), Blender (for 3D visualisations), Asana
- Prototype Development Tool: Figma
- Core Features:
- Intuitive step-by-step customization flow
- Real-time visual previews of product changes
- Clear progress indicators throughout the order process
- Simplified order management system
- Website Integration: Designed as a web component to be integrated into existing e-commerce platforms
- Mockups: Created a series of mockups showcasing the solution’s integration on wetroomsdesign.co.uk
- Role: UX/UI Designer, Researcher
- Outcome: A fully designed custom order component, ready for development, aimed at simplifying the user experience and increasing order accuracy.