Card-phase HUD for an adult summoning game
A whole card phase on one screen, and the art still keeps the stage.
- Role
- UX/UI designer, solo
- Product
- Adult card game · PC
- Scope
- Card-phase HUD, Dialogue screens
Results
- 5 × 5card categories × rarities, told apart by ribbon and badge on one card shape
- 1 screenfor the whole card phase: her state, both resources, the deck, the discard and a hand of up to six cards
An adult card game for PC: every night the player summons an entity from a grimoire and courts her with cards across five levels of relationship. I designed the interface around the illustrations: the card-phase HUD, where the whole game is played, and the dialogue screens. One screen holds the whole card phase without shrinking the character.
Introduction
A whole card phase on one HUD, around a character who has to stay the star.
One screen holds her state and passives, two resources, the hand, the deck, the discard, a way to break the summon and the mana reward, and every card carries eight facts of its own. The hard part was keeping all of it readable while the art keeps the stage.
Style
Sticker style won over gothic and comic.
I carried the look through three directions: an occult gothic, a classic comic and a sticker style. Bold lettering and stuck-on panels read as playful, which fits a flirty summoner game better than a dark RPG, and they sit lightly on the art instead of framing it.
Colour
Colour means a mechanic, never decoration.
Red and pink are her side: affinity and the hearts. Blue is you: initiative. Purple is magic, gold is value, green is the deck. The player tells theirs from hers before reading a single number; the price is a palette with no colour left for decoration.
Cards
One card shape: ribbon for category, badge for rarity.
Shape and size never change, so the hand reads as one row. A locked card stays in the hand, darkened under a lock and a band that says what it needs, so the player sees a goal instead of a gap. A legendary card does not shout, and six different cards stay scannable side by side.
Layout
The art leads: the HUD floats, dialogues shed chrome.
The character takes the most of the screen, and the interface floats in the corners and along the bottom. Break Ritual sits away from the hand, red and small, so it cannot be hit by accident. The speech bubble drops the panel, so a scene can show the whole illustration.
Outcome
Outcome
The whole card phase fits on one screen without shrinking the character: the interface holds the edges, and colour tells the player's side from hers before a number is read.
What I learned
- Colour is cheaper than labels: tying red to her and blue to you means the player never reads a legend, and it cost nothing but discipline.
- The hard part of a card HUD is not the cards but the edges: everything that is not illustration has to hold the frame without stepping into it.
- Three finished directions beat ten sketches. Choosing between things that already look real is a decision; choosing between sketches is a guess.
