Game Mechanics Explained: Rules, Players, Avatars, Game State, Game Views and Goals

September 26, 2026 Aven BrisailLeave a comment

Game mechanics are the rules and procedures that make a game work: what players can do, what the game does in response, and how someone wins or loses. When designers formulate the mechanics of a game, they define five things: the rules, the players, the avatars they control, the game state and the game views. They also plan goals, both short-term (collect this coin) and long-term (win the race).

In the previous lesson, Iterative Design in Games, we saw that mechanics are tested and revised again and again. Here we learn how to write them clearly in the first place.

Common mechanics found in most games

Common mechanic	Question it answers	Example (a racing game)
Setup	How does the game begin?	Four karts line up on the start grid; each player picks a character and a track.
Victory conditions	How does someone win (or lose)?	The first to finish three laps wins.
Progression of play	How does the game move forward?	Players race in real time; laps are counted; new tracks unlock after each cup.
Player actions	What can the player do?	Accelerate, brake, steer, drift and use a collected item.
Definition of game views	What does the player see?	A third-person camera behind the kart plus a mini-map; split-screen for local multiplayer.

Figure 1 – Four-player split-screen in SuperTuxKart. The game view is part of the mechanics: each player gets their own camera on a shared screen. Image: QwertyChouskie, CC BY-SA 4.0, via Wikimedia Commons.

Formulating the mechanics: the five parts

1. Rules

Rules define what is allowed, what is not, and what happens as a result. Good rules are clear, consistent and testable. Write them as short “if… then…” statements: If the ball touches the paddle, then it bounces and the score increases by one.

2. Players

Decide how many players there are and how they relate: single-player against the game, player versus player, cooperative, team versus team, or many players online. The same rules feel completely different when played together or against each other.

3. Avatars

An avatar is the character or object that represents the player: a hero, a car, a paddle, even a cursor. Define what the avatar can do (its abilities), how fast it moves, and what happens when it is hit or helped.

4. Game state

The game state is a snapshot of everything that matters at one moment: scores, lives, positions, time left, items held, which doors are open. When you save a game, you save its state. In programming, game state is stored in variables, and every rule either reads or changes those variables.

5. Game views

Game views define how the game world is shown: the camera angle, how much of the world is visible and what information appears on the HUD. Views are covered in detail later in this module.

Short-term and long-term goals

Goals give players a reason to act. Short-term goals can be completed in seconds or minutes: collect a coin, jump a gap, beat one enemy. Long-term goals take a whole level, session or game: win the race, finish the story, complete the collection. Good games layer them, so there is always something to do right now and a bigger reason to keep going. Many games also have medium-term goals, such as finishing a level or upgrading a tool.

Figure 2 – A simple platformer level. Short-term goals (reach the next platform, grab the item) build towards the long-term goal of reaching the exit. Image: Kenney (kenney.nl), CC0, via Wikimedia Commons.

Try the Scratch Team’s Pong Starter below. Look for its rules, its avatar (the paddle), its game state (the score) and its goals, then click “See inside” to see how the mechanics are built with code blocks.

View it at scratch.mit.edu

Some mechanics are hidden: games quietly help players to make play feel fair and exciting. Extra Credits explains these “hidden mechanics”:

Example

Here are the formulated mechanics for a one-screen game called Coconut Catch:

Players: one player against the game.
Avatar: a basket that moves left and right along the bottom of the screen at a fixed speed.
Setup: the score is 0, lives are 3, the timer is 60 seconds, and the basket starts in the centre.
Rules: coconuts fall from random positions; if a coconut touches the basket, score +1; if a coconut hits the ground, lives −1; every 10 points, coconuts fall faster; a golden coconut is worth 5.
Game state: score, lives, time left, fall speed and the position of each coconut.
Victory conditions: the player wins by reaching 30 points before time runs out; the game ends if lives reach 0.
Game view: a static side view of a beach with the score, lives and timer at the top.
Goals: short-term – catch the next coconut; long-term – reach 30 points and beat your high score.

Exercise

Choose a game you know and describe its setup, victory conditions, progression of play, player actions and game views.
List three short-term and two long-term goals from any game. Explain how the short-term goals help players reach the long-term goals.
Formulate the full mechanics (rules, players, avatars, game state, game views) for your own simple game, using the Coconut Catch example as a model.
Remix the Pong Starter project: add one new rule and one new variable to the game state, then describe how they change the play.

Next: Types of Stories in Games: Linear, Branching, Open-Ended, Instanced, Emergent, Thematic and Algorithmic

Syllabus link: This post is relevant to the CAPE® Animation and Game Design Syllabus, Unit 2: Interactive Design and Game Development, Module 2: Game Design and Development – Specific Objective 7 (“identify some common mechanics used in games”); Specific Objective 8 (“formulate the mechanics for a game”); Specific Objective 9 (“distinguish between short term and long term goals for games”).

Attributions to media used in this post:

Split-screen 4-player multiplayer in SuperTuxKart (2017, 0.9.3).png – QwertyChouskie – CC BY-SA 4.0 (via Wikimedia Commons)

1-bit platformer sample.png – Kenney (kenney.nl) – CC0 (via Wikimedia Commons)

Iterative Design in Games: Prototype, Playtest, Revise, Repeat

September 26, 2026September 26, 2026 Aven BrisailLeave a comment

Iterative design is a way of creating games in repeated cycles: you build a quick prototype, playtest it with real players, revise it based on what you learn, and repeat until the game is fun and works well. Each cycle is called an iteration. The word “iterate” simply means “to do again”, and the aim of each round is to get a little closer to the best version of the game.

In The Game Design Process: RAD vs Waterfall we compared development models. Iterative design is at the heart of Rapid Application Development and of almost every modern game studio, because fun is hard to predict on paper – you have to play it to know.

The stages of iterative design

1. Rapid prototyping

A rapid prototype is a quick, rough version of an idea, made in hours or days rather than months. It can be a paper prototype (cards, dice, drawings) or a digital prototype with coloured boxes instead of art. The only question it must answer is: does this core idea work and is it fun? Keep it cheap so you are not afraid to throw it away.

2. Playtest

In a playtest, real players try the prototype while the designer watches. Good playtesting habits include:

Test with people who match your target audience, not just friends who love your idea.
Explain as little as possible – if players need you to explain, the game needs to explain better.
Watch and take notes: where do players hesitate, get stuck, laugh or lose interest?
Ask open questions afterwards (“What was confusing?”, “When did you feel most excited?”).
Record data if you can: time to finish a level, number of retries, where players quit.

The Extra Credits video below gives excellent advice on getting useful feedback from playtesters:

3. Revision

Revision means changing the design in response to what you observed. Group the feedback, look for patterns (one player’s opinion is a clue; five players stuck in the same place is a problem), and decide on changes. Sometimes a revision is a small tweak – slower enemies, a bigger button – and sometimes it means cutting a feature entirely.

