Overview
From February to June 2021, I had a UX design contract with Pingyu Illustration Studio to work on the e-commerce website redesgin of the client’s brand. The existing website was a multi-facing platform that integrates gallery and shopping features, however, it reached its limitation and cannot support the business growth of the brand anymore. My tasks were to help the studio grow its business by the web redesign and UX strategy-making.
-
The new Showcase Tool feature increased engagement time by 36% in the purchasing flow on website.
-
Design Lead
User research to inform Business and UX strategy.
Innovate Retrospect feature based on user-centered method.
Design wireframe and prototypes.
User testing for design iteration.
-
Report to the client of the art studio
1 UIUX designer
Outsourced engineers
-
Research & design: 6 weeks
Total project: 3-4 months
PROBLEM
The client, as an individual artist, wants to market out his personal brand online to scale the business growth sustainably.
The main was to accumulate reputation of the studio in the long-term. However, I found that the client had many other business goals in mind with regards to this. Analyzing the reasoning of other business goals allowed me to identify the different tiers of ambition for the product, and I then mapped out main tactics and long-term strategic goals (Not In Scope) that the client can align to. Considering the main business goal, I decided to focus on the course sale and increase the conversion rate.
SOLUTION
Help the users understand in-class learning experience and outcome through online representation.
With the HWM question above in mind, I translated research findings into three key UX strategies that is able to scale in the long-term. PS: welcome to look at the research details which can be found in the later part of the case study.
Showcase Tool
User Impact:
• Browse the student gallery to understand in-class learning progress
• Help evaluate teaching methods and outcomes for the potential customers
• Sharpen skills through feedback with students, teachers, and visitors in a learning community
Business Impact:
• Accumulate teaching reputation
Tailored Flow
User Impact:
• Get all the information on one user flow to purchase courses
• Market out painting courses with the showcase tool
• Collect information through the expressive storytelling
Business Impact:
• Increase conversion rate
Herd Gallery
User Impact:
• Support as a learning group in the long-term
Business Impact:
• Gain business brand exposure
• Form a brand community
How I got there?
RESEARCH
Students who learn painting are mainly concerned with teaching effectiveness and learning community.
Since the studio is a small business and still in its formation phase, I decided to use qualitative research method to help define its target users. Through interviews with 8 in-class students, the existing students are roughly divided into 4 groups, including school students, office workers, freelancers, and successful ladies, and their motivations vary.
With the affinity diagram, I boiled down to two persona with two main motivation respectively: short-term effectiveness & long-term community. Such two persona scaled and maximized our design impact on the majority of potential customers.
To inform the product strategy and design direction based on our target persona, I called out three main insights of the target users when it comes to purchase a painting course.
After all business and user research, I had a full picture of the product and looked for the design opportunities to meet both business and user goals.
I translated research findings into three key
UX strategies that is able to scale in the long-term.
DESIGN
One-time review or Progressive review?
I sketched a lot of storyboards about how our product can get invovled and how users operate our products. One of the key aspects is review feature. I had two ideas of review feature for the users to gain in-class experience from others. (1) Use a general review feature for students to leave their testimonials, or (2) Create a new showcase feature for students to archive their learning progress with the feedback from the teacher.
After talking to the client, I decided to use option 2 because it takes into account of the user life cycle and the scalability of the business to form a community in the long-term.
TESTING + IMPROVEMENT
2 major iterations in my design
Based on various feedback from 6 users and business owners, I iterated the design over 6 weeks and made 2 major improvements for the Showcase Tool.
Refine comment board hierarchy
According to user feedback, comment board is not easy to digest the information associate with responder identity and comment interactions. I decided to add badges to hierarchize among teachers, students, and visitors. Also I attached the reply feature to the responder to give more viewing space in general.
Upgrade Showcase Tool interaction
Considering user feedback, the showcase tool is confusing in interactions of timeline, art work piece & album hierachy, and author of artwork. I decided to add visual representation of albums, move the folding button right below the album to be more intuitive to navigate and enhance the learnability of the showcase tool.
THE FINAL SCREENS
The final product
The mockups & prototype are created with Adobe XD.
TAKEAWAYS
What I’d do differently next time?
This was my first commercial UX project, asking me to consider both commercial and consumer needs when thinking about design solutions. Hence, the project pushed me to think more holistically.
Creating personas helps maximize the collective benefits of a product design. Customer motivations to purchase vary. After user research and analysis, two or three personas that best cover the entire customer can be established. This is not only for the design principle but also a consensus for teamwork to resolve disputes. In the next design iteration, I hope to be able to research edge cases to make the personas more inclusive for product improvement.
Design system matters. Usability testings give me a full picture of how design system affects users on interaction with the product and then on the decision-makings in shopping activities. Hence, I pay attention to the design system, including consistency with the previous brand image and the functional hierarchy represented by the use of color, shape etc.
Thank you for reading!