UI

Learning

Intro to Design

Watch the video here

Notes

• Generate a handful (around five) key design words to keep in mind when designing a specific element
  • Creates a design language to adopt to an IP
  • Examples:
    • Streamlined: lines that pick up acceleration/speed
    • Retro: using lines/curves that are no longer used today
    • Whimsical: playful/toylike
    • Cool: prompts immediate "that's cool" reaction
    • Animalistic: life-like features, mean or cute features
    • Utility: for a specific tool or function
    • Sturdy: can handle some damage and continue functioning as normal
    • Beautifully ugly: bizarre but holistically good-looking
    • Powerful: strong, very capable of extreme function
    • Professional: would require training to learn how to use
• Preparing a design board
  • Construct a board of design influences where the reference images encompass one or more of the design words in your selected design language
  • References do not all have to be in direct reference to the object you are designing
    • Meant to invoke more of an aesthetic feel and provide elements of inspiration
• Sketches
  • Come up with as many rough variations as possible
    • Try to have as many different shapes as possible with larger variations, at least to start
    • Try different things! Have fun!
  • Be as straightforward as possible
    • No need to document many specific cases initially (i.e., different perspectives/angles)
  • Annotate the ones you really like! iterate off of those
  • Pick favorite designs to finalize

General Overview

The UI of Project Storm will fall into one of two categories which I'm tentatively naming Menu UI and Oppy UI.

• Menu UI consists of all of the buttons, text, images, and other interactable components that are found in menus excluded from the core gameplay loop. This consists of things like the start menu, a pause menu, narrative menus, win/loss screens, etc.
• Oppy UI consists of all of the buttons, text, images, and other interactable components that are found in gameplay when you are playing as Oppy. This UI will largely encompass what Oppy actually sees and how he interacts with his surroundings as the player is controlling him in all three acts of the game.

This document will illustrate both interfaces and their designs, one at a time.

Menu UI

Design Language

WIP.

Reference Boards

WIP.

Sketches

Not started yet.

Oppy UI

Design Language

WIP.

Reference Boards

WIP.

Sketches

Not started yet.

Component Library

Menu UI

Not started yet.

Oppy UI

Not started yet.