Sci-fi action adventure, full UI concept

Stellar Despair

A story-driven space adventure interface: three navigation systems, the front-end menu, the in-game hub and the bonus content section, sharing one frame across seven screens, from the save browser to the loadout grid and the mission log.

Role: Game UI/UX Designer
Year: 2025
Tools: Affinity Designer
Genre: Sci-Fi, Action Adventure
Platform: PC & console

As a lifelong Star Wars fan, I've always been drawn to the visual storytelling of a galaxy far, far away. For this project I set out to design a full UI/UX concept for a modern, story-driven action adventure game: Stellar Despair, a science-fantasy title about surviving the ruins of a world under Imperial occupation.

I challenged myself to strike a balance between staying true to that iconic aesthetic, gritty, tech-heavy and cinematic, and using clean, modern design techniques like minimalist layouts and bold, readable type. It had to feel like something new while staying instantly recognisable to fans.

The concept is built out far enough to be tested rather than only rendered. The menu resumes a save called St 13: The Awakening at fourteen hours played; the browser holds six slots with a personal log written from inside the fiction; the loadout carries a VX-7 Distributor with real numbers behind it; and the mission list runs a four-part arc from escaping the ruins to facing the Inquisitor. Laying it out with actual content rather than placeholder text is what exposes where a layout gives way, and several of these panels changed because of it.

Those seven screens cover three separate navigation systems: the front-end menu, the in-game hub a player opens mid-mission, and the bonus content section. Each holds a different set of destinations, and all three are built from the same frame.

Scope

Stellar Despair is a self-directed concept, so the design is mine end to end: every screen and wireframe, the layout and interaction design, the UI icon set, and the Stellar Despair logo and wordmark. The environment, character and mission artwork is reference imagery, used to present the interface in context rather than as original art.

The challenge

Three navigation systems had to feel like one game. The front-end menu, the in-game hub and the bonus content section each hold entirely different destinations, so the constant could not be the contents — it had to be the frame. A left rail carrying the current context, a content panel beside it, and an input legend along the bottom edge. Learn that shape once on the main menu and every other context is already familiar.

A gritty, tech-heavy aesthetic also works against legibility, so the palette is doing almost no decorative work. One cyan accent carries everything that matters — what is selected, what is interactive, what is currently in focus — which leaves red free to mean one thing only, and to mean it consistently: Quit on the menu, Delete on a save file.

Main menu

The front-end entry point, and the screen that sets the frame every other one inherits. Focus is carried by a hexagon-patterned frame that travels to whatever item is currently under the cursor, and it is the same component in all three rails, so the selection reads identically whether a player is in the front-end menu, the in-game hub or the bonus section. Continue keeps a secondary line under it with the chapter and playtime, the one item that reports state rather than just naming a destination. The labels read Load Journey and New Journey rather than Load Game and New Game, a small piece of writing doing the same work as the art: it tells you what kind of story you are in before you have started it. Quit takes the only warm colour in the system, which is what lets red mean destructive everywhere else without ever being explained.

Settings

Opening settings does not replace the menu, it opens beside it. The rail stays put and legible, so the player keeps their place in the hierarchy and can see exactly what pressing back returns them to. Eight video rows run from Resolution down to Texture Filtering with a scrollbar showing more below, and every one is built the same way: label left, value centre, arrows either side. That pattern was chosen because it behaves identically under a d-pad, a stick and arrow keys, so a single layout serves controller and keyboard instead of two schemes drifting apart. The input legend grows to include Close/Back at the moment that action becomes available.

Save management

Three columns: the menu, the list of saves, and the details of whichever one is highlighted. The rows are kept deliberately thin, carrying only slot, playtime, date and time — the fields a player actually scans down a column to compare. Everything that identifies a save rather than sorts it, the chapter title, the preview image and the log entry, sits in the detail panel where there is room for it. Load and Delete are separated and Delete is the only red element, so the irreversible action is never adjacent to the routine one.

Loading

The transition between the front-end and the game, and the one screen with no navigation on it at all. It reuses the menu's environment plate dimmed down, so the game does not visually restart at every load, and it gives the wait something to do: a tip block above the bar, and a percentage inside it rather than a bar the player has to estimate.

Inventory

The second navigation system: the same frame, now holding the in-game hub of Loadout, Missions, Character, Skills and Data Log. The grid shows locked slots rather than hiding them, so the shape of what is still to come is visible from the first hour, and it scales by adding rows instead of paging. Item stats are given twice, as a segmented bar and as a number, because a bar is faster to compare across items and a number is what a player quotes when deciding between two.

Missions

Objectives as cards with a fixed three-part anatomy: faction emblem, the text block carrying title, objective and completion condition, and an environment thumbnail. Because the parts never move, a long list stays scannable by column — a player can run down the emblems alone to find the thread they were following. The artwork is doing narrative work rather than decorative, giving each mission a place the player can recognise before reading a word of it.

Credits

The third navigation system, this time holding the bonus content section, and proof that the frame survives content it was not designed around. A credits roll is the least interactive screen in any game, and it still uses the same rail, the same panel and the same legend. Roles are centred and separated by rules rather than boxed, which keeps a long scrolling list from turning into a table.

Process

Identity and wireframes

The wordmark came first, then every screen was resolved in greyscale: layout, spacing and navigation locked before any styling. These run in the same order as the screens above, so each one can be read against its finished counterpart.

Final thoughts

Designing a front-to-back interface as a concept means nobody hands you the constraints — you invent the ruleset and then have to hold yourself to it across every screen. The part I would carry into a real production is the decision to fix the frame early: the rail, the panel and the input legend never move, and each context just fills them differently. That one rule is what lets seven screens across three separate menu systems read as a single game.

The thinking behind this

Longer write-ups on the craft this project drew on.

The same counter set twice: proportional figures jittering as the number changes, and tabular figures holding their position

Visual craft 9 Sep 2026 10 min read

Typography for game UI: the part players read under pressure

Interface type is read in half a second, at speed, over moving artwork, by somebody who did not come to your game to read. Almost every rule that applies to a book works against you here, and the fixes are specific.

Read the article

Visual craft 9 Sep 2026 9 min read

Icon design for games: sets that still work at 32 pixels

An icon has about a fifth of a second and a few hundred pixels to say what a thing is. Most game icon sets fail not because the drawings are bad, but because they were drawn large, one at a time, by different rules.