Katerina Michael
Back to Level 5

Level – 5

Apocalyptic Game UI

A UI concept that blends the bright, polished look of a casual competitive game with a gritty post-apocalyptic setting — a world that was once cheerful and full of bold colour, now carrying signs of wear, muted tones and a more restrained style.

Discipline
Interface concept
Year
2025
Tools
Photoshop, Figma
Brief
Self-directed

Interface concept

Building Assignment

The screen has to carry two moods at once: the playful charm of where this world came from, and the hardship of what it became. Bold shapes and clean panels do the first; worn texture, muted colour and a restrained palette do the second. The grime stays in the frame and the background, and keeps clear of anywhere a player has to read a number.

  • Building assignment
  • Character panels
  • Dense layout
  • Survival

  • The design

    The building-assignment screen — a survivor's portrait, their previous life, the four attributes that decide where they are worth posting, and the cost of levelling them.

    • Final character screen: a mutated survivor portrait over a dark hex-pattern panel, with name and building assignment, previous occupation, four attribute stats, a star rating, XP and evolve bars and a five-icon bottom bar

      Final screen

  • Draft — older versions

    Earlier passes at the same screen, kept for the record rather than shown at size.

    • First draft of the character screen layout

      Draft 1

    • Second draft of the character screen layout

      Draft 2

    • Third draft of the character screen layout

      Draft 3

  • Reference & moodboards

    Contains third-party reference material

    The research behind the screen: her own icon set built against sourced icon sheets, an annotated breakdown crediting what each decision came from, and the collected boards.

    • Icon design sheet: currency, chest, heart, scroll, hammer and building icons, shown alongside the third-party icon sets used as reference

      Icons — with sourced references

    • Annotated reference sheet placing the final screen beside screenshots from other studios' games, with notes explaining which layout and colour decisions each one informed

      Annotated — third-party games

    • Moodboard of collected interface screenshots from other studios' games, annotated with notes on layout, colour and mood

      Moodboard 1 — third-party

    • Second moodboard of collected third-party interface references

      Moodboard 2 — third-party

    • Third moodboard of collected third-party interface references

      Moodboard 3 — third-party

    • Fourth moodboard of collected third-party interface references

      Moodboard 4 — third-party