4. Repeat

Then you repeat the loop with the revised version. Early iterations test big questions (Is the core idea fun?). Later iterations test details (Is level 7 too hard? Is the menu clear?). Each round the prototype becomes more polished, moving through alpha and beta towards the gold release.

5. Iterative design as a mindset

Finally, iterative design is an attitude: accept that the first version will not be perfect, test early and often, and let evidence from players guide decisions instead of guesses. It saves time and money because problems are found while they are still cheap to fix.

Common mistakes to avoid

Polishing too early: spending days on art for a mechanic that playtesting later removes.
Testing only with yourself: designers know the answers, so they cannot see what confuses new players.
Defending instead of listening: arguing with testers wastes the test; just take notes.
Changing everything at once: if you change five things, you will not know which change helped. Change a few things per iteration.
Never stopping: set a deadline or a “good enough” target so iteration leads to a finished game.

Example

A student team is making a Scratch game where a hummingbird collects nectar while avoiding rain drops.

Iteration	Prototype	Playtest finding	Revision
1	Paper version: a counter moved on a drawn garden; a die decides where rain falls.	Players enjoyed dodging but found collecting too easy.	Flowers now open and close, so timing matters.
2	Scratch prototype with coloured circles, no art.	Controls felt slippery; the bird overshot flowers.	Reduced momentum; added a small hover when touching a flower.
3	Added simple art, sound and a score.	Players did not notice when nectar was collected.	Added a “sip” sound, sparkle effect and +1 pop-up.
4	Three levels with increasing rain.	Level 3 was too hard – most players quit.	Adjusted rain speed; added a safe leaf to shelter under.

After four iterations the game was far more fun than the first design – and none of the changes could have been predicted without playtesting.

Exercise

Name and describe the stages of iterative design in your own words.
Make a paper prototype of a simple game idea in under 30 minutes using paper, pencils and a die or coins.
Playtest it with at least three people. Record what they did, what confused them and what they enjoyed.
Write an iteration table (like the example) showing two rounds of revisions and the reasons for each change.

Next: Game Mechanics Explained: Rules, Players, Avatars, Game State, Game Views and Goals

Attributions to media used in this post:

Iterative development model.svg – Aflafla1 – CC0 (via Wikimedia Commons)

Diamond Trust of London – Paper Prototype.jpg – Jason Rohrer – Public domain (via Wikimedia Commons)

The 10 Core Dynamics of Games Explained (With Examples)

September 26, 2026 Aven BrisailLeave a comment

The core dynamics of games are the basic kinds of activity that give a game its purpose and shape – what the player is fundamentally trying to do. Dynamics are the patterns of play that appear when players follow the mechanics (rules). Game designers often list ten core dynamics: territorial acquisition, prediction, spatial reasoning, survival, destruction, building, collection, chasing or evading, trading and race to the end.

We met game elements such as rules, goals and conflict in Elements of Gameplay and Game Theory. Core dynamics are the next layer up: they describe the experience those elements create.

Mechanics, dynamics and aesthetics (MDA)

The MDA framework explains the relationship. Mechanics are the rules designers write. Dynamics are the behaviours that happen when players interact with those rules. Aesthetics are the emotions players feel, such as challenge, discovery or fellowship. Designers work from mechanics outwards; players experience games from aesthetics inwards.

The ten core dynamics

Dynamic	What the player does	Examples
Territorial acquisition	Gains and controls space on a board or map.	Go, Risk, capture-the-flag, many strategy games.
Prediction	Guesses what will happen or what an opponent will do.	Rock-paper-scissors, guessing games, betting on a race outcome in a party game.
Spatial reasoning	Thinks about shapes, positions and routes.	Tetris, jigsaw puzzles, Portal-style puzzles.
Survival	Stays alive or keeps something going under pressure.	Endless runners, survival crafting games.
Destruction	Breaks or removes things.	Breakout, Angry Birds, Space Invaders.
Building	Creates structures, cities or systems.	Minecraft, SimCity, Lego games.
Collection	Gathers items or sets.	Coins in Super Mario, Pokémon, card collections.
Chasing or evading	Pursues targets or escapes from them.	Tag, Pac-Man, racing to catch a thief.
Trading	Exchanges resources with others.	Monopoly, Catan, market systems in farming games.
Race to the end	Reaches a goal before others.	Snakes and Ladders, Ludo, racing games.

Diagram of a Go board with black and white stones, showing areas of territory each player controls — Figure 1 – The end of a game of Go on a 9×9 board. Go is the classic example of territorial acquisition: players win by surrounding more of the board. Image: Jogador de Go, CC BY-SA 4.0, via Wikimedia Commons.

Distinguishing between the dynamics

Some dynamics sound similar, so it helps to ask what counts as success:

Territorial acquisition vs building: in territory games you win by controlling space; in building games you succeed by constructing something, even if no one else is competing for space.
Survival vs chasing/evading: survival is about lasting as long as possible against any threat (hunger, weather, time); evading is specifically about staying away from a pursuer.
Collection vs trading: collection is about gathering; trading is about exchanging what you have for what you need, usually with other players.
Race to the end vs chasing: in a race all players head for the same finish; in a chase one player’s goal is another player.

Combining dynamics

Most games combine several dynamics, with one or two dominant. Pac-Man mixes collection (dots) with evading (ghosts) and, briefly, chasing (after a power pellet). Sandbox games such as Minetest combine building, collection and survival. Choosing the dominant dynamic early helps a team make consistent decisions about controls, levels and rewards.

Using core dynamics as a designer

Core dynamics are a powerful brainstorming tool. When you are stuck for an idea, pick two dynamics at random and combine them with a theme: “building + evading in a hurricane” or “trading + prediction at a fish market”. You can also use them to change the feel of an existing game. Adding a chaser to a calm collection game instantly creates tension; adding building to a survival game gives players something to protect and a reason to plan ahead.

Dynamics also help you check whether your mechanics support your goal. If you want players to feel clever, spatial reasoning and prediction are good choices. If you want them to feel powerful, destruction works well. If you want cooperation, trading and building let players help each other, creating a positive-sum game in which everyone can gain.

Example

A class played Ludo and a mobile endless runner and recorded the dynamics they observed:

Game	Dominant dynamic	Supporting dynamics	Evidence
Ludo	Race to the end	Chasing (capturing opponents), prediction (dice risk)	Everyone tries to get all four tokens home first; landing on an opponent sends them back.
Endless runner	Survival	Collection, evading	The run continues until you crash; coins are collected along the way; obstacles and a pursuer must be avoided.

Exercise

For each of the ten core dynamics, name one game (digital, board or playground) in which it is dominant.
Choose one game and identify its dominant and supporting dynamics. Explain how its mechanics create those dynamics.
Explain the difference between territorial acquisition and building using two examples.
Design a simple board or card game in which trading is the dominant dynamic. Write three rules and describe what players will experience.

