Mobile Game
Color Touch is a mobile game that tests players' reflexes and color knowledge. In our efforts to enhance the overall game experience, we strategically implemented ads into several screens while ensuring a seamless and enjoyable gameplay. Our goal was to create a user-friendly interface and intuitive gameplay mechanics that eliminate the need for players to rely on tutorial documents.
Johnathan Milo Sally Sharon
User Experience Design UI implementation
Adobe Photoshop Unreal Engine 4 UMG system Adobe XD
WIP
People tend to play mobile games to fill up trivial time. As a group of people who makes a living from our knowledge of art and games, we want to create a game using color as its theme.
To ensure the game meets market demand, we discussed the target audience, user needs, client needs, content and functionality requirements, etc., before we started the design process. We compiled a strategy document as a production guideline to guide everyone in a consistent direction.
The app will focus on the following target audiences:
The app needs to enable the users to:
The app needs to enable the client to:
With the research results and lists of user and client needs, I gained an understanding of the content and functionality that the app would provide. I compiled the requirements and discussed them with the respective stakeholders to confirm their feasibility.
After the discussions, I proceeded to create a content map to ensure the delivery of appropriate content at the right moments. Subsequently, I utilized an interaction map to outline user paths. Lastly, I developed a sitemap that integrated information from the content map and interaction map, providing the team members with a comprehensive understanding of the displayed content and the app's user interactions.
I created a low-fidelity prototype using Adobe XD and shared the prototype link for usability testing. The participants included our team members and five individuals outside the team who matched our target audience criteria. Our team members conducted unmoderated usability tests, while I personally interviewed the other participants.
After the usability testing, we unvealed findings which could improve our user experience.
For example, we decrease the size of our ads. We also tried a more visual way to express necessary parameters, hoping to decrease players cognitive load.
To incorporate the user interface (UI) into the game, we utilized the UMG (Unreal Motion Graphics) system in Unreal Engine 4. By leveraging the visual scripting system called "Blueprint," we added functionality to the UI elements and implemented motion graphics. This allowed us to conduct more comprehensive testing of the game, ensuring a seamless user experience.
Despite being a simple mobile game, we consistently prioritized putting ourselves in the player's shoes to create an enjoyable gaming experience, focusing on both the UI design and game mechanics. We conducted thorough reviews of our production process and actively sought opportunities for optimization. With a shared enthusiasm, we are eagerly anticipating our future collaborations and the exciting possibilities they hold.