aesthetic design - Nicky-Nice-Games/ggk-UnityProject GitHub Wiki
Aesthetic Design Contents
Aesthetic Design
Theming
Our game is a whimsical, RIT-themed racing experience focused on the IGM department. Drawing visual inspiration from Mario Kart 64, the game leans into a nostalgic, low-poly aesthetic with exaggerated, cartoonish characters environments. Each racer represents a quirky archetype of an IGM student- nerdy tech wizards, tired artists, wired academic weapons– brought to life with bold colors and playful tracks. Tracks are set across imaginative renditions of RIT landmarks like the Global Village, the SHED, the Quarter Mile, and even a freshman dorm, all stylized in a low poly 3D look. The tone is light-hearted and chaotic, celebrating the creativity, diversity, and caffeine-fueled chaos surrounding IGM student life.
Narrative
Gizmo, the spirit of IGM, has set up multiple game-style race tracks throughout the RIT campus! Joined by multiple students who have stayed local during the summer and the RGDC mascot Jamster, Gizmo seeks to have a fun time before the summer term comes to an end. But don't worry; he will restore the campus back to it's original state to welcome in students for their fall classes.
Look and Feel
The game captures a playful, nostalgic atmosphere through a low-poly visual style. Environments and characters are rendered in chunky, low-poly 3D models reminiscent of earlier Mario Kart titles with vibrant textures and angular proportions. The color palette is bold and saturated, with strong contrasts to emphasize gameplay elements and track hazards.
Aesthetic Moodboard
Color Palette
Color Palette Design Thinking
The primary (or “condensed”) color palette consists mostly of warm colors to match RIT’s overall branding and to contrast with many other kart racing games that rely on blue or cyan. Yellow and green are used as secondary or accent colors to be used sparingly. The main color palette is vibrant and saturated with most colors having a skewed hue (e.g. the base “green” leans a bit toward cyan, “blue” leans toward purple).
Color Palette Guidelines
Brightness variations of the main color palette for highlights and shading are allowed as long as the hue is kept consistent with the base color; this is up to the artist’s discretion. Skin tone colors are allowed to be used beyond skin tones as long as they do not blend into a character’s skin tone (i.e. coloring a character’s hair a similar color to their skin). Most UI elements and menus should use the condensed palette with red and orange being the main colors. UI should also use the greyscale palette as opposed to the neutral palette, which is reserved for the characters.
Color References and Hex Codes
Here are the names and hex codes for each color palette:
Condensed Palette
| Name | Hex |
|---|---|
| Maroon | 881A2E |
| Red | DC3F2B |
| Orange | F77128 |
| Yellow | EAF03A |
| Green | 1FDB6A |
Note: the condensed palette is merely a subset of the main palette, so colors of the same name (e.g. "Maroon") have the same hex code regardless of the palette.
Main Palette
| Name | Hex |
|---|---|
| Maroon | 881A2E |
| Red | DC3F2B |
| Orange | F77128 |
| Marigold | FFBA2F |
| Yellow | EAF03A |
| Chartreuse | B2F300 |
| Green | 1FDB6A |
| Cyan | 21E7E7 |
| Cerulean | 17A6D5 |
| Blue | 0077D1 |
| Indigo | 393492 |
| Purple | 8338B1 |
| Magenta | E23686 |
Neutral Palette
| Name | Hex |
|---|---|
| Ivory | FFFBEE |
| Slate | 93959D |
| Midnight | 19121F |
| Beige | DDAE6D |
| Brown | 926C46 |
Greyscale Palette
| Name | Hex |
|---|---|
| White | FFFFFF |
| Light Grey 1 | E6E6E6 |
| Light Grey 2 | CCCCCC |
| Grey | A3A3A3 |
| Dark Grey 1 | 737373 |
| Dark Grey 2 | 474747 |
| Black | 000000 |
Skin Tone Palette
| Name | Hex |
|---|---|
| Skin Tone 1 | F9DAC9 |
| Skin Tone 2 | F8C3A6 |
| Skin Tone 3 | E59E6F |
| Skin Tone 4 | AF6533 |
| Skin Tone 5 | 844C29 |
| Skin Tone 6 | 5D3421 |
| Skin Tone 7 | 3C1E14 |
Note: the skin tones are listed in order from lightest (top) to darkest (bottom).
UI Design
The UI is clean and similarly inspired by retro racing games with a greyscale checkerboard motif. The orange and red gradient on most menus adds a pop of color that draws the player's attention to the most important elements. With a few exceptions, the right half of a menu is for selecting or interacting and the left half is for previewing your selection. The exceptions are the lobby and settings menus that can't be cleanly divided into two sections; these menus omit the gradient stripe and center all the content below the title.
Typography
Our primary font is Racing Sans One, a rounded yet energetic font that's used on majority of the game's UI and buttons. Certain stylistic graphics may use the font Next Bravo, typically accompanied by a thick outline and solid dropshadow. Next Bravo is not as legible as Racing Sans One and should only be used in contexts where legibility is not a priority (i.e. "1st", "2nd", "3rd"). Although not used in the game, Poppins is an acceptable typeface for body text or fine print.
Menu Mockups
Audio
Audio Inspiration
As most kart games do, a lot of the inspiration comes from the Mario Kart series, as well as the general low poly vibe (early 3D, N64, PS2, etc.). With this, the sound is meant to sound a little crunchy, not quite at that crisp quality we have nowadays.
Audio Theming
As previously mentioned, there’s a general idea for things to be a little crunchy, with a bit of a lo-fi filter. The music will be a bit more on the synth/techy vibe, seeing as we are a tech school, but will still have some natural sounds to ground things a bit. It will generally follow the environment in which it is being played, at least in terms of general vibe and drive.
Audio References
Mario Kart 64 - Sound collection https://www.youtube.com/playlist?list=PLp_DT6KaWkXJxpV4EPvYpjTnro--kKjJq
Audio Content List
-
SFX:
- Menu Clicks:
- Directions (up/down/left/right)
- Scroll/Clicks
- Select/Back
- Kart:
- Bumping into obstacles (7 variations)
- Accelerating/Engine
- Drifting
- Item Pickup
- Boost
- Hit/Spin-Out
- Shield Whir
- Can Open
- Menu Clicks:
-
Music:
- Main Menu Theme
- Map Themes
- Race Results (Win and Lose)
-
Stingers:
- Map Intro
- Race Start Countdown
- Final Lap
- Race Complete
-
Voice Lines:
- For each character (Reese, Morgan, Emma, Kai, Jamster, Gizmo):
- Item used
- Lap made
- Racer passed
- Get hit
- Announcer Lines:
- Singleplayer
- Multiplayer
- Quick Race
- Grand Prix
- Time Trial
- Reese
- Morgan
- Emma
- Kai
- Jamster
- Gizmo
- Campus Circuit
- Dorm Room Derby
- Tech House Turnpike
- All-Nighter Expressway
- For each character (Reese, Morgan, Emma, Kai, Jamster, Gizmo):
Promotional
Logo
The Gizmo Go-Kartz logo is a wordmark in front of a waving checkered flag. The 'M' in Gizmo references the mascot's head shape in a different color to stant out against the other text. The "Go-Kartz" text is made of individual bricks as a nod to RIT's notable brick aesthetic.
Logo Moodboards
Note: the title "Ritchie Racers" was originally chosen before Gizmo was created.
Banner
The Gizmo Go-Kartz banner includes Gizmo, Emma, and Morgan racing on the All-Nighter Expressway track. The characters are framed with a series of bricks as yet another reference to RIT's infamous architecture.