Next: Iterative Design in Games: Prototype, Playtest, Revise, Repeat

Attributions to media used in this post:

Diagrama do final de uma partida de Go em tabuleiro 9×9 rotulado.jpg – Jogador de Go – CC BY-SA 4.0 (via Wikimedia Commons)

0 A.D. Alpha 23.jpg – 0 A.D. Developers (Wildfire Games) – CC BY-SA 3.0 (via Wikimedia Commons)

Minetest screenshot 2.png – Kotolegokot – CC BY-SA 3.0 (via Wikimedia Commons)

Game Design Terms, Careers and the Types of Design in Games (World, System, Content, Level, UI)

September 26, 2026 Aven BrisailLeave a comment

Game design is the art of applying design and aesthetics to create a game that is fun, challenging and meaningful to play. A game designer decides the rules, goals, challenges and experiences, while a whole team of game development professionals turns those decisions into a finished product. To work in that team you need its shared vocabulary, an understanding of its careers, and a clear idea of the different types of design that go into a game.

For an overview of the wider industry, see Jobs in Animation and Game Design. This post zooms in on the game development team and the design disciplines inside it.

Common game design terms

Term	Meaning
Mechanics	The rules of a game: what players can do and what happens as a result.
System	A collection of mechanics that work together to produce a result, such as an economy or a combat system.
Avatar	The icon or figure that represents the player in the game.
Engine	The core software that runs the game: graphics, physics, sound, input (for example Unity, Unreal, Godot).
Platform	The console, device or system a game runs on (PC, phone, console, web, VR).
Prototype	An early playable version of a game or part of a game, made to test an idea.
Rapid prototyping	Techniques for making quick, rough prototypes so ideas can be tested early.
Playtest	Testing a game with real players to find problems, bugs and unclear design.
Bugs	Errors in the design, code, art, sound or writing of a game.
Milestone	A point in the schedule where something significant must be finished.
Alpha	A stage where the main features are in the game but it is incomplete and buggy.
Beta	A more stable version, often tested by outside players to find remaining bugs.
Gold	The final version, ready to be released to the public.
Feature list	A list of the game’s key features, often its selling points.
Game jam	An event where developers plan, design and build a game in a short time, often 48 hours.
Zero-sum / positive-sum	In a zero-sum game one player’s gain is another’s loss; in a positive-sum game everyone can gain.

Careers in game design and development

Career	What they do
Programmer	Writes the code for gameplay, graphics, physics, AI, tools and online features.
Artist	Creates concept art, characters, environments, textures, animation, visual effects and UI graphics.
Designer	Designs rules, levels, systems and player experiences; writes design documents and balances the game.
Producer	Manages the schedule, budget and team; keeps everyone on track and communicates with publishers.
Tester (QA)	Plays the game systematically to find and report bugs and usability problems.
Composer	Writes the music that sets the mood and reacts to gameplay.
Sound designer	Records and creates sound effects, ambient sound and audio feedback, and places them in the game.
Writer	Writes story, dialogue, character backgrounds, quest text and UI wording.

In small indie teams, one person may play several roles. Watch these professionals describe their paths into game-related jobs:

Types of design in games

World design

World design creates the big picture: the setting, history, geography, cultures and rules of the game world. A world designer decides whether the game happens on a floating island, in a future city or inside a computer, and makes sure everything in that world feels consistent.

System design

System design creates the rules and mathematics behind the game: how damage is calculated, how much items cost, how experience points work, how fast enemies spawn. System designers use spreadsheets to balance the game so it is fair and interesting.

Content design

Content design creates the individual things the player meets: characters, items, quests, puzzles, vehicles and missions. If system design says “weapons have power and speed”, content design invents the specific tools, each with its own numbers and personality.

Game writing

Game writing covers story, dialogue, character backgrounds and all the text in the game, including tutorials and item descriptions. Game writers must write for choices, repetition and different player paths (see Story Arcs, Game Scripts and Storyboards for Interactive Games).

Level design

Level design builds the spaces where play happens: layouts, obstacles, enemy placement, puzzles and the pacing of challenges. We practised this in Level Design: Planning the First Three Levels.

Screenshot of a tile map editor showing a grass and water terrain being painted with tiles — Figure 2 – The free Tiled map editor, used by level designers to build 2D levels from reusable tiles. Image: Thorbjørn Lindeijer, CC BY-SA 3.0, via Wikimedia Commons.

User interface (UI) design

User interface design plans the menus, HUD, icons and controls that let players understand and control the game. It draws on the interaction design ideas in Module 1 and is explored further later in this module.

Example

Imagine a small team making a farming game set on a Caribbean island:

The world designer creates the island’s villages, seasons, market days and folklore.
The system designer sets how fast crops grow, their selling prices and how rain affects them.
The content designer invents 20 crops, 10 tools and the villagers’ requests.
The writer gives each villager a personality and writes their dialogue.
The level designer lays out the farm, the market and the forest path.
The UI designer designs the inventory, calendar and money display.
The programmer, artist, composer, sound designer, tester and producer bring it all to life and on schedule.

Exercise

Create a glossary card for ten game design terms from this post, each with a definition and an example from a game you know.
Make an infographic of the eight game careers, showing one skill and one tool for each.
Choose a game and describe one decision from each of the six types of design.
Which career or type of design interests you most? Write a short paragraph explaining why and how you could start practising it now.

Next: The 10 Core Dynamics of Games Explained (With Examples)

Syllabus link: This post is relevant to the CAPE® Animation and Game Design Syllabus, Unit 2: Interactive Design and Game Development, Module 2: Game Design and Development – Specific Objective 1 (“define the common terms associated with game design”); Specific Objective 2 (“state the types of careers in game design”); Specific Objective 3 (“state the types of design associated with games”); Specific Objective 4 (“explain the different types of design”).

Attributions to media used in this post:

Drawing Cats on Wacom Intuos3 A5 graphics tablet – Global Game Jam Berlin 2014.jpg – Iwan Gabovitch – CC BY 2.0 (via Wikimedia Commons)

Tiled-screenshot-terrain.png – Thorbjørn Lindeijer – CC BY-SA 3.0 (via Wikimedia Commons)

GGJ LA 2015.JPG – Kevin Wong – CC BY-SA 4.0 (via Wikimedia Commons)

Culture, Game Ratings, Intellectual Property and Monitoring Agencies in Game Design

September 26, 2026 Aven BrisailLeave a comment

Culture is the shared beliefs, stories, language, music, food, clothing and customs of a group of people. In animation and game design, culture shapes characters, settings and stories, and it decides what an audience finds funny, respectful, frightening or offensive. Four related ideas help designers use culture responsibly: folklore, game ratings (age-appropriate content), intellectual property and the monitoring agencies that set and enforce the rules.

