Provis
SYDNEY | E-commerce Website Design & Interactive Demonstration
Roles & Responsibilities
Tools Used
Duration
User Research
User Journey Map
Lin
Age: 19
College student
"I love livestreaming my daily life during my free time. As a beauty filter enthusiast, my goal is to attract more followers through my livestreams. After each broadcast, I carefully review the livestream data to see how I performed."
Zoey
Age: 25
Working professional
"I'm a big fan of anime and technology, and I even designed a virtual avatar for myself. When I'm off work, I enjoy livestreaming games using my virtual avatar. I love interacting and chatting with my audience, especially fellow anime and gaming enthusiasts."
Ray
Age: 35
Retired gaming coach
"I have decent skills in using mobile devices, although I'm not a tech expert. Sometimes, I livestream eSports event commentary, which I find quite enjoyable. During and after going live, I really appreciate having an easy way to manage my audience in the livestream room."
Optimization of Start Live Process
Move the broadcaster's "Start Live" page to the top-level page
The "Start Live" page is the first screen users see when launching the app. This change caters to live streaming users' needs, allowing them to quickly fill out all necessary information on the "Go Live" page, streamlining the process and improving the overall user experience.
Optimization of Settings Process
Reducing interface transitions
Before the optimization, "Live Room Settings" was a subpage within the "Host Center." We merged its functions into the "Host Center" as categorized cards, eliminating an extra transition and simplifying navigation. Additionally, we made the "Host Center" accessible from the "Go Live" page, reducing the page hierarchy. These changes streamlined interactions and made features easier to find.
Cover Setting Feature Iteration
Reducing interface transitions
Before the optimization, "Live Room Settings" was a subpage within the "Host Center." We merged its functions into the "Host Center" as categorized cards, eliminating an extra transition and simplifying navigation. Additionally, we made the "Host Center" accessible from the "Go Live" page, reducing the page hierarchy. These changes streamlined interactions and made features easier to find.
2. Layout optimization
Host Center Design
3. Visual Iteration
Visual Identity
To improve design efficiency and communication with the product and development teams, and ensure visual consistency, I collaborated with the broadcasting side mentor to establish the Live Assistant component library.
Designer demands
Using Figma's component properties for quick and accurate application, saving time on repetitive tasks and increasing design efficiency.
PM demands
Modularizing the functional components and establishing standards; Reduce communication costs, resulting in faster project iteration.
Developer demands
Quickly accessing consistent components reduces the workload of modifying visual details, allowing more time to focus on improving code quality.
User demands
Visual consistency is essential to ensure unified color and identification recognition, leading to a more intuitive and efficient user experience.
Design System
Typography: Defining the redesign visual style based on user characteristics and preferences.
Icon & Color
Component Library
