Individual project
Processing&Unity | Kinect
Research | Interaction design | Development
2018.07-2018.08
Sketch&Principles
2019.06-07
Micro interaction design |
Wireframes design
More than a million users
Daily active users: 150k (30% ⬆️)
Sephora is a French multinational chain of beauty stores that offers personal care and beauty products. My past employer Mobile Now has been worked with Sephora for years to build WeChat Mini-program (WeChat mini-programs are lightweight applications within the WeChat ecosystem).
WeChat is one of the most influential social media in China, therefore, enabling an e-commerce platform based on mini-program will allow WeChat users to access Sephora products conveniently and undoubtedly increase its market share in China.
After launching the first version of the Mini-program on Aug.13th, 2018, the company started to run design sprints to help further iterate the product.
Since June 2019, I joined Sephora project UX team to identify the latest user experience issues, ideate, quickly prototype, did user testing and eventually help Sephora generate significant traffic through the WeChat ecosystem. Here listed four main design sprints documentation.
Download WeChat app and scan the code using WeChat
Haowuquan(Goodies) is a WeChat built-in feature that is considered as a "shopping version of Moments": users could share good products with their friends here.
Our client marketing department would love to increase daily active users through Haowuquan channel since it's a new feature of WeChat. In this case, Haowuquan feature should catch users' eyes when they are browsing the product details page and lead users to use this feature.
There existed a sharing function sticky on the right side. Haowuquan is essentially a sharing feature, The two sharing features have to be distinguished while at the same time, they should end up with same layout.
1. Current icon could also be misunderstood as "like" instead of "share goodie".
2. When users scroll up, this feature should not disappear with the product name.
I found some existing apps that shared the same 'haowuquan' feature and conducted competition analysis.
Redundant steps
If users reach the bottom of the page, they have to scroll back up to use the feature.
Haowuquan stands out
The independent sticky element clearly stands out in the page while unlike our app, its sharing feature is at the bottom bar.
Redundant steps
Haowuquan' is hidden inside a subpage which also makes it unnoticeable.
1. All of them include text to explain the feature instead of icon only, converying a clear message to users.
2. Make the feature shown directly on the page
3. A good animated effect will appeal to users and help generate more traffic .
I learned from other competitors, sketched quickly, and iterated the design a couple of times. Through the iteration process, I kept the client’s business goal in mind as well as intuitive interaction.
Text beside the icon
Use text to clarify the feature
(meaning of the text: 'recommend good products')
Animated interaction
Get users' attention and increase the user activity of visiting products through Haowuquan
As users scroll up, Haowuquan elements will follows the page up until they touch the bottom of the right sidebar. It will be sticky to the screen as other two icons do.
Text only when it's sticky
Since there won’t be enough room for both text and icon, I changed the layout and chose to leave text only which could keep distinguished from other two icons and get more attention.
Also, I split four chinese characters to two lines and made them nicely fit the square.
I delievered not only a prototype file but also a graph of all required parameters to developers, which gave them a better idea how the interaction worked specifically.
A three-level category page where users could click or scroll to access the products freely.
1. Enlarge efficient display area and the interactive area
There exists unnecessary information such as category entrance and navigation bar. Also, first-level category takes too much space.
2. Minimize the steps users have to take to find the product
Users have to scroll back and forth to find a specific category.
Move category entrance to homepage
Brand and product category could be separated to two entrances in homepage instead of under a single 'All products' tab
Remove bottom navigation bar
Under this page, users mainly focus on the category searching. The bottom navigation bar takes space of main task while at the same time distracting users.
Display first-level category horizontally
under the search bar
Users could either scroll or click the tab to switch category.
Reduce first-level category height
Keep background picture
The background picture could represent brand identity and it will change as tab changes.
Added sidebar for all second-level categories on the left
Users don’t have to scroll and they could clearly see all second-level category entrances.
Haowuquan(Goodies) is a WeChat built-in feature that is considered as a "shopping version of Moments": users could share good products with their friends here.
Design sprints allow me to work in time-constrained projects, which greatly improve my efficiency in researching, brainstorming and prototyping.
Also, throughout the outside-classroom experience, I have to constantly consider needs from multiple stakeholders; I became more and more comfortable with helping the client to achieve business objectives as well as balance user needs and technological constraints. It was a challenging but thrilling experience to convince the client of our design concepts.
During iteration part, there were constant communication and collaboration with software developers, from which, I learned to hand off concrete design documentation with clear specifics.