We looked at folklore and heritage in Folklore, Culture and Heritage in Animation and Game Design and at copyright in Ethics, Copyright and Intellectual Property in Animation and Game Design. This post connects those ideas to publishing a game for real audiences.

Why culture matters

Authenticity: stories rooted in real places and traditions feel fresh and believable.
Representation: players like to see people, places and accents like their own on screen.
Respect: careless use of sacred symbols or stereotypes can hurt communities and damage a game’s reputation.
Market: culturally aware games travel better worldwide, and local stories can stand out in a crowded market.

Folklore: culturally and geographically appropriate characters

Folklore is the traditional stories, legends and characters passed down in a community. Mythological characters make memorable game heroes, guides and bosses, but they should be culturally and geographically appropriate: they should match the setting and be presented in a way the source community recognises.

The Caribbean offers rich examples. Anansi, the clever spider who outwits stronger animals, travelled from the Akan people of West Africa to Jamaica, Trinidad and Tobago and beyond; he suits a puzzle or trickster game. Trinidad and Tobago’s folklore includes Papa Bois, guardian of the forest and its animals, and Mama Dlo, protector of rivers – ideal characters for a game about protecting the environment. Placing these characters in a snowy European forest would feel wrong; placing them in a rainforest with local plants, music and dialect feels right.

Old book illustration of Anansi, a spider character with a human-like face — Figure 1 – An illustration by Pamela Colman Smith from *Annancy Stories* (1899), a collection of Jamaican Anansi tales. Anansi stories are shared across West Africa and the Caribbean. Image: Pamela Colman Smith, Public domain, via Wikimedia Commons.

Good practice: research with elders, historians and cultural groups; credit your sources; avoid mixing unrelated traditions just for effect; and ask community members to review your designs.

Game ratings: age-appropriate content

A game rating tells buyers the age group a game is suitable for and what content it contains. The CAPE glossary uses the categories of the Entertainment Software Rating Board (ESRB), used in North America and followed by many Caribbean retailers:

Rating	Meaning
EC – Early Childhood	Suitable for ages 3 and up (this category was retired by the ESRB in 2018; such games are now rated E).
E – Everyone	Suitable for all ages; may contain minimal cartoon or mild violence.
E10+ – Everyone 10+	Suitable for ages 10 and up; more cartoon or mild violence, mild language.
T – Teen	Suitable for ages 13 and up; may contain violence, crude humour and some strong language.
M – Mature 17+	Suitable for ages 17 and up; intense violence and strong language.
AO – Adults Only 18+	Only for adults; rarely used and not sold by most major stores.

Games also carry content descriptors (for example “Mild Fantasy Violence”) and notes about interactive elements such as in-game purchases or users interacting online. Europe uses PEGI (ages 3, 7, 12, 16 and 18), and the International Age Rating Coalition (IARC) gives ratings for many digital stores worldwide.

Black-and-white rating label with the letters EC for Early Childhood — Figure 2 – The ESRB “Early Childhood” rating label used from 1998. Today, games for young children receive the E (Everyone) rating. Image: Entertainment Software Rating Board (ESRB), CC BY-SA 4.0, via Wikimedia Commons.

This short official video explains how the PEGI system labels games in Europe:

Intellectual property violations

Intellectual property (IP) is creative work protected by law: copyright (art, music, code, stories), trademarks (names and logos), patents (inventions) and trade secrets. Common IP violations in games and animation include:

Piracy: copying or distributing games or films without paying or permission.
Asset theft: using someone else’s art, music, fonts or models without a licence.
Cloning and trade-dress copying: copying another game’s look, name and code so closely that players are misled.
Trademark misuse: using famous characters or brand names in your game without permission.
Cultural appropriation of protected works: using a specific traditional design or recording that belongs to a community or artist without permission.

Protect yourself by making original work, keeping your sketches and files as evidence, and using assets with clear licences such as Creative Commons (always follow the attribution terms – as we do at the end of every post on this site).

Roles and responsibilities of monitoring agencies

Agency type	Examples	Responsibilities
Rating boards	ESRB, PEGI, IARC, CERO (Japan)	Review game content, assign age ratings and descriptors, enforce advertising rules.
IP offices	WIPO (worldwide), national IP offices such as the Intellectual Property Office of Trinidad and Tobago	Register trademarks and patents, educate creators, support copyright law.
Collecting societies	Music rights organisations such as COTT (Trinidad and Tobago)	License music and collect royalties for creators.
Law enforcement and customs	Police, customs and border agencies	Seize pirated goods and prosecute large-scale infringement.
Platform holders	App stores and console makers	Require ratings, remove infringing or harmful games, protect children’s privacy.

Example

A team is making Guardians of the Forest, a game in which the player helps Papa Bois protect animals from illegal hunters. Culturally, they interview a local storyteller and a folk troupe, use a steelpan-inspired soundtrack they commission themselves, and set the game in a Northern Range-style rainforest. For the rating, they keep conflict non-violent (hunters are scared away with traps and animal calls) and aim for an E rating. For IP, they draw all characters themselves, use only CC0 sound effects and keep a licence list. They register the game’s name as a trademark before launch.

Exercise

Choose a folklore character from your own country or region. Describe a game role for it that is culturally and geographically appropriate, and one way it could be misused.
Look up the rating of three games you know. Record the rating, the content descriptors and whether you agree with the rating.
Explain the difference between copyright and trademark, giving one game-related example of each.
Name two monitoring agencies and describe the responsibilities of each in protecting players or creators.

Next: Game Design Terms, Careers and the Types of Design in Games (World, System, Content, Level, UI)

Attributions to media used in this post:

Anansi-34.png – Pamela Colman Smith – Public domain (via Wikimedia Commons)

ESRB 1998 Early Childhood (small).png – Entertainment Software Rating Board (ESRB) – CC BY-SA 4.0 (via Wikimedia Commons)

How to Pitch an Interactive Game and Design for Your Target Audience (Demographics)

September 26, 2026 Aven BrisailLeave a comment

A game pitch is a short, persuasive presentation of an idea for a game, given to people who could approve, fund, publish or join it. A good pitch shows who the game is for, which means understanding demographics: facts about a group of people such as their age group, location, language, interests and the devices they use. The group you design for is your target audience. Using critical thinking to match the design to that audience’s needs is how designers solve interactive design problems.

Unit 1 covered pitch documents and funding in How to Pitch and Fund an Animation or Game Project and short pitches in Synopsis and Elevator Pitch for Games and Animation. This lesson focuses on presenting an interactive idea and on designing for real players.

Understanding your target audience

Target audience

Your target audience is the specific group of people most likely to play and enjoy your game. “Everyone” is not a target audience. A clearer statement is: “Casual puzzle fans aged 25–45 who play in short breaks on their phones.” Designers often describe the audience with personas – imaginary but realistic players with a name, age, habits, goals and frustrations.

