UX • UI • Brand Identity
Checkpoint is an app designed to help gamers manage their playtime and build healthier gaming habits. It empowers users with tools like customizable game-time limits and a centralized game library to balance gaming with their lifestyle
Process
I followed the double diamond approach for this project. Below you will see the process I followed in the Discover, Define, Develop and Deliver phases.
Discover
Secondary Research
Extensive research was done to assess the problem space of problematic gaming. Here you can see the key findings for the extent of the issue, it’s adverse affects and competitor analysis.
1 million people in the UK suffer from gaming addiction. This does not account for those who engage with problematic gaming which is gaming beyond what your lifestyle would permit.
Problematic gaming and gaming addiction have been found to have numerous detrimental effects on the physical and mental wellbeing of gamers with adverse effects on sleep, neglect of basic self-care needs and compromised relationships and education.
There are no tools currently to help gamers moderate their gaming effectively. Those having issues must rely on articles giving tips and apps that help with habits that aren’t focused on gamers and their unique needs.
Primary Research
I conducted interviews with 4 participants who were gamers who game for 10hrs + a week, between the ages of 18-35 and are working professionals.
‘Because of my ADHD it takes a while for my brain to slow down after gaming so I don’t sleep very well’
‘If there’s no one online, I’m not gaming’
‘I realized that I’ve just been sat in a room for 8 years. I live in an amazing place and never interacted with it’
‘The three aspects of my character are gym, gaming and animation’
‘I feel like gaming is earned gratification instead of looking at tiktok for hours just consuming’
‘It’s really challenging to pull yourself away to stick to a routine when you’re really into a game’
‘I think gaming gets a really bad rap for being an unhealthy hobby’
‘When I’m studying it’s really hard to not game. I had to give my Xbox to a friend so I didn't play’
‘I play a mobile game all the time throughout the day whenever I have a second’
‘When I was gaming a lot I just wasn’t sleeping. I was going sleep deprived’
‘I get a lot of FOMO when I game which really affects my time management with gaming’
‘I’ve had to make a conscious effort to put down the game and go make something to eat’
Affinity Mapping
Using the affinity mapping technique I organized the data points from my interviews into themes. I chose three themes that stood out as the most significant to those I interviewed.
Struggling to stop
Games are designed to be highly interactive and engaging. This means that a common problem for gamers is sticking to a schedule around gaming. It’s simply much more enticing to continue gaming than it is to go to sleep, spend an hour cooking yourself a healthy dinner, or even stick to social plans. This can lead to excessive gaming and gaming addiction, both having many negative effects on general and mental health.
Procrastination/Boredom
Many gamers report playing games often as a means to procrastinate chores or boring tasks such as cleaning or studying. Furthermore, when they are bored and have nothing else to do, gaming is an easy and quick way to spend many hours of free time. However, both of these lead to gamers feeling low in self-esteem because they feel they lack discipline and they are missing out on other experiences.
Desire for balance
Games generally provides up to 50-100 hours or more of gameplay so gamers find it difficult to balance this around a lifestyle. Although avid gamers are very passionate about gaming they still desire a balance in their lives of other hobbies and social events feeling that this would provide a more full life.
Define
Persona
Using the data from my interviews I created Tim. A persona that would keep my user at the core of my design.
Experience Map
What does a typical experience look like for Tim? An experience map allowed me to understand Tim’s experience better and uncover areas of opportunity for intervention.
User Stories
Using the data from my interviews, my persona Tim and his experience, I crafted over 30 user stories to define the features of my solution. Here are some examples:
Tracking
As a gamer | I want an app that tracks my gaming time accurately | so that I | can become more aware of how much time I spend gaming compared to other activities
As a gamer | I want the app to track my progress towards my gaming time management goals | so that I | can see how well I'm doing and adjust my strategy if needed
Time Management
As a gamer | I want the app to allow me to set gaming time limits for each day | so that I | can allocate time to other hobbies and responsibilities
As a gamer | I want the app to send me notifications when I exceed my set gaming time limit for the day | so that I | can be reminded to take breaks and engage in other activities
Social
As a gamer | I want the app to have a social feature that allows me to connect with other gamers who are also trying to manage their gaming time | so that we | can support each other
As a gamer | I want the app to have a feature that allows me to schedule gaming sessions with friends | so that we | can enjoy gaming while also nurturing my social relationships
Health/Wellbeing
As a gamer | I want the app to provide me with tips and strategies for reducing gaming-related stress and improving my overall well-being | so that we | can maintain a healthy balance
As a gamer | I want the app to provide me with educational resources on the benefits and risks of gaming | so that we | can make informed decisions about how much time to devote to gaming
I chose time management as the main epic I would pursue when designing my solution.
This was the most prevalent challenge to gamers I found in my research. Here are some examples of the expanded epic:
Time Management
As a gamer | I want the app to allow me to set gaming time limits for each day | so that I | can allocate time to other hobbies and responsibilities
As a gamer | I want the app to send me notifications when I exceed my set gaming time limit for the day | so that I | can be reminded to take breaks and engage in other activities
As a gamer | I want the app to have a feature that allows me to block access to certain games or gaming platforms during specific times | so that I | can prevent myself from gaming excessively
As a gamer | I want the app to have a feature that allows me to set goals for reducing my gaming time gradually | so that I | can make sustainable changes
As a gamer | I want the app to be able to pause and close games on my console and PC for me | so that I | am forced to stick to my time limit
As a gamer | I want the app to integrate with my calendar and schedule | so that I | can plan gaming sessions around my other commitments
Develop
Sketching
Using the user stories, persona and experience map I crafted I began sketching screens using the crazy eights method. Once enough screen ideas were created I developed solution sketches for the app that I would use to create wireframes.
Homepage
A live indicator that tracks your progress toward your limit
When pressed this button will boot up a connected console and start tracking game time.
When looking to set a new gaming limit.
Calendar
The calendar will have icons highlighting gaming sessions that the app or user has scheduled.
A drag to expand snap shot of today’s schedule based on gaming sessions booked in and other items in your phone’s calendar.
Game Library
This will be the last game played on the connected console with a button to boot up the console and start playing the game.
List of other games that have been added to the game library.
Feedback Screen
Confirmation of the new limit being activated with a return home button for easy navigation.
New Limit
Two options for users to choose from with copy explaining the difference beneath the title.
New Limit
Users can create a custom time limit that suits their needs.
Users can opt to switch off console automatically whe limit is reached. Users can also link their phone’s calendar to the app.
Wireframes and User Testing
After sketching I created wireframes in Figma and started user testing. 2 rounds of users tests were conducted with 5 participants each round. The screens below show the first iteration and the last.
Homepage
1
The header box was removed to improve whitespace and remove unnecessary borders between information. Secondly a guidance on the week the limit was set for was added
2
Users also had an issue with finding the new checkpoint button so it was made to match the start playing button while maintaining hierarchy with colour.
3
The calendar reminder was visually linked with the calendar function in the app by adding the same icon and a view calendar button.
4
The name of the corresponding app section was added to the navigation bar icons for more clarity as users found the icons not obvious on their own.
Pop-up
1
Title, clearer copy and hierarchy were added to make the text more readable to limit instance close.
Calendar
1
In the second iteration, an outline was placed around the date and icon to make it clear which date the icon was referring to.
Game Library
1
While important to keep the play button hierarchy between currently playing and library games. Users found that they may do different things. Reducing the larger button’s size and adding the same Icon as the smaller buttons maintains hierarchy while linking a similar purpose.
Calendar
1
Information was streamlined to one page so the user could physically see the change in input options as well as an explanation of the difference between Flat and Gradual limits.
2
In the second iteration, along with changes to the option function, a goal date by which the user would attain their goal was added.
Brand Identity
The brand identity for began with a moodboard that was a cross between cyberpunk and modern glass-reflection themes. This led me to the logomark for checkpoint that resembles shades of glass sliding behind the text.
Design System
I followed the Organism model for my UI library. Here are some examples of the atoms and molecules from that larger library.
Colours
Atoms
Molecules
Deliver
Prototype
The project focused on a specific flow that a user may follow through the app. This prototype shows the flow of creating a new checkpoint.
Marketing Website
As part of the project I designed a marketing website for the app with the main focus of driving downloads of the app.
Reflection
What would I do differently?
Experience Map
The experience map that I created made many opportunities clear for the potential functionality of the design. Going back I would continually go back and create more experience maps and add some other features for the solution to better help the user.
Elements
Going back and with more time I would adjust the date picker or the gradual option when setting a new checkpoint. The design could be improved to make it more user friendly.
Also I would expand the Game Library to include game-time metrics for each game.
Sketching
This part of the project was during the earlier days of my bootcamp. Going back I would really harness th potential of sketching to create any different concepts for different screens to ensure the best options were being chosen to move on to wireframing.
Embracing the Iterative Process
I was working on this project while I was learning UX/UI for the first time. As such, my instinct was to create a concept and polish it to try and make it the best it could be. I was hesitant to take the time to create multiple concepts and as a result I feel the solution is somewhat simplistic for solving what is a more complex problem.
Potential Future of the Design
AI Functionality
The AI functionality in the current design is limited to organizing gaming sessions around your phone’s existing calendar.
Additionally I would add a 3rd option when setting a new checkpoint that would be AI driven. This option would allow checkpoint’s AI to create in-game tasks that roughly correspond to the remaining time they have left gaming that week or during that session. That way users would never be right in the middle of something important when their checkpoint was reached.
Community Feature
The social aspect of gaming was one of the main motivators to game for those I interviewed. However, it was not prioritized in this solution as seeing a friend online often resulted in gaming when users weren’t intending to which is a pain point not a solution.
However, it remains to large a factor not to ignore and having a community feature that focuses on supporting others to reduce their game time rather than be the cause of a lapse.
About Me