Interface designer
Prototyper
PM x1
Front-end x3
4 months
Inefficient shopping experiences
Customers complaints
(Implementing)
Many interactive prototypes in Framer
Create scalable shopping & browsing experiences
There used to be only 3 merchants on the Wing app, and therefore large store tiles were used deliberately. But now Wing has 10+ stores, this design presents usability issues and limits scalability and new feature integration.
Drag Reveal
Horizontal scrolling is not the most comfortable and natural thing for your thumb, so each section limits 5 items to reduce strains on the joints and shortcuts the navigation without lifting your thumb by following the already-performing drag motion.
Drag Browse
You can simply drag left and right to preview the popular items in a store on the home screen, which allows you to browse more items without navigating back and forth.
Point and choose, literally
Inspired by clean and clear topping layout in physical restaurants, a pill-based customization makes it easier to choose without opening and collapsing million dropdowns.
Flat hierarchy: browse in a store
Inspired by the persistent anchor and presence shopping in physical stores, the same layer left-right navigation modal removes complexities and inefficiency of context switching.
Flat hierarchy: look at an item
Continuing the flat hierarchy concept, using the bottom sheet for item selection is as if you're picking up an item in a physical store, a temporary but focused task, but you're also aware you are in the same physical space at the same time.