Age group

Age affects almost every design choice:

Age group	Typical needs	Design implications
Young children (3–7)	Still learning to read; developing motor skills.	Big buttons, voice instructions, no text-heavy menus, no failure punishments, no in-app purchases or chat.
Older children (8–12)	Enjoy challenge and collecting; growing independence.	Clear goals, rewards, safe social features, content suitable for ratings such as E or E10+.
Teenagers (13–17)	Competition, identity, social play.	Customisation, multiplayer, deeper systems; strong safety and moderation tools.
Adults	Limited time; wide range of tastes.	Save anywhere, short sessions or deep campaigns, adjustable difficulty.
Older adults	May prefer slower pace; possible vision or hearing changes.	Larger text, high contrast, relaxed timing, familiar themes.

Location

Where players live affects language, cultural references, internet speed, the devices they own and how they pay. A game for a region with expensive mobile data should work offline and download quickly. A game for the Caribbean might use local music, dialect and settings that players recognise, while a game for a worldwide audience needs translation (localisation) and culturally neutral symbols.

Solving design problems with critical thinking

Critical thinking means questioning assumptions and choosing solutions based on evidence. A useful cycle is:

Define the problem from the player’s point of view (“Seven-year-olds cannot read the level instructions”).
Research the audience: observe, survey or interview real players.
Generate options (voice-over, picture instructions, a playable tutorial).
Evaluate each option against the audience’s needs, the budget and time.
Prototype and test the best option; measure whether the problem is solved.

This short Young BAFTA video explains why game designers must think about their audience from the very start:

Presenting an idea for an interactive game

A strong interactive game pitch usually covers these points in 5–10 minutes:

Hook and title: one sentence that makes people curious.
High concept: genre, platform and the core idea (“a cooperative cooking puzzle game for phones”).
Target audience: age group, location and persona; why they will love it.
Core gameplay loop: what the player does again and again, and why it is fun. Show a storyboard, wireframe or short prototype – interaction is easier to show than to describe.
Unique selling point: what makes it different from similar games.
Look and sound: concept art, colour palette, mood music.
Scope and team: what you can realistically build, how long it will take and who will do what.
The ask: what you want from the audience (approval, feedback, funding, team members).

Communication skills for pitching

Speak clearly, make eye contact and rehearse until you can pitch without reading.
Use visuals: a few strong images beat slides full of text.
Tell a short story about a player enjoying the game.
Invite questions and answer honestly; if you do not know, say how you will find out.
Keep to time – it shows you respect your audience and can manage a project.

Example

Here is a short pitch outline for Market Day Math:

Hook: “Can you run the busiest fruit stall in the market before the rain comes?”
Audience: children aged 8–11 in the Caribbean, playing on shared family phones or school tablets, often with limited data.
Design decisions from the audience: works offline; small download; spoken instructions; local fruits and currency; no ads or purchases.
Core loop: serve customers, add up prices, give change, earn coins to upgrade the stall.
Unique point: real mental-maths practice disguised as a busy, funny shop game.
Ask: “We would like your school to trial the prototype with two classes.”

Exercise

Write a persona for the target audience of a game idea: name, age group, location, device, play habits, goals and one frustration.
Describe three design decisions you would change if the same game were made for (a) five-year-olds and (b) adults.
Identify one interactive design problem in a game or app you use, and solve it using the five-step critical thinking cycle.
Prepare and deliver a three-minute pitch for your game idea using the eight-point structure. Ask your audience for feedback on clarity and confidence.

Next: Culture, Game Ratings, Intellectual Property and Monitoring Agencies in Game Design

Syllabus link: This post is relevant to the CAPE® Animation and Game Design Syllabus, Unit 2: Interactive Design and Game Development, Module 1: Introduction to Interactive Design – Specific Objective 14 (“present an idea for an interactive game”); Specific Objective 15 (“apply critical thinking to solve interactive design problems to meet customers’ needs”).

Attributions to media used in this post:

Stickies to brainstorm Edit.2014..jpg – Victor Grigas – CC BY-SA 3.0 (via Wikimedia Commons)

Global Game Jam 2019 à Arles.jpg – Yannickvernet – CC BY-SA 4.0 (via Wikimedia Commons)

Colour Theory for Game Design and Animation: Meaning, Harmony, Contrast and Colour-Blind Accessibility

September 26, 2026 Aven BrisailLeave a comment

Colour theory is the set of ideas that explains how colours are made, how they relate to each other and how they affect the way people feel and behave. It covers the colour wheel, colour harmony (combinations that look good together), contrast, and the meaning or psychology of colour. In animation and game design, colour theory is a tool for guiding attention, setting mood, telling story and giving players information.

The basics – primary, secondary and tertiary colours, warm and cool colours, hue, saturation and value – were introduced in Colour Theory, Texture, Composition and Layout. This post focuses on why colour theory matters in animated and interactive work, and on designing colour that every player can read.

Quick review: colour harmonies

Complementary: colours opposite on the wheel (blue and orange). Maximum contrast – great for making a hero or a pickup stand out.
Analogous: neighbours on the wheel (yellow, yellow-orange, orange). Calm and unified – great for backgrounds and moods.
Triadic: three evenly spaced colours (red, yellow, blue). Lively and balanced, common in children’s games.
Monochromatic: one hue in different values and saturations. Stylish and moody, useful for flashbacks or menus.

Why colour theory is important in animation and game design

1. It guides the eye

Players must spot what matters in a fraction of a second. Designers give important objects higher saturation, brighter value or a complementary colour against a muted background. Many games paint climbable ledges or interactive objects in one consistent colour so players find the path without a tutorial.

2. It sets mood and tells story

Animators plan a colour script: a strip of small paintings that shows how the colour of a film changes scene by scene. Warm golden light can signal safety and happiness; cold blues can suggest loneliness or mystery; a sudden shift to red can announce danger. Games do the same between levels, or between day and night.

3. It communicates information

Colour is part of the game’s language: green health bars, red damage numbers, gold for rare rewards, team colours in multiplayer. Once these rules are set, they must stay consistent – or players will make mistakes.

4. It builds identity and brand

A strong palette makes a game or animated series recognisable from a single screenshot. Think of a series you know well: you can probably name its main colours.

5. It links to culture

Colours carry different meanings in different places. White is linked to weddings in many Western countries but to mourning in parts of Asia; red can mean luck and celebration in Chinese culture. Designers creating for a worldwide audience research these meanings (we look at culture more closely later in this module).

6. It affects accessibility

About 1 in 12 men and 1 in 200 women have some form of colour vision deficiency (colour blindness), most often difficulty telling red from green. If a game uses only red versus green to show enemies versus friends, many players cannot play fairly.

