The POS System
Redesign the User Interface
A Point of Sale (POS) system is a combination of hardware and software that allows businesses to complete transactions with customers. A POS system typically includes an ordering interface, payment processing, receipt printing, etc. The purpose of this project is to redesign the current ordering POS system, with a specific focus on the menu area to improve usability, increase efficiency, and streamline the overall ordering process. The redesign aims to enhance user interactions, ensuring inclusivity, and providing users with a user-friendly interface.
SCOPE
12 Weeks
TEAM
Solo Project
MY ROLES
User Research
User Testing
UI Design
PROBLEM STATEMENT
The POS system's current menu layout and navigation are intricate and not user-friendly, causing delays and potential errors during order processing. New staff members may face difficulties learning the system, leading to extended training periods and an increased likelihood of order-entry mistakes. Additionally, the system lacks accessibility considerations, potentially impacting staff with disabilities, such as those with low vision, and contributing to prolonged processing times
Reseach
Use-case Scenario
To facilitate the user testing, I devised a scenario in which participants envision themselves taking a drink order from a customer. The scenario unfolds as follows: a customer begins by ordering a small Tiger Milk Tea with specific modifications—reduced sugar, less ice, and honey boba instead of the default creme brulee topping. However, subsequent to placing the initial order, the customer has a change of heart and requests a larger size instead.
Methodologies
Qualitative Methods:
-
Open-ended questions
-
Observe participants’ behaviors and interactions with the system
-
Think-aloud protocol: Asked users to vocalize their thoughts and feelings as they perform the task
-
A/B comparison between original design and new design
-
Card-sorting
Quantitative Methods:
-
Measure task completion time (Timing the task and take note of the time used to complete the task for each participant)
-
Measure the user satisfaction scores (Survey questions)
Participant Profile
-
10 participants
-
40% male, 60% female
-
Age range between 18 - 50
-
Employees at Tastea including individuals who have worked there for a year, or a few months, and newly hired staff
-
College students working part-time at Tastea
-
People who work full-time at Tastea
-
Inclusion factor: Low-vision users (10% with farsightedness and 10% with nearsightedness
Insights from Research
-
Too many colors were used for the drink buttons which made it distracting and confusing the users
-
There were no visual elements that can help recognize the drink items easily
-
A block of buttons displaying drink names demands memorization rather than simple recognition
-
There was no clear hierarchy between main categories and subcategories
-
Inflexibility of the edit option. There were no options to edit or change the drink sizes
Three most important insights that I found
-
Inflexibility of the edit button: This is the most important insight because it impacts the performance of staff members and slower the ordering process.
-
Unclear hierarchy: Making the system a more hierarchical menu is also important because it will help the staff members locate the drinks and other items more efficiently.
-
Lack of visual elements: Adding visual elements is important. This will help with visual recognition which allows the staff to immediately spot the drinks and other items quickly without scanning through words.
Data Visualization
After collecting feedback from users, I analyzed and organized the insights into an affinity diagram to encapsulate their thought processes. Additionally, I created a pie chart to visually represent user satisfaction with the original design
Ideation
Early Sketches
Before embarking on the redesign, I began by sketching out my solution ideas to get an initial glimpse of the design. Subsequently, I progressed from low-fidelity prototypes to high-fidelity prototypes
Design + Testing
Original Product vs Prototype
During the user testing, the primary finding indicated that the prototype addressed several improvements compared to the original product:
-
Ease of Editing Drink Sizes: The ordering process is streamlined and expedited through the effortless editing of the drink's size.
-
Navigational Ease for Drinks: The hierarchical layout and the integration of various drink sizes contribute to easy navigation.
-
Accessibility: Improved legibility and recognition are achieved through the inclusion of images and bold typefaces.
Prototype Improvement
#1 Ease of Editing Drink Sizes
The current design lacks an essential edit feature, making it challenging and impractical for users to make any changes after selecting a drink. To address this usability issue, my solution involves introducing an edit button that becomes visible upon selecting a drink. This enhancement empowers users to effortlessly revisit their choices and make any necessary adjustments to their selected drinks with ease.
The redesign shortens the process of changing sizes and reduces cognitive load for users who would otherwise need to memorize drink adjustments from the previous orders.
#2: Navigational Ease for Drinks
I utilized card sorting during user testing to establish a clear and hierarchical navigational flow, restructuring the menu navigation accordingly. Now, all options, including size and other adjustments, are displayed at once in a single drop-down menu when users click on a specific drink. This modification reduces the complexity of the menu interface, enabling users to quickly locate drinks and efficiently make modifications.
#3: Accessibility
The redesign focused on improving the employee experience by adding drink images for quick recognition and using a bold typeface for better legibility, especially for those with low vision. These changes enhanced menu navigation, making it more intuitive, inclusive, and user-friendly.
What Needs to Improve from User Testing?
#1: Crowded Modified Option Panel
User testing highlighted the need for improvements in the single drop-down panel. While it effectively streamlined drink sizes and adjustments, it also caused overcrowding with unnecessary options. Incorporating progressive disclosure can enhance the design by prioritizing clarity and usability.
#2: Missing Quantity Selection Feature
Adding a feature that allows users to select multiple drinks with the same customization options.
Design Refinement
Refinement #1
I implemented an expand-collapse feature in the UI design. This allows information to be hidden and expanded when users click on the button, resulting in a simpler and more organized design layout. Additionally, based on user feedback, I reorganized the most frequently requested modification options at the top, making it quicker and easier for users to complete their tasks. Furthermore, I standardized the buttons to create a more professional and cohesive appearance.
Refinement #2
My solution is to add the “add” and “subtract” buttons on the right and left of the drink number. This allows employees to easily add or subtract the drink quantity when customers order multiple drinks with the same adjustments. This addition is crucial for efficiently saving time in the ordering process.
Final comparison: Original product vs. redesign improvements.
What I Have Learned
The entire project has significantly shaped my perception of the pivotal role user research plays in steering the design process. While my initial focus was on addressing UI navigation challenges in the menu, user testing brought to light a more intricate issue—the absence of the ability to edit orders. This experience has underscored the importance of empathy, adaptability, and maintaining a continuous feedback loop in developing designs that genuinely resonate with end-users. By immersing myself in the world of user research, I have come to appreciate how it serves as a foundation for informed decision-making, fostering a deep connection between design and the people it intends to serve
