StreamliningCharacterCreationinEldenRing
I set out to improve the experience of creating your character in Elden Ring.
Personal project · 2024 · UX/UI for Video Games
The Challenge
Built as part of the UX/UI for Video Games course at ELVTR, taught by Ivy Sang (UX/UI Director at Blizzard).
The goal was to make character creation less confusing and overwhelming for new players, propose a new visual style, and bring part of it into a game engine. I studied how new players first meet the game to build an end-to-end proposal, and used a new visual concept to sharpen my interface design.
My role
Player analysis, wireframes tested and iterated, and a new visual direction backed by a style guide, ready for the engine.
Tools & timeline
Photoshop · Illustrator · Figma · Unreal Engine. 7 weeks: 3 on discovery and prototyping, 3 on visual design and accessibility, 1 on engine implementation.
Research
To understand the decisions players make, I analyzed the first-time user experience: what they see on each screen, what they feel, and what they expect. In short, new players found the choices in character creation confusing and overwhelming.
Screen mapping & flowchart
I then mapped how a new player moves through the game, from starting a new run to the first enemy encounter, to understand the actions available on each screen beyond character creation.
Wireframes & Testing
The biggest change was putting everything on one screen, to give context and visually connect the origin you choose with the skills each one brings.
Usability test & iteration
I tested V1 with 5 players, a mix of new and returning Elden Ring players, and documented every session.
Based on the test results, I made some changes to the screens for V2, mainly in how players understand and interact with the keepsake.
Visual Design
I wanted a new visual proposal that stayed close to the Elden Ring world while looking completely different from the current screen.
UI style guide
I designed everything from scratch, except the icon and character art, borrowed from the Elden Ring Wiki.
I ran the palette through a color blindness pass — protanopia, deuteranopia, tritanopia — to check that nothing in the interface depended on hue alone to be readable.
Final screens
After several visual iterations, I shared the final result with the usability testers. Their response to this new direction was very positive:
- "Character creation is much more intuitive and easier."
- "I understand more easily the differences between origins."
- "It is clear to understand what a Keepsake is."
- "I like the new design, it's a new interesting style."
In Engine
Implemented in UE5 with UMG — a partial prototype, built to test whether the design survives contact with an engine instead of a Figma canvas.