Two photos of red and green apples, the second showing both apples in similar yellowish tones — Figure 3 – Red and green apples, and a simulation of how the same apples may look to someone with red–green colour blindness. Image: Limbicsystem at English Wikipedia, CC BY 2.5, via Wikimedia Commons.

Designing colour for everyone

Never use colour as the only signal: add shapes, icons, patterns or text (for example a skull icon on enemies, a tick for correct answers).
Check value contrast: turn your screenshot greyscale. If important things disappear, increase the difference in lightness.
Offer a colour-blind mode or custom colour settings where possible.
Test with free colour-blindness simulators before release.

This video from Tiny Shiny Things shows how an indie developer uses colour theory (and shape language) to make a game readable and appealing:

Example

A small team is making a cartoon game about a reef clean-up. Their colour plan looks like this:

Part of the game	Colour choice	Reason
Healthy reef levels	Analogous blues, teals and soft greens	Calm, natural and unified.
Player’s diver	Bright orange suit	Complementary to the blue water, so the player is always visible.
Rubbish to collect	Saturated yellow with a white outline and a sparkle icon	High contrast plus a shape cue that works for colour-blind players.
Polluted areas	Desaturated brown-grey	Shows the damage visually; colour returns as the player cleans up.
UI panels	Dark navy with white text	Strong value contrast for readability.

The colour itself becomes a reward: as the player cleans each area, the reef “re-colours”, turning a game mechanic into a visible story.

Exercise

Define colour theory in one or two sentences, then list four reasons why it is important in animation and game design.
Choose a game or animated film. Describe its palette and explain how the colours support the mood or story.
Create a colour plan (like the table above) for a game idea of your own. Include at least one complementary pair.
Take a screenshot of a game and convert it to greyscale. Is the important information still clear? Suggest two changes that would improve accessibility.

Next: Story Arcs, Game Scripts and Storyboards for Interactive Games

Syllabus link: This post is relevant to the CAPE® Animation and Game Design Syllabus, Unit 2: Interactive Design and Game Development, Module 1: Introduction to Interactive Design – Specific Objective 16 (“define Colour Theory”); Specific Objective 17 (“outline the importance of Colour Theory in animation and game design”).

Attributions to media used in this post:

Simple RYB Color Wheel without Title.png – Revulo.Studio – CC0 (via Wikimedia Commons)

Color schemes when viewed by color-blind people.jpg – Krit-tonkla – CC BY-SA 4.0 (via Wikimedia Commons)

Braeburn GrannySmith dichromat sim.jpg – Limbicsystem at English Wikipedia – CC BY 2.5 (via Wikimedia Commons)

Story Arcs, Game Scripts and Storyboards for Interactive Games

September 26, 2026September 26, 2026 Aven BrisailLeave a comment

A story arc is the shape a story follows from beginning to end: it starts with a setup, builds tension through rising action, peaks at a climax and settles into a resolution. A game script is the written document that holds a game’s dialogue, scene descriptions and, unlike a film script, the choices and conditions that change what happens. A storyboard is a sequence of drawings that shows how scenes, shots or gameplay moments will look before they are built.

This lesson builds on three Unit 1 posts: Story Arcs: Five-Point, Eight-Point and Three-Act Structure, Story Development and Scriptwriting for Animation and Games and Storyboarding, Camera Angles and Shots. If you have not read them, start there. Here we focus on what changes when the audience is also a player.

Steps in creating a story arc

Step	What happens	In a game
1. Exposition / setup	Introduce the world, the hero and what they want.	An opening scene or first level that teaches movement while showing the world.
2. Catalyst (inciting incident)	Something disrupts normal life and starts the adventure.	The village is flooded, a friend is captured, a strange signal appears.
3. Rising action	Challenges grow; the hero gains skills, allies and obstacles.	New levels, new abilities and tougher enemies or puzzles.
4. Turning points	Major surprises or decisions that change direction.	A plot twist, a boss that reveals a secret, or a player choice that opens a new path.
5. Climax	The greatest challenge and highest tension.	The final boss, the hardest puzzle or the key decision.
6. Resolution	Loose ends are tied up and we see the new normal.	Ending cut-scene, credits, and often a post-game world to explore.

Circular diagram of the Hero’s Journey showing a call to adventure, threshold, trials and return — Figure 1 – The Hero’s Journey, a circular story pattern described by Joseph Campbell: the hero leaves the known world, faces trials in the unknown, and returns changed. Many games follow this shape. Image: Unknown author; vectorised by Slashme, Public domain, via Wikimedia Commons.

Arcs in interactive stories

In a film, the writer controls the pace. In a game, the player does. That is why game writers pair the story arc with a difficulty or intensity curve: tension rises through gameplay, with calm moments (a safe town, a cut-scene) between intense ones. Games with choices may have several arcs that share a beginning and a climax but take different routes, or even end differently.

The Extra Credits video below shows how the game Journey builds a moving story arc almost entirely through play, music and landscape, with no dialogue at all:

Writing scripts for games

Game scripts contain the same things as film scripts – scene headings, action and dialogue – but they also need:

Branches: different lines depending on the player’s choice (“If the player chose to help the fisherman…”).
Conditions and variables: notes such as “only if the player has the lantern” or “if trust ≥ 3”.
Barks: short lines characters say during play (“Over here!”, “I need more wood!”), often written in lists with several versions so they do not repeat.
Tutorial and UI text: button prompts, hints and item descriptions – these are writing too.
Voice direction: notes for actors about emotion and volume.

Writers often use a spreadsheet for dialogue, or special tools. Celtx handles screenplays and storyboards; Twine is a free tool for writing branching, choice-based stories; engines have dialogue plug-ins such as Ink or Yarn Spinner.

Sample game script format

SCENE 3 – HARBOUR AT DUSK
Rain begins. Boats knock against the pier.

MARISOL (worried): The storm is early. Grandpa’s boat is still out.

PLAYER CHOICE:
  [A] "I’ll take the lighthouse path."   -> SCENE 4A (sets courage +1)
  [B] "Let’s ask the harbour master."   -> SCENE 4B (sets trust +1)

IF player has LANTERN:
  MARISOL: Good – light it at the top. He’ll see it.
ELSE:
  MARISOL: We need light. Check Mr. Joseph’s shop.

BARKS (Marisol, while following): "Careful, it’s slippery!" / "Hurry!" / "I can see the light!"

Storyboarding for games

Game storyboards are used for cut-scenes (like film storyboards) and for gameplay sequences, where each panel shows what the player sees and does. Gameplay boards often include arrows for player movement, notes on the controls being used and small drawings of the HUD. Keep each panel simple: a clear drawing, a camera note (wide shot, close-up, over-the-shoulder) and a caption of the action or dialogue.

Example

A student plans a short game, Lantern Night, about a girl guiding her grandfather’s boat home during a storm.

