Locomoto is a cosy train adventure game where you customise your character and train, tend to quirky passengers, gather resources to craft furniture and decorations, all while listening to relaxing lo-fi beats.​
​
I joined the team when Locomoto has been in development for 2 years. With the game already well defined, I collaborated with the team to get a good understanding of the world of Locomoto and how the UI would complement the feeling it wanted to invoke. An especially pressing issue was providing an experience pleasant for both first time and experienced players.
​
Beginner Friendly User Interface
Whether a player had just booted up Locomoto as their first game, or had previous experiences in games; the interface was designed with beginner friendliness in mind.
-
Contextual button prompts for any action the Player is able to take at a moment
-
Dynamic control references for menus to help the players guide with the actions they would like to perform
​​​​
Importance of Emphasis in Typography
Locomoto uses only one active typeface throughout the whole game while maintaining hierarchy, and flow in menus. Using different sizes, weights, styles and colors throughout the UIs, helped us to establish the game language for the players.
-
Tagging different elements in the game with different colors; like locations, NPC names, items, helped in bringing attention to the important
-
Supporting with different UI assets to bring attention to text when needed
​​
Locomoto - Launch Trailer
Locomoto - UI Showreel
Lead Artist: Maria Levander
Music & Sound: Rickard von Friesendorff
Localisation Support
Currently, Locomoto supports 7 languages by using 3 different typefaces in total. It was important to find fonts that fit the style of our UI, which would complement menus that are colorful and contained rounded-edged shapes.
​
Having decided the main typeface early on, helped us greatly in finding the right typefaces for Chinese and Japanese languages.
Tools
Unity Engine
Main engine for the game, all the user interfaces are made using Unity UI.
Figma
Low and high fidelity mockups for discussing ideas with the team.
Photoshop
Contributing with small assets for the menus.
Responsibilities​​
​​​​
Cross-Disciplinary Communication
-
Collaborative work across disciplines; Art, Audio, Design and Programming, making sure all the functionality is working as intended and the style across the menus are consistent.
-
Discussions with Art about icons, colors,​ and fonts, adapting to changes quickly.
-
Concepting newly implemented mechanics from Design and supporting the idea with new user interfaces.
-
​Integration of Unity FMOD plugin to work with UI elements.
-
​Working on optimising UI assets (compression), making sprite atlases.​
-
​
UI/UX Design
-
Creating mockups to present the flow of the menus.
-
Designing high-fidelity prototypes to test out different ideas for the menus.
​​​​
UI Programming
-
Creating menus from concepts to fully functional by coding in C#.​​
-
Implementing a tutorial manager, to create interactions that can pop up tutorial modals.
-
Created scriptable objects for designers to use to create tutorial interactions easily.​​
-
-
Writing custom scripts for buttons, menus, tabs, and animations.
-
Developing tools for Marketing to use when capturing footage, to hide or show UI.​​
​
Menus Designed and Implemented
-
Main Menu
-
Options Menu
-
Character Customisation​
-
Clothing Customisation
-
Crafting Menu
-
Worldspace UI, displayed on top of NPCs heads, depending on their states
-
​Quest Indicators
-
Quote Indicators
-
Travel Indicators
-
-
HUD
-
Player Inventory (Pockets)​
-
Controls Reference (right-bottom corner)
-
Button Prompts - Contextual (when hovered over interactable objects)
-
Notification System
-
Popups for Quest Updates & Unlocks
-
-
Player Menu, tabs listed below:
-
Quests​
-
NPC​
-
Blueprints​
-
Settings
-
-
Tutorial Menu
-
Modals & Popups