CAST BY LIGHT
GAME UX/UI DESIGN
DATE
June - July 2021
TYPE
Conceptual Project
PLATFORM
Mobile
TOOLS
Adobe Illustrator, Adobe Photoshop, Adobe XD, Figma, Diagrams.net
MY ROLE
I worked on this solo project as the lead UX/UI designer. Main areas of responsibility:
UX research (competitive audit)
UX/UI design (user flows, sketching, wireframes, mock-up, prototyping)
PROJECT
Cast By Light is a 2D puzzle platformer created for arcade where the player takes the role of Ann as she searches for her missing partner in a post-apocalyptic world. The game was developed by Shadow Walkers, a team of seven Game Design students, over the course of a ten-week period at Uppsala University.
While the game was made for arcade, a working prototype was also made for a possible mobile release. While this mobile version was never fully finished, I wanted to challenge myself and design the user experience for it. The original arcade version did not have any visible UI, as it had no need for it but in the mobile version, the user experience could be expanded upon by bringing the player a few more choices.
CHALLENGES
The mobile user experience needed to address the user needs caused by the change of platform from arcade to mobile. The original arcade experience debuted on a show floor where a member of the development team was always nearby to help the user. However, in the mobile experience, the user needed to be provided with the tools that would allow them to perform certain actions on their own.
The target audience of the game was defined as players who are interested in a serene and calming experience that immerses them in a world, and who enjoy solving challenging and complex puzzles which require experimentation and thoughtful consideration. The user experience needed to evoke the same serenity and calm that the gameplay does without distracting the user from the immersion of the gameplay experience.
SOLUTION
I began the project by performing a competitive audit. During the competitive audit, I researched both the most popular mobile games in the market at the time but also smaller games that were comparable to Cast By Light in gameplay and/or aesthetic. After collecting this data, I analyzed the original arcade experience and listed down features commonly seen in mobile games which would allow the user more control over the experience than in the original arcade game.
The original arcade experience had a straightforward user flow of going from the in-game screen to the credits after the user had completed the game. The game could also only be restarted by a member of the development team present at the show floor where the game made its debut. The mobile experience required quite a few extra steps which were based on the data from the competitive audit.

After determining the steps the user could take during the experience, I sketched down my ideas for each potential step. During this phase, I also explored ideas for a visible interface for the in-game stages but scrapped the idea in order to stay true to the vision of the original arcade experience that highlighted immersion.

After sketching out my ideas, I created medium-fidelity wireframes in Figma to better visualize the layout and the elements that each step required.





My next step was to create a high-fidelity mock-up. The basic ideas from the wireframes are still in place in the mock-up but I chose to add a title at the top of each screen for a more structured layout and a more cohesive look across the different screens. For the interface, I chose a minimalist style that fit the aesthetic of the game but would also leave room to showcase the art of the game which received plenty of praise when the game debuted at Gotland Game Conference 2019.
The majority of the mock-up was done in Adobe Illustrator, but the background graphics were done in Adobe Photoshop. The background illustrations and the character art were made by, and in some cases in collaboration with Tove Wahlberg.
Click on the images to open them in Expand Mode.






In the final stage of this project, I created a prototype of the mobile experience in Adobe XD. The prototype does not include final animations but showcases the basic flow of the user experience.
RESULTS
The project forms a base for a new way to experience Cast By Light where the user is in full control of their experience. Going forward, it would crucial to test the design with users with special attention being paid to the accessibility of the design.