Art Direction

ZHANG WAN RU 0368214

20/04/2026—23/07/2026 (Week 1-Week 14)

Art Direction / Bachelor of Design in Creative Media / Taylor's University

---

TABLE OF CONTENTS

1. Lecture

2. Introduction

3. Project Development

1. EXERCISE 01 - GAME OBSERVATION STUDY
2. EXERCISE 02 - GAME VISUAL ANALYSIS
3. ASSESSMENT 01 - PROJECT PROPOSAL
4. ASSESSMENT 02 - FINAL PROJECT

4. Reflection

---

Introduction

---

Lecture                                                                                 

Week 2: Game Observation Study

Fig. Exercise 01 - Game Observation Study - Slide (Week 2)

Week 3: Game Visual Analysis

Fig. Group - Game Visual Analysis - Slide (Week 3)

Week 5: Proposal & Project Management

Fig. Group - Proposal & Project Management - Slide (Week 5)

Week 13: Final Project – Documentation and Presentation

Fig. Group - Final Project – Documentation and Presentation - Slide (Week 5)

---

EXERCISE 01 - GAME OBSERVATION STUDY    

This exercise trains students to observe, identify, and analyze how art direction supports gameplay, player experience, and visual communication.

For each game, we should cover:

• What visual decisions were made
• Why those decisions were made 
• How they support the game experience 
• What works well and what fails

During this analysis, I focused on:

• Basic Game Information: Gathered essential information about the game, including its genre, platform, developer, and target audience.
• Core Gameplay Mechanics: Described how the game is played, including the main objectives, player interactions, and core gameplay loop without providing analysis.
• Visual Framework Analysis: Examined the game's art direction by analyzing its visual style, color palette, environment, character design, user interface, lighting, composition, and visual communication.
• Strengths and Weaknesses of the Art Direction: Evaluated which visual decisions effectively supported the gameplay and player experience, while identifying areas that could be improved.

I chose 

1. Subway Surfers 
2. Temple Run 
3. Angry Gran Run

Fig. Game observation study slide 

EXERCISE 02 - GAME VISUAL ANALYSIS   

Our Group Member:

• PHANF ANN - 0362148
• ZHANG WANRU-0368214 （me）
• RIO SATO - 0360530
• LOW GUANGYAN - 0374051

Each group will:

• Determine the art direction for the redesign of the game ‘Subway Surfers.'

• Define a clear visual direction

• Use structured tools to guide decisions.

Based on all my previous understanding, I placed all the games onto a position-mapping chart. This gives us a sense of positioning for the game we want to make.

Fig. Position Mapping Chart

Fig. Position Mapping Chart

Based on our professional background, my responsibilities are related to the UI design. I want to create buttons that give a three-dimensional feel.

Fig. UI Elements

Fig. Game Visual Analysis slide 

ASSESSMENT 01 - PROJECT PROPOSAL   

The proposal should cover:

Part A – Visualization Factors

Big idea

Must Have, Good to Have & Nice to Have

IS / IS NOT

Position Mapping, Artistic Target & Style Range Finder

Part B – Visual Library

Moodboards

Part C – Game Visual Goals

Character design direction

Environmental direction

UI/UX direction

Game Name: Circus Escape

When Mr. Fitri posted the task, we assigned parts immediately.

• ZHANG WAN RU (me)
• UI/UX design 
• Icon design
• PHANF ANN
• Slide 
• RIO SATO
• Environment design
• Obstacle design
• LOW GUANGYAN
• Character Design
• Game Introduction Design

So I browsed through a lot of icons from endless running games to find styles relevant to our theme.

Fig. Reference

For the UI of Circus Escape, I chose a glossy & rounded 2D sticker style for the icon design. Since this is a fast-paced endless runner game, players need to recognize buttons and game information quickly while moving. To make the icons easy to spot, I used bold white outlines, bright colors, and simple shapes, so important functions like Start, Pause, and Power-ups can be identified at a glance.

I also used rounded corners and glossy highlights to give the icons a soft, playful, and jelly-like look. This matches the fun circus theme and helps make the game feel more friendly and less stressful. At the same time, the shiny buttons create a stronger sense of interaction, making them look more clickable and improving the overall user experience.

