Categories
Advanced and Experimental 3D Computer Animation Techniques Sessions with Serra

Week 8 : Character Design, UI Design and Chapter Narrative Planning

In Week 8, I continued to develop the design of Behind the Page. In Week 7, I mainly worked on the visual planning of the bedroom scene. This week, I started to further develop the character design, UI system, and the narrative structure of the first chapter. Because this project is not only a visual scene, but also an interactive narrative game where the player needs to click, read, and switch perspectives, I needed to design what the player would see, what they would click, and how this information could help them understand the story.

Character Design

This week, I started to organise the main character design for the project. The core characters in the first chapter are the little girl and the mother. The little girl is the central character of the memory. She represents a childhood perspective, curiosity, and the desire to escape from reality. The mother represents external rules, study pressure, and a sense of control within the family. The relationship between them will influence how the player understands the bedroom memory scene.

For the visual style, I wanted the characters to be simple and clear, rather than too detailed. Because the project will later move towards a pixel art style, the character design needs to be easy to simplify into pixel characters. The characters do not need to have realistic proportions. Instead, they can be closer to small game characters, so they can stay consistent with the bedroom scene, UI, and interaction style.

[Character Design]
[Character Pixel Art]

The little girl and the mother are the main characters in Behind the Page. Their relationship affects how the player understands the bedroom memory scene.

UI Visual Design

Besides character design, I also started to develop the visual direction of the UI system this week. Because the core concept of Behind the Page is a memory book, I wanted the UI to feel connected to pages, paper, bookmarks, and sticky notes, instead of looking like a normal game interface. The dialogue box, buttons, and menu all need to match the overall visual style of the project.

The dialogue box is an important tool for the player to understand the story. After the player clicks on an object, they can read object information, character thoughts, or hidden clues through the dialogue box. Therefore, the dialogue box should not take too much attention away from the scene, but it still needs to be clear enough for the player to understand that they are receiving a piece of memory information. The 2D / 3D switching button is also one of the most important UI elements, because it directly connects to the gameplay theme of “changing perspective to discover hidden information”.

[UI Design]

The dialogue box, buttons, and 2D/3D switching interface use paper, bookmark, and pixel-style visual elements, so they can stay connected to the memory book theme.

First Chapter Design

This week, I also started to design the specific content of the first chapter. The first chapter mainly takes place in the bedroom, and the story is set after school. On the surface, the player sees an ordinary child’s bedroom, with a desk, computer, homework book, poster, game console, bed, and door. However, these objects are not only decorations. They are all connected to the character’s memory, emotion, or hidden information.

The main conflict of the first chapter is the choice between homework and games. The homework book represents study pressure. The computer and game console represent entertainment and escape. The door is connected to the appearance of the mother. The player needs to click on these objects to slowly understand the pressure and desire inside the room. This chapter does not directly tell the complete story. Instead, it allows the player to gradually piece together emotional clues through short sentences, objects, and hidden information.

ObjectSurface MeaningHidden Meaning
ComputerPlaying gamesTemptation / escape
HomeworkHomeworkStudy pressure
DoorDoorMother’s control / being caught
PosterDecorationHidden clue
Game ConsoleToyChildhood desire
BedRestSafety / escape

[Flow Design]

This flow shows how the player starts from the bedroom scene and moves the story forward through clicking objects and switching perspectives.

Storytelling Through Hidden Information

Another focus of Week 8 was thinking about how to tell the story through hidden information. I wanted every object in the room to have two layers of meaning: one is the surface function that the player first sees, and the other is the emotional meaning inside the memory. For example, the computer is used for playing games on the surface, but it also represents temptation and escape. The homework book looks like a normal school task, but it also represents pressure. The door is only an entrance to the room on the surface, but it may also represent the mother’s control, the tension of being caught, or a boundary within the family relationship.

Through this design, I hope the player will not passively receive the story. Instead, they can actively understand the story by clicking, reading, and switching perspectives. Hidden information can turn an ordinary room into a memory space, and it can also make the player realise that memory is not only what is shown on the surface.

Through the design work in Week 8, I gained a clearer understanding of the narrative structure of Behind the Page. The characters, UI, and objects should not be separate parts. Instead, they should all work together to support the player experience. For the next step, I need to bring these designs into Godot for testing, create clickable areas, dialogue boxes, and basic buttons, and turn the first chapter from a design plan into a playable prototype.

Leave a Reply

Your email address will not be published. Required fields are marked *