Lead UI/UX designer
Echoes
Hand-drawn interfaces shaped by a fae world, with memories, botanical frames and readable visual feedback.
Echoes is an isometric action roguelite developed as a USC Advanced Game Project and showcased at the 2024 Game Expo. As Lead UI/UX Designer, I shaped the inventory, memories, menus, settings and journal around a shared hand-drawn visual language.
- Role
- Lead UI/UX designer
- Genre
- Action roguelite
- Focus
- UI hierarchy & feedback
- Visual language
- Hand-drawn / Fae
01 / MENUS
Character art sets the scene; actions stay easy to find
The title screen gives the character illustration room to establish the world, with Continue and New Game in a separate action column. The pause menu carries the same cream motifs into a compact set of in-game choices.
02 / INVENTORY
Memories receive the largest central frame
The inventory separates collected items at left, memories in the center and details at right. The larger central frame gives lasting progression more visual weight. In the wireframe, the selected object’s illustration and effect stay beside the grid; the final UI keeps that browsing structure within the fae-inspired frame.
03 / SETTINGS ITERATION
Move dense ornament away from labels and slider handles
The three settings stages are shown left to right in development order. The wireframe establishes row spacing. In the first visual draft, dense branches crowd the labels and slider controls. The final frame shifts ornament to the perimeter, opens the center and uses brighter handles to mark adjustable values.
04 / JOURNAL
The selection stays beside its illustration and description
Category tabs sit above the journal list. A warm local highlight marks the active row, while the illustration and description remain beside it so players can inspect an entry without losing their browsing position.
05 / MOTIFS & ICONS
Silhouettes communicate before the glow
Books and flames suggest memory and magic. Hand studies explore interaction, while restrained highlights emphasize each symbol’s defining feature and connect it to the cream interface frames.
