Street Fighter V: Main menu redesign
Capcom
1 week
UX/UI Design
Figma
Project overview
Street Fighter V was released in early 2016, it is still going strong as one of the most popular titles within the fighting game genre. Having played the game heavily at launch, I was surprised to see that the interface design has seen little improvement to date.
In this project I am attempting to address the issues of usability present in the games’ current design, starting with a redesign of the main dashboard.
Below you can see a before and after of the original main menu and my redesign. Keep reading to discover the process that I undertook to get there!
Before
After
Site map
After reviewing the information architecture of the current home screen, I set out to reorganise the interface in an updated sitemap, grouping the different game play options in ways that would make more sense to users.
Low-fi wireframes
With a new sitemap in hand, I created some quick low-fi concept wireframes of what the dashboard could look like. For this I researched what was existing in the market, learning about design patterns that are prevalent in and outside the fighting game genre.
Hi-fi mockup
For the final design I tried to stay true to the visual design elements that feature in the marketing of SFV. Vivid reds and gold fonts draw the eye.
Through reshaping of the Information Architecture, there is much more space available for elements to excite the players.
To the right of the menu the players favourite character stands on their favourite stage background. Alternatively, depending on the game mode selected, the character changes, as demonstrated in my example featuring the story mode's final boss, M.Bison.