Setup: a calm harbour; the player learns to walk and talk to villagers.
Catalyst: the storm arrives early and Grandpa’s boat is missing.
Rising action: the player finds a lantern, crosses a slippery cliff path and fixes the lighthouse gears.
Turning point: the lighthouse bulb is broken; the player must choose to use the lantern as the light.
Climax: in a timed sequence, the player keeps the flame alive against wind gusts while the boat approaches.
Resolution: the boat reaches the pier; villagers celebrate, and the lighthouse becomes the game’s save point.

She writes the script scene by scene (like the sample above) and draws a nine-panel storyboard of the climax: panel 1 wide shot of the storm, panel 2 close-up of the flame flickering, panel 3 the player pressing a button to shield it, and so on.

Exercise

List the six steps of a story arc and describe each one for a game you have played.
Write a one-page game script for a scene with at least one player choice, one condition and three barks.
Draw a six- to nine-panel storyboard for either a cut-scene or a short gameplay sequence from your script. Add camera and control notes under each panel.
Try Twine (free at twinery.org) and turn your script into a playable branching story with at least two endings.

Next: How to Pitch an Interactive Game and Design for Your Target Audience (Demographics)

Syllabus link: This post is relevant to the CAPE® Animation and Game Design Syllabus, Unit 2: Interactive Design and Game Development, Module 1: Introduction to Interactive Design – Specific Objective 11 (“identify the steps involved in creating a story arc”); Specific Objective 12 (“employ the knowledge of writing scripts for games”); Specific Objective 13 (“create a storyboard”).

Attributions to media used in this post:

Heroesjourney.svg – Unknown author; vectorised by Slashme – Public domain (via Wikimedia Commons)

Twine 2.9.2 screenshot.png – AlexRosenthal – CC0 (via Wikimedia Commons)

Storyboard for The Radio Adventures of Dr. Floyd.jpg – Tom Ray (tmray02 on Flickr) – CC BY-SA 2.0 (via Wikimedia Commons)

Elements and Principles of Visual Design for Games and Interfaces (With Gestalt Examples)

September 26, 2026 Aven BrisailLeave a comment

Visual design is the practice of arranging images, text, colour and space so that a screen is both attractive and easy to understand. It uses elements of visual design – the basic building blocks such as line, shape, direction, size, texture, colour and value – and principles of visual design – the rules for combining them, such as unity, Gestalt, space, balance, hierarchy, contrast, scale, dominance and similarity.

In Unit 1 we used many of these ideas for artwork in Colour Theory, Texture, Composition and Layout. Here we apply them to interactive screens: menus, HUDs, icons and game worlds that players must read quickly while they play.

The seven elements of visual design

Element	What it is	How games use it
Line	A mark joining two points; can be straight, curved, thick or thin.	Borders around panels, paths leading the eye to a door, speed lines.
Shape	A closed area: geometric (squares, circles) or organic (natural, irregular).	Round shapes feel friendly (coins, hearts); sharp shapes signal danger (spikes).
Direction	The way a line or shape appears to point or move.	Arrows and diagonal compositions suggest where to go next.
Size	How big or small something is.	Big buttons for important actions; large enemies feel powerful.
Texture	How a surface looks or feels (rough, smooth, shiny).	Wood grain on a menu panel, rough rock that tells you a wall is climbable.
Colour	Hue, saturation and brightness.	Team colours, red for damage, gold for rewards (see the next post).
Value	How light or dark a colour is.	Bright important objects stand out from darker backgrounds.

The principles of visual design

Unity

Unity means all parts of a design look like they belong together: the same fonts, icon style, colour palette and corner shapes. A cartoon game with one realistic, photographic button breaks unity.

Gestalt

Gestalt (German for “whole form”) describes how our brains group separate parts into a whole. Key Gestalt principles are proximity (things close together belong together), similarity (things that look alike are related), closure (we complete missing parts of a shape), continuity (we follow smooth lines and curves) and figure–ground (we separate an object from its background).

Black shapes and partial circles arranged so that the viewer perceives complete triangles and 3D forms — Figure 1 – Gestalt reification: our brains “see” complete shapes – a triangle, a sphere and other forms – even though only parts are drawn. Image: Slehar at English Wikipedia, Public domain, via Wikimedia Commons.

Animated illusion in which three black pac-man shapes and angles create an imaginary white triangle — Figure 2 – An animated Kanizsa triangle. As the parts move, your brain keeps seeing a white triangle that is not actually drawn – a powerful example of closure. Image: Sergejpinka, CC BY-SA 2.5, via Wikimedia Commons.

Space

Space (or white space / negative space) is the empty area around and between elements. Space gives the eye room to rest and makes grouped items clearer. Crowded HUDs are hard to read in the middle of the action.

Balance

Balance is the distribution of visual weight. Symmetrical balance (mirror image) feels calm and formal, which suits title screens. Asymmetrical balance (different items with equal weight) feels dynamic and modern.

Hierarchy

Hierarchy shows the order of importance. The player should notice the most important thing first (for example “Play”), the second most important next, and so on. Size, colour, value and position all create hierarchy.

Contrast

Contrast is the difference between elements – light and dark, big and small, warm and cool. High contrast makes text readable and makes collectables pop out of the background. Accessibility guidelines recommend strong contrast between text and its background.

Scale

Scale is the size of objects compared with each other and with the player. A tiny hero next to a huge castle creates a sense of adventure; giant text creates drama.

Dominance

Dominance is when one element clearly takes the lead as the focal point. Every screen should have one dominant element. If everything shouts for attention, nothing is noticed.

Similarity

Similarity means elements that share colour, shape or size are seen as a group. In games, all collectable items might share a glow, and all enemies might share a red outline, so players learn the rules at a glance.

The Nielsen Norman Group explains how Gestalt principles help people make sense of interfaces in this short video:

Example

Consider a level-select screen that shows 12 levels. A designer applies the principles like this:

Proximity and similarity: the 12 level buttons are the same round shape and sit together in a grid, so players understand they are all levels.
Contrast and value: unlocked levels are bright; locked levels are dark grey with a padlock.
Dominance and hierarchy: the next level to play is larger and gently pulses, so it is the first thing players see.
Space: there is plenty of room between the grid and the “Back” button, so no one taps the wrong thing.
Unity: the buttons use the same wooden texture and font as the rest of the game.

Exercise

Take a screenshot (or sketch) of a game menu. Label at least five of the seven elements of visual design on it.
Find examples of proximity, similarity and closure in a game, an app or a logo. Explain how each helps the viewer.
Redesign a cluttered screen: list what you would remove, group, enlarge or recolour, and name the principle behind each change.
Create a simple title screen wireframe that uses symmetrical balance, then a second version that uses asymmetrical balance. Which suits your game better, and why?

