1. Levels
1.1. Visuals
1.1.1. Non-diegetic UI
1.1.1.1. ONLY FOR TUTORIAL
1.1.1.1.1. introduction to basic movement (movement keys and their functions)
1.1.1.1.2. introduction to basic actions (attack buttons and their functions)
1.1.1.1.3. introduction to the game's objectives
1.1.1.2. LEVELS AFTER TUTORIAL
1.1.1.2.1. LEVEL 2 to LEVEL X (level X is the level whereby all the mechanics have been explained and taught)
1.1.1.2.2. LEVELS AFTER LEVEL X
1.2. Usability
1.2.1. all instructions are to be well contrasted from all types of backgrounds
1.2.2. instructions are able to capture the attention of the player while not obstructing the gameplay
1.2.3. minimal font changes (2 or less)
1.3. Design
1.3.1. unique level layout
1.3.2. unique enemy placement
1.3.3. unique collectibles placement
1.3.4. unique obstacle placement
1.3.5. difficulty progressive, harder and harder as the levels continue
1.3.5.1. difficulty peaks at boss battle levels
1.3.6. placement balance
1.3.7. new mechanics are introduced
1.3.7.1. up until a certain level where every mechanic has been explained (eg. level 3)
1.3.8. level has a consistent theme throughout
1.4. Visuals
1.4.1. Game
1.4.1.1. Enemy
1.4.1.1.1. when character is far
1.4.1.1.2. when character gets closer
1.4.1.1.3. jumping animation
1.4.1.1.4. when attack by character hits
1.4.1.1.5. if Hp of enemy = 0
1.4.1.1.6. if enemy changes state
1.4.1.1.7. attack
1.4.1.1.8. Bosses
1.4.1.2. obstacles assets
1.4.1.3. background
1.4.1.3.1. layer 1 graphics
1.4.1.3.2. layer 2 graphics
1.4.1.4. gameplay level
1.4.1.4.1. ground graphics
1.4.1.4.2. platform graphics
1.5. Sound
1.5.1. BGM
1.5.2. enemy attack sound fx
1.5.3. enemy attack hit character sound fx
1.5.4. character collects collectibles sound fx
1.6. Functionality
1.6.1. background
1.6.1.1. layer 1 scrolling
1.6.1.2. layer 2 scrolling
1.6.2. gameplay level
1.6.2.1. ground scrolling
1.6.2.2. platform scrolling
1.6.3. enemy AI
1.6.3.1. movement present
1.6.3.2. attack present
1.6.3.3. action present
1.6.3.4. bosses/special enemies have varying movement/attack/action patterns than normal enemies
2. Intro Screen
2.1. Visuals
2.1.1. studio logo appears (5 sec)
2.1.2. skip studio animation
2.1.2.1. neutral state
2.1.2.2. mouse over state (highlighted)
2.1.3. game intro animation plays (cutscene) (15 sec)
2.1.4. skip game intro animation
2.1.4.1. neutral state
2.1.4.2. mouse over state (highlighted)
2.2. Usability
2.2.1. logo contrasts with background
2.3. Functionality
2.3.1. skip studio animation (b button/space shortcut)
2.3.2. skip game intro animation (b button/space shortcut)
3. Title Screen
3.1. Visuals
3.1.1. enter screen
3.1.1.1. transition animation
3.1.1.1.1. game logo appears
3.1.2. start game button appears`
3.1.2.1. neutral state
3.1.2.2. mouse over state (highlighted)
3.1.2.3. hit state
3.1.2.3.1. animation (blink)
3.1.3. options button
3.1.3.1. neutral state
3.1.3.2. mouse over state (highlighted)
3.1.3.3. hit state
3.1.3.3.1. animation (blink)
3.1.4. credits button
3.1.4.1. neutral state
3.1.4.2. mouse over state (highlighted)
3.1.4.3. hit state
3.1.4.3.1. animation (blink)
3.1.5. copyright statement visible on the bottom of page
3.1.6. background graphics/animation
3.1.7. exit screen
3.1.7.1. transition animation
3.1.8. If no buttons were pressed in 30 seconds in the title screen, repeat the sequence for the intro screen including the game intro animation/cutscene
3.2. Sound
3.2.1. BGM plays on loop
3.2.2. start game button pressed
3.2.2.1. hit sound fx
3.2.3. options button
3.2.3.1. moused over sound fx
3.2.3.2. hit sound fx
3.2.4. credits button
3.2.4.1. moused over sound fx
3.2.4.2. hit sound fx
3.3. Usability
3.3.1. buttons well indicated
3.3.2. logo positioned at centre
3.3.3. logo occupies 3/4 of the screen
3.3.4. logo contrasts background well
3.4. Functionality
3.4.1. start game button (can be cycled to select other buttons)
3.4.2. options button (can be cycled to select other buttons)
3.4.3. credits button (can be cycled to select other buttons)
4. Credit Screen
4.1. Visuals
4.1.1. enter screen
4.1.1.1. transition animation
4.1.2. names and roles display
4.1.2.1. rolls down animation
4.1.3. source credit display
4.1.4. back button
4.1.4.1. neautral state
4.1.4.2. mouse over state (highlighted)
4.1.4.3. hit state
4.1.4.3.1. animation
4.1.5. background graphics
4.1.6. exit screen
4.1.6.1. transition animation
4.2. Sound
4.2.1. BGM
4.2.2. back button
4.2.2.1. mouse over sound fx
4.2.2.2. hit sound fx
4.3. Usability
4.3.1. back button is clear and contrasts with background
4.3.2. back button at bottom-most right of screen
4.4. Functionality
4.4.1. back button (b button/space shortcut)
5. Gameplay Screen
5.1. Visuals
5.1.1. Non-diegetic UI
5.1.1.1. HP bar/icons
5.1.1.1.1. decrease feedback animation
5.1.1.1.2. increase feedback animtion
5.1.1.2. Mana/Skill bar/icons
5.1.1.2.1. decrease feedback animation
5.1.1.2.2. increase feedback animation
5.1.1.3. switch skill icons
5.1.1.4. score display
5.1.1.4.1. icon
5.1.1.5. money/currency display
5.1.1.5.1. icon
5.1.1.6. collectibles display
5.1.1.6.1. icon
5.1.1.6.2. obtain collectibles feedback
5.1.2. Spatial UI
5.1.2.1. character damage number display when damaged
5.1.2.1.1. animation
5.1.2.2. enemy damage number display when damaged
5.1.2.2.1. animation
5.1.2.3. character emotions icons
5.2. Usability
5.2.1. Hp/Mp Bars/switch skill/currency display and icons/collectibles display and icons/damage number contrast from all types of background
5.2.2. Hp and Mp bars are 1/5 the height of the screen (landscape)
5.2.3. Hp and Mp bars are 1/3 the width of the screen (landscape)
5.2.4. UI is on the left side of the screen in accordance to the rule of thirds
5.2.5. UI is within the order : Hp>Mp>Collectibles>Currency>Score
5.3. Functionality
5.3.1. Hp/Mp bar/icon will increase/decrease with gameplay (decrease when damaged for Hp and when using a skill for Mp, increase when using an item/power up/skill that recovers health)
5.3.2. skill icons can be switched/toggled (cycling through skills)
5.3.3. Score/Currency/Collectibles updates with gameplay
5.3.3.1. animation/display change
5.4. In-Game General
5.4.1. Design
5.4.1.1. Level layouts are different from each other (all level layouts unique)
5.4.1.2. Enemy placement different each level, according to layout
6. Pause Screen
6.1. Visuals
6.1.1. when pause button pressed
6.1.1.1. screen darkens
6.1.1.2. "PAUSED" caption
6.1.1.3. instructions to unpause visible
6.2. Usability
6.2.1. pause caption easily seen
6.2.2. instructions easily seen
6.2.3. pause caption is in the center of the screen (point of focus, rule of thirds)
6.2.4. pause caption occupies 1/6 of the screen
6.2.5. caption contrasts well with the background
6.3. Functionality
6.3.1. pause/unpause key
7. Game Over Screen
7.1. Visuals
7.1.1. when hp of character = zero or objective failed, game over
7.1.2. transition to screen animation
7.1.3. "GAME OVER" caption
7.1.4. restart
7.1.4.1. restart level button
7.1.4.1.1. neutral state
7.1.4.1.2. mouse over state (highlighted)
7.1.4.1.3. hit state
7.1.4.2. back to title button
7.1.4.2.1. neutral state
7.1.4.2.2. mouse over state (highlighted)
7.1.4.2.3. hit state
7.1.5. background graphics
7.1.6. exit screen transition animation
7.2. Sound
7.2.1. BGM (not looped)
7.2.2. restart level button
7.2.2.1. mouse over sound fx
7.2.2.2. hit sound fx
7.2.3. back to tile button
7.2.3.1. mouse over sound fx
7.2.3.2. hit sound fx
7.3. Usability
7.3.1. buttons can be clearly seen
7.3.2. game over caption is positioned at the center of the screen (point of focus, rule of thirds)
7.3.3. game over caption size occupies 2/5 of screen
7.3.4. caption contrasts well from the background
7.4. Functionality
7.4.1. restart level button
7.4.2. back to title button
8. Victory Screen
8.1. Visuals
8.1.1. transition to screen animation
8.1.2. "VICTORY" caption
8.1.3. next level button
8.1.3.1. neutral state
8.1.3.2. mouse over state (highlighted)
8.1.3.3. hit state
8.1.3.3.1. animation
8.1.4. background graphics
8.1.5. exit screen transition animation
8.1.6. score display
8.1.7. collectibles display and icon
8.2. Sound
8.2.1. BGM
8.2.2. next level button
8.2.2.1. mouse over fx
8.2.2.2. hit sound fx
8.3. Usability
8.3.1. buttons can be clearly seen
8.3.2. victory caption is positioned at the center of the screen (point of focus, rule of thirds)
8.3.3. victory caption size occupies 2/5 of the screen
8.3.4. caption contrasts well from the background
8.3.5. score display contrasts well from the background
8.3.6. collectibles display and icon contrasts well from the background
8.4. Functionality
8.4.1. restart level button
8.4.2. back to title button
9. DIEGETIC: Interface that is included in the game world -- i.e., it can be seen and heard by the game characters. Example: the holographic interface in Dead Space. NON-DIEGETIC: Interface that is rendered outside the game world, only visible and audible to the players in the real world. Example: most classic heads-up display (HUD) elements. SPATIAL: UI elements presented in the game's 3D space with or without being an entity of the actual game world (diegetic or non-diegetic). The character outlines in Left 4 Dead are an example of non-diegetic spatial UI. META: Representations can exist in the game world, but aren't necessarily visualized spatially for the player; these are meta representations. The most apparent example is effects rendered on the screen, such as blood spatter on the camera to indicate damage. SOURCE: GAMASUTRA GAME UI
10. Character
10.1. Visuals
10.1.1. Enter Stage
10.1.1.1. Animation
10.1.2. Idle
10.1.2.1. Idle neutral state (Blinking)
10.1.2.2. After 5 seconds of no movement
10.1.2.2.1. Idle Animation
10.1.3. Movement
10.1.3.1. walking (default movement) animation
10.1.3.2. pressing move button twice
10.1.3.2.1. slide/run animation (walk special fx feedback animation)
10.1.3.3. climbing ladder/rope animation
10.1.3.4. movement corresponds with the appropriate keys
10.1.4. Jump
10.1.4.1. animation
10.1.4.2. fall
10.1.4.2.1. animation
10.1.4.2.2. falling off platform animation
10.1.4.3. when attack button is pressed/held down while jumping
10.1.4.3.1. jump attack
10.1.5. Damaged
10.1.5.1. flinch animation
10.1.5.1.1. invincibility frames (3 sec)
10.1.5.2. health bar goes down
10.1.5.3. when health bar = 0
10.1.5.3.1. death
10.1.6. Status effect
10.1.6.1. if status effect = power up
10.1.6.1.1. power up animation (character model be changed into a "super version" for 5 seconds)
10.1.6.2. if status effect = detrimental (paralyze/poison/power down)
10.1.6.2.1. weaken animation (character model changed into a "weaker version" depending on the status for 5 seconds)
10.1.7. Attack
10.1.7.1. pressing attack button
10.1.7.1.1. attack animation
10.1.7.2. holding attack button
10.1.7.2.1. charge/constant attack animation (attack special fx feedback animation)
10.1.8. Collectibles
10.1.8.1. graphics
10.1.8.2. collectibles get "attracted" into character when character close enough
10.2. Usability
10.2.1. Character always centralized, exception during the beginning of the level
10.2.2. character positioned on the foreground (along lower line in rule of thirds)
10.2.3. Sufficient space on sides to see enemies/terrain/collectibles
10.3. Sound
10.3.1. BGM
10.3.2. character attack hits enemy sound fx
10.3.3. character collects collectibles sound fx
10.3.4. character hit by enemy sound fx
10.3.5. character heals sound fx
10.3.6. character gets status change sound fx
10.3.6.1. if status = good, positive/cheerful sound fx
10.3.6.2. if status = bad, negative/sad sound fx