Fig. AI Process

Fig. First Icon Design

Based on Mr. Fitri's feedback, he suggested we change the color and font to avoid any font showing through. He also suggested avoiding such a sharp font and using a more rounded one instead.

Then I added circus elements to our power-up to make the icon design look more in line with the circus style.

Fig. AI Process

Fig. Second design

ASSESSMENT 02 - FINAL PROJECT

• Part A – Final Game Concept 
• Part B – Final Art Deliverables 
• Part C – Art Direction Guidelines – Detailed Breakdown and Supporting Information 
• Part D – Project 02 Management Log – Evidence from Previous Briefings

Based on the previous feedback, I refined the typography by selecting a more suitable font. I learned that the text should not be stretched or compressed, as this affects readability and makes the interface look less polished. The font also needed to feel softer and less sharp to better match the game's fun and playful style.

After exploring different options, I chose Arial Rounded MT Bold because of its rounded letterforms and clean appearance. It fits the cheerful circus theme while improving readability and creating a more friendly and consistent UI.

Arial Rounded MT Bold Font

Fig. Font

Fig. Final Icon Design

Then we continued developing the UI; I needed to create a mockup of our game's layout. My team members completed the environment and cover creation.

After finalizing the visual style, I started designing the game layouts based on our user flow. Organizing the screens in a clear sequence helped ensure that players could easily understand the game from the moment they opened it.

The layout flow includes:

1. Onboarding Page – Introduces the basic controls and gameplay.

2. Short Storytelling – Briefly explains the game's background and sets up the circus adventure.

3. Start Game Page—Allows players to begin the game.

4. Lobby Page – Players can choose between Single Player or Two Players mode.

5. Gameplay Screen – The main game interface where players start their adventure.

Designing the layouts based on the user flow also helped me create a smoother and more consistent experience, making it easier for players to navigate through each stage before entering the game.

Fig. Visual Layout

Fig. Visual Layout

Fig. Layout Showcase Figma

After presenting the UI layout, I received several helpful suggestions from Mr. Fitri: Change "Single Player" and "Two Players" to "1 Player" and "2 Players" for better consistency and readability.

Make the arrows in the 150m Challenge screen stand out more by changing them to a brighter color, such as yellow, so players can notice them more easily during gameplay. Based on this feedback, I refined the UI to improve visual clarity and make the gameplay experience more intuitive.

Fig. Visual Layout

Fig. Visual Layout

One of our newly added features is the 150m Challenge. Every 150 meters, the gameplay pauses briefly, and both the escapee and the pursuer take turns placing obstacles for each other. The next choice determines whether they avoid the obstacle or get caught, adding more strategy and excitement to the endless running experience. 

Since the challenge can end in two different outcomes, victory or failure, we designed two separate result screens. Each screen uses different visuals and messages to clearly show the outcome and provide players with appropriate feedback before they continue or restart the game.

Fig. Visual Layout

Final Showcase：

Fig. Final Showcase Figma

Week 14: Final Presentation:

https://canva.link/vzt6jtm48l2ja0y

Presentation Video Link:

https://drive.google.com/file/d/129FHA2jmAhUtBm3QZ0iHh7180SSIPo9O/view?usp=sharing

---

Reflection 

• What did you learn/enjoy the most about this module?

• The part I enjoyed the most was learning how art direction can completely change the feel of a game. Before this module, I mostly focused on making things look nice. But now I understand that every design choice, like colors, fonts, icons, and UI, should match the game's theme and create a better experience for players. I also really enjoyed working on Circus Escape with my teammates and seeing our ideas slowly come together into a complete game.

• What areas of improvement can you implement to better improve your art direction sense in the future?
• I think I still have a lot to learn. In the future, I want to look at more games and study how different art styles are used to support gameplay and storytelling. I also want to improve my understanding of color, composition, and visual hierarchy so I can make better design decisions. Most importantly, I want to keep practicing and asking for feedback, because every project helps me become more confident and improve my art direction skills. I want to develop more fun features so that more people can enjoy and relax while playing.