Having personally worked on Mortal Kombat 1 as a QA Analyst for two years, as an exercise I wanted to create a concept for a mobile interface for the game that functions similarly to that of the traditional controller interface.
THIS IS A PERSONAL PROJECT. THIS HAS NEVER - NOR WAS EVER - CONCEIVED FOR DEVELOPMENT BY NETHERREALM STUDIOS
CLIENT: Independent Project
ROLE: UX/UI, Interaction, Visual Designer
TEAM: Solo Contributor
TIMELINE: 1 Month
Fighting games are designed (if not dependent) on physical controllers for input. MK1 also operates on Unreal Engine 4, so There’s a high level of visual fidelity with the environmental designs and I don’t want to create an interface that obstructs that in any way.
Maximizing screen real estate without obstructing much of the visual design
Create a viable interface usable with only thumbs and no other inputs.
Competitive Analysis
Shadow Fight Arena has the closest interface to what I’m aiming to achieve for the MK1 mobile concept. The only concern would be that there’s simplicity with the interface that wouldn’t meet the complexity of certain button combinations of MK to achieve many of the moves.
USER FLOW
The interface redesign will utilize five primary menus - swipeable to the left or right - with each one focusing on a specific game feature from the console version
Design Iterations
For the initial designs, I want to mimic as much as I can from the experience of a handheld controller. That means keeping in mind the range of motion for thumb inputs and having the player’s hands as stationary as possible same as if they were holding a controller.
Main Menu
The Main menus have been redesigned with a touch screen in mind for ease of navigation between different modes, as well as condensing as much information from the full console counterpart.
Fight UI
The Fight UI is largely similar to the console version of MK1, but the control interface has been adapted for mobile. The Control layout was specifically designed with the natural range of motion of a user's thumbs for ease of use. And controls have been streamlined to mimic similar combo inputs to those of a physical controller.
Making a mobile interface for a fighting game is interesting, mainly for the fact that it has always been a genre that relied on physical controllers for inputs. So doing that for Mortal Kombat of all games, which is one of the definitive games of the genre, played competitively. Surprisingly, redesigning the menus proved to be the easiest part. Conceptualizing a way to translate those interfaces in a way that would be comparable to an actual controller to support how in-depth and technical the inputs are was the real challenge. The whole exercise forced me to think heavily about not just the visual aspects of the game, but the physical platform, and to be mindful of its strengths and limitations. Overall, the project was rewarding in getting me to think beyond visual design experiences and more about the physical platform and how it correlates to game design overall.
