Skeuomorphic design is not dead.
How did I design a mobile UI of Blind Box Toy online shopping app?
Blind box toy industry is in an emerging market with a tough competitive environment. Our client, Wow Surprise Inc, is an uprising start-up growing rapidly and has finished in series B financing in 2019.
If our client failed to give their customers a good online shopping experience, it would fall behind their established key competitors.
Timeline
3-week
team work
My Role
Team lead
UI design
User Research
Prototypes
Deliverables
Hi-Fi UI
Design Report
Presentation
Blind Box Toys
How to improve online shopping with fun and Surprise experience?
The goal of the UX design project is to provide our customers a new, fun, and surprise online shopping experience.
Payment and registration UX designs were beyond the scope of this project.
RESEARCH PHASE
We conducted 1:1 user interviews with 11 participants (3 males and 8 females) in China via remote video calls. Here are the key findings：
Our target users are Generation “Z” young female Chinese adults from 18-35 years of age.
“The instant gratification that even overnight delivery can’t provide.”
They are very familiar with online shopping and apps for other services such as shared rides and food delivery.
They seek instant gratification longing for the desired toy as soon as possible.
There is differential in the quality of online/offline shopping satisfaction.
They love shopping at stores because they can experience fun and surprise in real life and obtain the toy right away.
“I am so satisfied when I get the figure I have been looking for a long time.”
WIREFRAMES
We visualized the work flow, and concepts on Low-Fi prototypes and explored two design options as shown below:
Design Concept A
Design Concept B
DESIGN ITERATIONS
I presented two design options to the client, collected their feedback, and balanced the customers’ needs and the stakeholders’ wants.
Design Concept C
Style Iteration
UI Design
The final deliverables include the main page UI designs (Figma files), information architecture, and the basic design system, as shown below.
A Closer Look - Skeuomorphic designs
Design System (Basic)
Information Architecture
User Testing
We ran a concept validation test with 5 participants in which three tasks were assigned. The System Usability Scale (SUS) will be used to evaluate after the engineering prototype is available.
Results
Aligned UX design with business goals.
Improved usability.
Gained good feedback and comments.
My takeaways
Cultural differences in the Blind Box Toy industry.
Client vs. Users' needs.
Scalability of design.
This is just the beginning!
Credits: Aris, Yilin, Hazel, Liz
If the text is faster to load for you, please read the 4-page report.