top of page
Frame 5.png
My Roles & Responsibilities
UI/UX design
UX research
Deliverables
Player Journey
Paper Prototype
Flow Chart
Wireframe
Usability Test
UI Moodboard
UI Mockups
Player Accessibility
Length Of The Project
May 2023 - July 2023
Tool
Figma
FigJam
Adobe PS
Adobe AI
Group 45.png
Design Brief

This redesign project specifically targets the launch page of the game, taking inspiration from Animal Crossing. The main objective is to create an immersive player experience by seamlessly integrating the game's story into interactive gameplay. Utilizing a step-by-step approach, I will focus on designing intuitive interfaces and meaningful interactions, fostering natural communication between players and the game developer. By surpassing traditional gaming boundaries, the goal is to deliver a memorable and cohesive experience that captures the essence of Animal Crossing.

Challenges
Bridge the game development intension with players' experience
Developing a cohesive player experience
Identify the user insights during the gameplay
Provide UI for diverse groups with multi needs
image 39.png

THE PROCESS

Group 19.png

  • Understand the Players

  • Communicating through game languages

  • Overview Bridge Game Concepts & Players

  • Plan & Define Dev Tasks

  • Design information structure for the entire game

  • Design options on each screen

  • Deep dive on each screen to:

  1. Design information to communicate

  2. Design how to visualize, display and communicate information in a clear way

  • Conduct Usability Test & collect feedback from volunteers

  • Color Blindness Test

Player Journey

The player journey is a vital aspect of UI/UX game design, as it shapes the overall experience and satisfaction of players throughout their interaction with the game. As a UI/UX designer, I strive to create seamless and engaging player journeys that captivate players from the moment they start the game until the final moments of their gameplay. In this section, I'll provide a glimpse into my approach to crafting memorable player journeys.

Paper Prototype

In the realm of UI/UX game design, paper prototypes serve as invaluable tools for transforming abstract ideas into tangible and interactive experiences. As a UI/UX designer, I embrace the power of paper prototypes to explore gameplay mechanics, test user interactions, and iterate on design concepts. In this section, I will provide insight into my approach to creating and utilizing paper prototypes in the game design process.

Group 62.png

Flow Chart

Flowcharts are indispensable tools for visualizing the sequence and flow of player interactions within a game. As a UI/UX designer, I rely on flowcharts to map out the various screens, actions, and decision points that players encounter throughout their gaming experience. In this section, I will provide insight into my approach to creating comprehensive and intuitive flowcharts for game design.

Group 46.png

Wireframe

In the early stages of UI/UX game design, wireframes serve as the fundamental building blocks that bridge the gap between abstract concepts and concrete visual designs. As a UI/UX designer, I consider wireframes to be the backbone of the design process, enabling efficient communication of ideas and functionalities with the development team and stakeholders. In this section, I'll provide insight into my approach to crafting wireframes for game projects.

Group 27.png

Usability Test

Purpose: To test how users understand and react to the screen on the Animal Crossing game.
Goal: To ensure all screen content is engaging, interesting and informative. 
​
​Target: 18-55 years old, male & female, play switch games. 5 testers.
Platform: Figma wireframes

image 41.png
Usability Test Session.png

Result & Suggestions

The hairstyles of the boy avatar could display in different shapes.

 

It’s hard to decide which island the player wants to pick without showing the image of the islands (This will be adjusted in prototypes).

​

There is no way to go back to the home screen if the player hasn’t decided to confirm their name or birthday.

Group 66.png

UI Style

An exceptional UI/UX design embraces players of all backgrounds and abilities. I am committed to creating interfaces that are accessible and inclusive. This involves choosing color palettes that are readable for players with color blindness, providing customizable font sizes, and implementing clear visual cues for those with different cognitive or motor abilities. By prioritizing accessibility, I strive to make gaming an enjoyable experience for a diverse audience.

Group 42.png

UI Mockup

This UI mockup brings together the wireframes and usability test insights to create visually stunning and user-centric designs. By translating wireframes into captivating visual designs, incorporating usability test insights, enhancing visual appeal and engagement, and engaging in iterative refinement, I will deliver a polished and immersive UI mockup that elevates the player's experience.

Group 45.png
Profile Setup Mock Up-1.jpg
Edit avatar Mock Up before.jpg
Island Pick Mock Up.jpg

Accessibility Test

Group 21.png
Group 67.png

Outcomes

Ellipse 62.png

Ensure the players get a clear experience from the profile setup.

Ellipse 62.png

Design intuitive interfaces and meaningful interactions.

Ellipse 62.png

Fostering natural communication between players and the game developer.

bottom of page