Sudoku App
Sudoku App
UI/UX DESIGN PROJECT
UI/UX DESIGN PROJECT
Embedded Files
Role
Lead UI designer
Tools
Figma
Team
1 UI designer, 2 developers
Timeline
July - Aug 2024
Project Summary
This project started in July 2024 and was completed in August 2024. I designed a Sudoku app for a client I found on the Bionluk platform. The client's goal was to publish this app on the Apple Store. The app targets a wide range of users; basically, anyone old enough to play Sudoku can use it.
Client and Target Audience
The client wanted to reach a wide audience by publishing the app on the Apple Store. Since Sudoku is a puzzle game that appeals to users of all ages, it was important to create a user-friendly interface. I focused on making the app easy to use for everyone.
Problem Definition
When designing the interface for a popular game like Sudoku, it's important to consider the habits of the users. The main challenges in this project were deciding the layout, choosing the right colors, and figuring out where to place the menus so that they were easy to find and use. My goal was to create a design that users could quickly adapt to and enjoy.
Solution
I designed a simple and clear interface that allows users to focus on the game easily. The app's main features are kept simple to reflect the classic Sudoku experience. I carefully planned every detail in Figma, from the color palette to the menu placement.
Principles and Techniques Used:
Usability: I considered the common layouts that users are familiar with, placing menus and controls in ways that would not distract them during the game. I chose a minimalist design to keep the focus on the game.
Consistency: I standardized the placement of menus and buttons to provide a consistent experience across different screens and interactions.
Visual Hierarchy: I created a visual hierarchy using color and size differences, making it easy for users to find the most important information quickly.
Process
The design process began with thorough research. I analyzed existing Sudoku apps to understand user preferences and habits. During this process, I focused on menu placement, color palette selection, and overall user experience. Drawing inspiration from successful examples, I created an interface that prioritizes user satisfaction.
I presented the design to the client using Figma, and the client expressed satisfaction with the design. Currently, the app is in the coding phase, so I do not yet have feedback from users.
Challenges and Solutions
One of the main challenges I faced in this project was deciding how to arrange the numbers below the Sudoku grid. The placement of these numbers could greatly impact the user experience. Initially, I placed the numbers side by side horizontally, but this made the buttons too small, making them difficult to press.
To solve this problem, I tried different layouts and finally decided that arranging the numbers in two groups stacked vertically was the best solution. The first group consists of the numbers 1, 2, 3, 4, 5, and the second group consists of 6, 7, 8, 9. I placed the undo button next to these numbers, where users could easily reach it. This layout made it easier to select numbers and improved the overall user experience.
This solution not only made the buttons easier to press but also contributed to a cleaner and more user-friendly interface. Users could easily reach the numbers during the game, making playing Sudoku more enjoyable and seamless.
Dark Mode Implementation
Dark Mode Implementation
To enhance the user experience further, I also designed a Dark Mode for the app. This feature is especially useful for users who prefer a darker interface or play Sudoku in low-light environments. Dark Mode not only reduces eye strain but also adds a modern and sleek look to the app.
Visuals: Below is a side-by-side comparison of the regular mode and the Dark Mode interface, showcasing how the color scheme adapts to different user preferences.
Settings Page Design
Settings Page Design
In the Settings page, I prioritized making it easy for users to customize their gaming experience and access helpful information. At the top of the Settings page, I placed a "How to Play" button. This allows users to quickly learn the rules and mechanics of the game, making it more accessible, especially for beginners.
On the top right, there is a palette icon that users can click to change the color theme of the app. Since users of Sudoku apps are typically familiar with the palette icon for theme customization, placing it here ensures they can easily find and use this feature. This icon makes it simple for users to switch between light and dark modes or choose other color schemes, enhancing the overall user experience.
Visuals: Below is an image of the Settings page, showcasing the "How to Play" button and the palette icon for theme customization.
Result Pages Design
Result Pages Design
Celebrating Success: Level Completed
Celebrating Success: Level Completed
Upon successfully completing a Sudoku level, users are greeted with a "Level Completed" screen. This page displays the level they just finished, giving them a sense of achievement and encouraging them to continue playing. The clean and celebratory design of this page is intended to give users a moment to recognize their progress before moving on to the next challenge.
Encouragement After Mistakes: Second Chance
Encouragement After Mistakes: Second Chance
If a user makes three mistakes, they are shown a "Don't Worry" screen. This page gently informs them of their mistakes with a message that says, "You made 3 mistakes, try again and you'll do even better next time!" The purpose of this design is to encourage users to keep trying without feeling discouraged. The screen also offers two options: "Second Chance" to retry the level, and "New Game" to start a fresh puzzle. This approach ensures that users feel motivated to improve and continue enjoying the game.
Conclusion
After the coding phase, the app is expected to be published on the Apple Store and reach a wide audience.
Page updated
Google Sites
Report abuse