Black Myth WuKong UI&UX Redesign Project
This project is a UI & UX redesign concept for a potential mobile version of Black Myth: Wukong. The main goal is to optimize the mobile gameplay experience while preserving player familiarity with skill layouts and interactions from the existing PC version.
1. Project Overview
The Concept
With Black Myth: Wukong gaining widespread attention, this project reimagines its UI for mobile to improve usability and visual clarity while preserving the game’s original aesthetic.
Timeline
4 weeks
Tool Used
Figma, Photoshop
Number of Team
Solo Project
Pain Points
Black Myth: Wukong draws heavily from the Eastern cultural classic Journey to the West, incorporating historical terminology and ancient Chinese concepts. As a result, many players may initially struggle to understand skill descriptions and related mechanics.
In addition, the game currently has no mobile version, limiting access to players with a PC or console. This project explores how the game’s UI and UX could be adapted for mobile, making it more accessible while retaining its original depth and style.
Solutions
Skill Icon Design: Created a set of intuitive icons to help players quickly understand and recognize skills, reducing reliance on text-heavy descriptions.
Mobile UX Prototype: Developed a mobile-friendly layout and interactive prototype to simulate how the game could function on smaller screens while preserving its core gameplay experience.
Design Process
Empathize
User Interviews
User Research
Define
Persona
Empathy Mapping
Ideate
User Flows
Task Flows
Design
Low Fidelity
High Fidelity
2. Empathize
Research & Interview
Understanding the User's Need
Through playtests with five participants, I identified key reasons why new players often misunderstand the game’s skill system.
Unclear Skill Categorization: The way skills are grouped is not intuitive for newcomers. Players need to spend both time and skill points to figure out differences on their own.
Reluctance to Experiment: Early in the game, players are hesitant to invest limited skill points in abilities they are uncertain about.
Impact on Retention: Ambiguous skill descriptions can cause frustration, leading some players to abandon the game altogether in its early stages.
Example of players may be misled
Staff Stance
Player Misinterpretation: “Stance” feels abstract compared to skill names in other games, making it unclear what it refers to.
Actual Meaning: A skill related to weapon handling, specifically for the staff.
Transformation
-
Player Misinterpretation: In the early game, players have no access to transformation, so some did not understand the term or its function.
-
Actual Meaning: Allows the player to temporarily transform into another character.
Mysticism
-
Player Misinterpretation: Some thought it referred to a visual effect applied to a weapon (e.g., flames).
-
Actual Meaning: A magical skill or attack type.
3. Ideate
User Flow
Game Start
Players feel excited and motivated to begin their journey.
Defeat Normal Enemy
Players earn skill points, reinforcing their desire to continue playing.
Lost Boss Fight
Players feel frustrated but motivated to improve their character’s strength by investing skill points.
Fail To Gain Power
Players know which abilities they want to enhance but can’t find them in the UI, leading to confusion and disengagement.
4. Design
Low & High Fidelity
Goals
Black Myth: Wukong draws inspiration from the Eastern cultural classic Journey to the West, combining high-fidelity realistic art with immersive combat. In this redesign, I focused on preserving its distinctive Eastern aesthetics and narrative style while adapting the UI for mobile.
The goal was to strike a balance between functionality and visual appeal, with tailored adjustments for key player scenarios — including combat, exploration, and skill management. The design also needed to align with mobile player behavior patterns to ensure comfort, intuitiveness, and ease of use across touch-based interactions.
Low Fidelity
Through player interviews and observation of gameplay styles, we found that Black Myth: Wukong demands a fast-paced playstyle. Players rely on the movement and attack buttons far more than other controls, making it essential to place these two buttons in positions that feel intuitive and familiar to them.
In-Game Battle Layout
.png)
Skill Panel
High Fidelity
Players expressed strong appreciation for the game’s ancient Chinese art style and wanted the UI to reflect the same aesthetic. The high-fidelity design incorporated traditional Eastern motifs, color palettes, and textures to ensure visual consistency with the game’s overall style.
.png)
In-Game Battle Layout
.png)
Skill Panel
5. Reflection
Outcome & Improvement
The Experiences
This was my first time completing an entire UI & UX design project on my own within a very short timeline. It allowed me to go through every stage of the design process, giving me a full end-to-end perspective of a UI/UX project and helping me grow into a more mature and confident designer.
Insight & Illustrations Improvement
This project made me realize that even the most polished games have areas for improvement — and it’s the designer’s role to identify and address them. I also honed my icon design skills, learning how to create visuals that are both aesthetically appealing and highly functional by applying effective use of light and shadow.
If I had more time
Some aspects of the Define, Ideate, and Test phases were less developed due to the compressed timeline. If I had more time, I would create an interactive demo to expand and strengthen these parts of the design process.
Key Takeaways
Developed the ability to manage a full UI/UX project independently under tight deadlines
Strengthened skills in research, icon design, and visual refinement
Learned the value of balancing aesthetics with functionality, especially in game UI design
Gained insight into identifying and solving user pain points even in highly polished games