Next: Colour Theory for Game Design and Animation: Meaning, Harmony, Contrast and Colour-Blind Accessibility

Syllabus link: This post is relevant to the CAPE® Animation and Game Design Syllabus, Unit 2: Interactive Design and Game Development, Module 1: Introduction to Interactive Design – Specific Objective 9 (“identify the basic elements of visual design”); Specific Objective 10 (“outline the principles for creating a visual design”).

Attributions to media used in this post:

Reification.jpg – Slehar at English Wikipedia – Public domain (via Wikimedia Commons)

KaniszaTriangle move.gif – Sergejpinka – CC BY-SA 2.5 (via Wikimedia Commons)

How to Wireframe a Game User Interface: Best Practices for Designing Interactions

September 26, 2026 Aven BrisailLeave a comment

A wireframe is a simple, black-and-white sketch of a screen that shows where things go and how they work, without colours, final art or detailed graphics. In game design, wireframes are used to plan the user interface (UI): the title screen, menus, the heads-up display (HUD), pop-ups and the game-over screen. Best practices for designing interactions are the proven habits and questions designers use so that those screens are clear, fast and comfortable to use.

Wireframing comes after you understand your players and the principles from User Experience (UX) Factors and the Five Key Principles of Interaction Design. It comes before you spend hours on pixel art or code, because moving a box on paper takes seconds and moving finished artwork takes days.

Questions to consider when designing for interaction

Before you draw a single box, work through these questions (adapted from the U.S. government’s usability.gov guide to interaction design). Each one is a best practice in disguise.

Question	Best practice it leads to
What can a user do with a mouse, finger, controller or keyboard to interact with this screen?	Design for the real input device: big touch targets on phones, full controller navigation on consoles.
What about the appearance of an element gives the user a clue about what it does?	Use clear affordances and signifiers: buttons look pressable, selected items are highlighted.
Do error messages tell the user how to fix the problem and why it happened?	Prevent errors where possible and give helpful, friendly recovery messages.
What feedback does the user get after an action?	Give immediate feedback with sound, animation or a change on screen.
Are elements of a reasonable size and easy to reach?	Respect ergonomics: place frequent actions where thumbs and fingers naturally rest.
Are familiar or standard formats used?	Follow conventions (pause in the top corner, settings behind a gear icon) so nothing must be relearned.
What information helps the user before they act?	Show previews, tooltips and clear labels so actions are predictable.
How long does it take between an action and a response?	Keep response times short; show a loading indicator when you cannot.

More best practices for game interfaces

Keep it simple. Show only what the player needs right now; hide advanced options in sub-menus.
Create a clear hierarchy. The most important information (health, timer, objective) should be the biggest or brightest.
Recognition over recall. Show icons and choices instead of expecting players to remember codes or button combinations.
Stay consistent. The same button should do the same job on every screen.
Keep the play area clear. HUD elements usually sit at the edges and corners so they do not cover the action.
Design for everyone. Allow remapped controls, readable text sizes, subtitles and colour-blind friendly signals.
Test early. Show your wireframes to players and watch where they hesitate.

Levels of fidelity

Fidelity means how close a design is to the finished product. A low-fidelity wireframe is a quick pencil sketch; a mid-fidelity wireframe is a neat digital layout with grey boxes and real labels; a high-fidelity mock-up adds colour, fonts and art; and an interactive prototype lets people click between screens. Start low and increase fidelity only when the layout works.

Grey and white digital wireframe of a web page with navigation, lists and content boxes — Figure 2 – A digital mid-fidelity wireframe: grey boxes, simple lines and real labels show structure and navigation without final artwork. Image: Dereckson, CC BY 3.0, via Wikimedia Commons.

How to wireframe a game UI step by step

List the screens. For a small game: title screen, main menu, level select, gameplay HUD, pause menu, settings, win screen and game-over screen.
Draw a screen-flow diagram. Use arrows to show how the player moves between screens (for example, Title → Main Menu → Level Select → Gameplay → Pause → Main Menu).
Decide what each screen must show. Write a short list of every element and action before drawing.
Sketch several layouts quickly. Draw three or four thumbnail versions of each important screen; choose the clearest one.
Draw the chosen layout neatly. Use boxes with an X for images, lines for text, and label every button. Add notes and arrows to explain interactions (“tap to jump”, “flashes red below 20% health”).
Check it against the principles. Is it consistent, perceivable, learnable and predictable? Does every action give feedback?
Test and revise. Ask someone to “play” the paper screens while you swap pages when they tap. Note where they get stuck.

Useful tools include paper and pencil, free online tools such as Figma, Penpot or draw.io, and dedicated wireframing programs such as Balsamiq. Even PowerPoint or Google Slides can link screens together into a clickable prototype.

This CareerFoundry tutorial walks through a first wireframe from start to finish. It uses an app as the example, but every step applies to game screens too:

Example

Here is a low-fidelity wireframe of the gameplay HUD for a side-scrolling game about collecting seeds to replant a forest. Notes explain each element and the reasons behind its position.

+------------------------------------------------------------+
| [♥ ♥ ♥]  Lives        SEEDS: 12/30           [II] Pause   |
|                                                            |
|                                                            |
|                (play area kept clear)                      |
|                                                            |
|      player                                                |
|  ___[P]_____________     ______      _____________        |
|                                                            |
| [ ← ] [ → ]                                  ( JUMP )      |
+------------------------------------------------------------+
Notes:
- Lives top-left: most important status; hearts flash when one is lost.
- Seed counter top-centre: shows progress towards the level goal.
- Pause top-right: standard position; large 48 px touch target.
- Touch buttons in the bottom corners, where thumbs rest.
- Nothing sits in the middle of the screen, so the action is never hidden.

Exercise

List every screen a simple mobile game of your choice would need, and draw a screen-flow diagram connecting them.
Sketch three different low-fidelity layouts for the gameplay HUD. Choose one and explain your choice using at least three best practices from this post.
Draw a neat wireframe of the pause menu and the settings screen, with notes describing each interaction and its feedback.
Test your paper prototype with a classmate or family member. Record two problems you noticed and how you would fix them.

Next: Elements and Principles of Visual Design for Games and Interfaces (With Gestalt Examples)

Syllabus link: This post is relevant to the CAPE® Animation and Game Design Syllabus, Unit 2: Interactive Design and Game Development, Module 1: Introduction to Interactive Design – Specific Objective 7 (“outline some prominent best practices for designing interactions”); Specific Objective 8 (“employ design principles and best practices to create a wireframe of the user interface (UI) of a game”).

Attributions to media used in this post:

Spokes America Planning a Website 2.png – Nathan Kit Kennedy – CC0 (via Wikimedia Commons)

Wolfplex-Wiki-WorkshopsIdeaList-wireframe-20130929-v02.png – Dereckson – CC BY 3.0 (via Wikimedia Commons)