Some part of the project is still under NDA, so it cannot be described in detail.
MIUI 15 App Store
Tools
Figma, Adobe, Miro, HTML, CSS
Internship 2023
During the summer of 2023, I interned at Xiaomi as a UI/UX Design intern. I acquired a great amount of knowledge learning about the design system, user flow, and other aspects of design with my mentors and my team.
Work Overview
I worked on redesigning four of the main pages within the app store by implementing various design system elements. Additionally, I developed a page from scratch, which was launched for the first time in this update.
Outcome
I took ownership of all the prototypes shown below, which were implemented in this new launch. I made strategic decisions, paying close attention to OKRs, and overachieved KPI metrics.
Define
What is the problem
Between the other UX intern and me, we mapped out the user journey to better understand the app store and identify opportunities within. We then presented our findings to the team and identified some opportunities to incorporate into my internship.
We also received feedback from surveys conducted by the usability team, indicating that users sometimes encounter difficulty reading certain texts in the subtitles.
User Needs:
In our user research, we concentrated on the needs of individuals who use their phones for gamification purposes.
For them, the primary objective is to download their desired apps faster and discover new apps they may not have encountered before.
I had 4 tasks including design and internal report for this internship.
For UX, My task for this internship was splited into 2 main parts:
-
Redesign log in, and discover page base on negative feedbacks
-
Design a top charts page in the App store individually from scratch.
Process
01.
Empathize
02.
Define
03.
Ideate
04.
Prototype
05.
Testing
06.
Reflect
Task 1: How might we modernize and enhance the UX experience for the log in and discover page?
Quick overview of final products
Ideate
Old Version
Biography:
Matthew is a young adult who has recently started working. He uses his phone for entertainment during his commute to work. He is constantly seeking new games to keep himself entertained throughout the entire journey to work.
​
Frustration
-
Unsure about which games align with his preferences
-
Lacks clear indicators of popular entertainment apps
-
Doesn't want to waste his commute time searching for options.
Fixing design system on:
I mostly worked on the first version of color theme and button state so that the designers could share with other team members. Later, I wireframed and created a 4 high-fi prototype as seen at the end of this section.
Prototype & Testing (full process available base on request)
Process
To ensure that all the design element matches with the WCAG guidelines, we conducted many internal usability testing
Prototype
Iteration
Heuristic Evaluation
Persona
Task 2: How can we effectively communicate new trending app highlighted for users in a more direct and effective manner?
If you notice the old version, the subtitle in orange highlights the top-ranked app daily. We took it down due to inconsistency in subtle. This information is not only useful for promotion but also informs users on popular apps periodically
We decided to create a top chart page separately that you can navigate directly to from the bottom of the page that increase efficiency for the users
Ideate
Brainstorming Design Strategy
I also conducted research on several features of mobile charts. These are pages from which I can learn starting from scratch. Some commonalities among them include the page being split into two sections, with a significant section showcasing a top-ranked system.
Some examples of low-fidelity design systems that proved effective involved merging various ideas into one cohesive concept
-
A separate section for "hide installed app"
-
Utilized a crown icon to indicate 'ranking status.'
-
Adopted a non-slanted top aspect for ease of implementation.
This newly developed page can be navigated directly through the bottom bar from log in.
Define
Why are we designing a new page
What are the Common Practices
Prototype
Low-Fi Prototype
Final High Fi Prototype
Iteration
Takeaways
Impact
KPI metrics that went up from last time I talked with the team. So grateful to be part of this launch!
-
Click-Through-Rate (CTR)
-
Customer Satisfaction (CSAT)
-
User retention rate (CRR)
Scalability
The concept of scalable UX stood out to me while I was working on this project with the team. To ensure the future success of the product's development, it is important to strategize designs that can accommodate large volumes of data and users without requiring significant redesign.
