Sumtime
An end-to-end project from ideation to interaction and prototyping
Project Overview
Sumtime is a moderate cafe size located downtown surrounded by office buildings, condominiums, and apartments. They offer online orders for pick-up and delivery services. Sumtime targets customers who are challenged with time limits during peak times like breakfast, brunch, and lunchtime which are able to view the menu online, order online, online payments, and live estimate time.
Project Details
Role: UX/UI Designer
Clients: Google UX Design Professional
Duration: 2 weeks, Jan 2022
Tools: Figma
Problem
Busy lifestyle and need a convenient mobile-friendly website to be able to cut their time for ordering from the cafe for picking up and/or delivery.
Goal
Design a mobile-friendly website for Sumtime cafe that allows users to be able to view the menu, order online either for pick up or delivery, make a payment and provide live time estimates before and after ordering.
User Journey Map
Two out of five users’ journey maps with user interview data. It defines users’ flow and user experience.
User Summary
I conducted interviews and created empathy maps to understand the users whom I am designing for and their needs. The majority of user groups identified through research would like to have a short period of time to order due to the time-limited they have. This user group confirmed initial assumptions about Sumtime cafe customers, but research also revealed that having the cafe's mobile-friendly website is not the solution to help them shorten their time. Other user problems included traffic, cafe prime time and payment options are also make it difficult to finish their task as well.
Pain Points
Visual
Items images are not enough and unavailable an online menu
Accessibility
The menu is only available in the store. Cannot provide to any other customer who wants to view the menu ahead of time.
Their no estimated time before ordering and after ordering
Payment Option
Do not have enough variations of payment methods and unable to process payment online.
Time
Busy life adults are having a problem ordering food during the prime time due refer to traffic and long line.
What People Are Saying
“Rating and Reviewing from others will help me decide what should I order.”
— Artit T.
“I always order something ahead without the menu. So I never try something else besides whatever I usually order before.”
— Chanattha R.
Competitive Audit
Wireframe
Research Study
Research Question
How long does it take a user to start using the website to complete the tasks?
Is there any process we can make better? (design and function)
Are there any functions or features that users would like to have on the website?
How do users feel/react from starting the task to finishing the task?
Is any user having a long pause during the process or step?
Methodology
Moderated usability study
KPIs
Drop-off rates
System Usability scale
Time on task
Affinity Diagramming
Findings
1. Users want to estimate the time before ordering
2. Users need various types of online payments
3. Users want to be able to view the menu before ordering
4. Have to find the menu easier on the website
5. Favorite items and save payments need to address
6. Items rating is needed for helping users make the decision.
7. Quick adding to cart icons
Mockups v1
Mockup revise version
Adjusting color palette
Resizing typography and icons
Rearranging
Takeaways
Impact:
The website provides functions for users’ needs like an online menu, online payment, and an estimated time before and after ordering. The flow is much improved, and the users are more satisfied with the additional functions
(the chat function, items favorites, and items rating.)
“Saved favorite items are helping me cut time for ordering.”
“Able to view menu first and some images and rating help me make a decision which items to order”
What I learned:
After the first usability study is not the end of the design and improvement process. The more feedback the more understanding user and every user's voices are valuable to make a better version.
Questions for Future Iterations:
How might we.. Adding main function icons on the bottom
Maybe help users access faster for instance recent order, search, cart, and account
How might we..Adding Recently View or search history on the first page/homepage
Probably, helping users fast access what they have been viewing before.