01 · Start your career
Title
A clear route from choosing a career to the next event.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
← UI & UX studies
UI & UX / Racing game concept
Neon Wake.
I designed a canal-racing interface that connects the garage, the course, and the championship. Bold menus set the pace; a restrained race HUD leaves room for the water.
My work Flows · Wireframes · UI & visual design
Figma 18 game screens · Personal concept
From the garage to the finish
Find your racing line.
Browse the journeys, compare each design with its wireframe, and expand either version to see the full screen.
01 · Start your career
Choose your career
A clear route from choosing a career to the next event.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
01 · Start your career
Career hub
A clear route from choosing a career to the next event.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
02 · Choose a course
Event selection
Compare courses, understand the route, and revisit personal bests.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
02 · Choose a course
Event briefing
Compare courses, understand the route, and revisit personal bests.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
02 · Choose a course
Course records
Compare courses, understand the route, and revisit personal bests.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
03 · Make the craft yours
Garage
Explore the fleet, adjust handling, and give a consistent craft its own look.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
03 · Make the craft yours
Craft tuning
Explore the fleet, adjust handling, and give a consistent craft its own look.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
03 · Make the craft yours
Livery customization
Explore the fleet, adjust handling, and give a consistent craft its own look.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
03 · Make the craft yours
Craft unlock
Explore the fleet, adjust handling, and give a consistent craft its own look.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
04 · On the water
Pre-race setup
Set up the race, read the course at speed, and pause without losing context.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
04 · On the water
Live race
Set up the race, read the course at speed, and pause without losing context.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
04 · On the water
Race paused
Set up the race, read the course at speed, and pause without losing context.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
05 · Chase the championship
Race results
Follow the result of a race through standings and the championship finish.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
05 · Chase the championship
Championship standings
Follow the result of a race through standings and the championship finish.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
05 · Chase the championship
Championship finale
Follow the result of a race through standings and the championship finish.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
06 · Play your way
Controls and assists
Readable controls and accessibility options keep the player in control.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
06 · Play your way
Accessibility
Readable controls and accessibility options keep the player in control.
Finished
Wireframe
Expand for a closer look, or switch between the finished mock and its UI-only wireframe.
The design decisions
Built around the race.
Neon Wake is a hovercraft racing concept set on canals. The interface moves from deliberate choices in the garage to quick, readable information on the water.
A consistent racing identity
The approved wordmark, condensed italic headings, navy surfaces, cyan focus states, and coral accents connect each screen to the Neon Wake brand.
The world stays visible
A compact HUD keeps position, timing, the minimap, and boost near the screen edges. The quieter menus use atmospheric lighting and dark-blue glass surfaces.
One craft, distinct views
Separate scenery and transparent craft artwork support editable UI. Front and elevated views make tuning and livery choices easier to read without changing the vehicle identity.
Personal game concept, not a released or user-tested game. The 18 wireframes and 18 finished designs use editable Figma UI over separately generated, art-directed scenery and craft assets. Linked screens demonstrate navigation; racing, saving, tuning, and progression are proposed behaviors rather than a working game.
Explore in Figma
Wireframes & flows.
Editable UI-only wireframes, organized in the same sequence as the finished mocks. The preview is open to view.
Explore in Figma
The finished screens.
All 18 active game screens, with editable UI, native glass effects, and separate artwork. The preview is open to view.