MY ROLE
UX Research
UX Design
CONTEXT
2021.9-2021.11
Solo Project
TOOLS USED
Figma
Adobe Photoshop
BACKGROUND
Bilibili is a comprehensive video-sharing platform that attracts over 90 million active users daily. Users can upload and watch videos on the platform with a wide range of topics. Most of them are User-Generated Content (UCG). With its rich and diversified online community culture, Bilibili has a significantly high app thickness and a large number of loyal audiences.
DESIGN CHALLENGE
There are two primary user groups in Bilibili. They are video content generators and video content consumers. In this project, my design focus is on a sub-group of video content consumers: pan-knowledge learners (users who learn any content that improves their skill and contributes to their overall growth in life).
In the research phase, I conducted a thorough investigation into the application and its target users. Based on that, I summarized the requirements of pan-knowledge learners and transformed them into a key design challenge:
SOLUTION
This feature could help pan-knowledge learners easily organize and thus quickly find knowledge content they collected or created.
01 - Add organized knowledge content into your knowledge base
The collection button is placed at the right side of the reply button, which is in line with current usage habits.
You could sort comments or notes as you want by creating and choosing the collection and adding them into it.
If the collection is successfullly accomplished, the icon will turn into pink to give you hint.
02 - Check knowledge content you collected or created before
The collections for comments are added in the existing MY COLLECTION, which fits the usaage habit of content consumers.
The style of page is unified with the present style.
Each comment or note is shown on one card, making content consumers easy to browse.
03 - Search for more knowledge content in knowledge community directly
You can find more organized knowledge content you may like in knowledge community
You would know the most popular comment or note with the help of ranking.
PROCESS
DEMAND CONFIRMATION
At the very beginning, I found in Bilibili’s app review that many users requested that the app could create a new feature to help them favorite comments on videos. In terms of that, I did a quick survey with 96 Bilibili target users, and it turned out that 59 of them expressed the need to favorite video comments in Bilibili.
Research
RESEARCH ACTIVITIES
After validating the target users' need for favoriting comments through a quick survey, I conducted a few more research activities to describe Bilibili users' characters and their pain points.
QUANTITATIVE RESEARCH
I conducted an extensive second-hand quantitative research session to explore the overall characters of Bilibili video content consumers. In summary, this group of users is young, active, always eager to learn, and has a wide range of hobbies.
QUALITATIVE USER RESEARCH
Based on these user characters, I interviewed 6 Bilibili content consumers who used the application almost daily. In the meantime, I also had the chance to observe their daily app use and mainly focus on their behaviors when viewing video comments they like. Finally, I synthesized all user behaviors and thoughts from interview notes into an affinity map. I ended up with a persona that defined the target users in this project as pan-knowledge learners.
STORYBOARD
In the meantime, based on previous research outcomes, I depicted the scenarios of the pan-knowledge learner’s requirement in storyboards.
CHALLENGE REDEFINITION
At this point, I found out that what the pan-knowledge learners really need was to quickly find the knowledge contents that they want while comments are just one type of presentation of these contents. Based on this discovery, I re-synthesized the user requirements.
BUSINESS ANALYSIS
On second thought, I also asked myself: “is this particular user requirement worth paying attention to?” To find out the answer to this question, I researched Bilibili’s business model second-handly. During my research, I found that active community and high-quality video content are the two most significant competitive advantages for Bilibili. They are also the primary driving force of Bilibili’s business development. As a result, if this user requirement is solved, it will bring much more benefits to the entire product.
DESIGN GOAL
How might we help pan-knowledge learners quickly find and review the contents that they need based on current interation functions in Bilibili?
GOAL BREAKDOWN
After redefining the user requirement, I analyzed the two existing types of presentation of knowledge contents in Bilibili. They were comments and notes. The analysis was based on four aspects: length, content complexity, organizability, and accessibility. According to the analysis outcome, I finalized three design issues to focus on in the ideation phase.
Design
IDEATION
Based on the three design issues, I conducted a brainstorming session accordingly. After considering the trade-offs of all possible solutions, I made an initial assessment and determined the design direction for subsequent detailed design.
USER FLOW
Then I finished the design of the user flow.
LOW-FI
In the low-fidelity design phase, I made two different designs based on three primary features. After analyzing the pros and cons of each design, I summarized the main area for improvement for design iteration.
INFORMATION ARCHITECTURE
In the meantime, I integrated the newly-designed features into the existing information architecture of Bilibili.
MID-FI
Afterwards, I made an design iteration on all low-fidelity interfaces.
USABILITY TESTING & ITERATION
During the usability testing, I found that users met some challenges, so I revised my design according to their feedback. Here is one example of the iteration.
HIGH-FI
Outcome
Add organized contents into your knowledge base
Check comments or notes you collected before
Search for more knowledge contents in knowledge community directly
USER FEEDBACK
After completing the final design, I conducted a feedback session with target users via survey and interview. To my surprise, most users supported the new feature I designed. They said this new feature would bring them great convenience when using the Bilibili application.
Reflection
DIFFICULTIES I MET
The biggest challenge that I had in this project was how to set my design goal accurately. During the initial user research phase, most pan-knowledge learners told me they wanted a feature to collect video comments. Then I was stuck with the idea that I needed to design a comment collection feature while ignoring its deeper rationale. However, after refining the research insights, I could redefine my design direction more accurately.
THINGS I LEARNED
Always think twice and try to ask more questions before jumping to the design phase. It may take some extra time, but it is really worthwhile and might make a big difference on the final outcome.
FUTURE WORK
If given more time, I will complete the design documentation and validate all implementation feasibility with software engineers. Also, I will keep iterating my design based on the user feedback data.