UI/UX Case Study: Designing a gamified app to help users manage screen time
In this case study, I’ll discuss the negative impact of using smartphones excessively in our lives and how we can address this issue with Focusly-A screen time management app
Timeline: 2 Weeks | Process Followed: User Research, Design Thinking, Designing Wireframes, Designing UI, Prototyping, Usability Testing
🧭 Problem Discovery
Recently, I noticed changes in my health and overall mood: itchy eyes, disrupted sleep cycle, and feeling emotionally off. I realised I was constantly on LinkedIn, and mindlessly scrolling through YouTube and Instagram. And that’s when I decided to check my ⏰ screen time. My phone reported a screen time of 🤯 shocking 4+ hours a day, outside of work. If my work schedule is included, it would add up to 10–12hrs of screen time per day. That’s when I started using “Screen Time” feature of iOS, but despite using it, I still spent more time on those apps, making it hard to reduce my screen usage.
Potential problems I found with the screen time feature are:
⚫️ No strict blocking of apps
⚫️ Not motivating the users to reduce screen time
I instantly recognised this as a problem statement to solve. But before proceeding further, I had few questions in my mind
⚫️ Is this a problem for masses?
⚫️ If yes, Who are the people facing the problem?
⚫️ What are the current screen usage patterns of people affected by the problem?
⚫️ How do they feel after excessively using their smartphones?
⚫️ What are they currently doing to solve it?
In order to clear the assumptions and get answers to the above questions, I conducted a survey
Below are the insights I gathered from the Survey:
Most respondents are full time employees, while others are students or job seekers. Most people don’t keep track of how much time they spend looking at screens, but those who do mostly reported spending 4–6 hours a day. Social media and entertainment apps take up most of this screen time. Spending too much time on screens can make people feel guilty, stressed, frustrated, and mentally tired. This excessive use can become like an addiction, causing people to put off important tasks. Many people don’t realize this and haven’t tried any digital detox apps to help with the problem
There were few questions which were still unclear…
So, to establish a deeper connection with the problem and get answers to the unclear questions, I conducted telephonic interviews with few potential users
Below are the insights I gathered from the telephonic interviews with three potential users- 👨🏼🎓 Student, 🧑🏽💻 Full time employee, 💼 Job Seeker:
All the participants use their smartphones for everyday tasks like learning, checking email, browsing, messaging, and scrolling through content. However, they find that using apps like Instagram, Snapchat, and YouTube often causes them anxiety, mental exhaustion, and guilt over wasting time. Although they prefer to start their day by planning tasks, they often get distracted by their phones, which leads to delays of tasks. Excessive phone use creates a cycle of consuming content, seeking short-term rewards, and feeling guilty, which ultimately leads to anxiety. People tend to use their phones more when they feel down or overwhelmed by difficult tasks. Despite the presence of built-in features like screen time and digital well-being tools, many users find that these tools don’t effectively motivate them to stay focused and limit their phone usage.
In case you want to check the detailed research, feel free to check it out here
✍🏽 Defining the problem statement
In today’s fast-paced world, students, job seekers, and employees are bombarded with distractions from all sorts of gadgets, especially smartphones. They often find themselves glued to their phones, always checking notifications, messages, and scrolling through short content for short term rewards. This addiction leads to decreased productivity and attention span, as they easily get distracted and waste precious time. As a result, they feel guilty, exhausted, and anxious about the time they’ve lost, which can hold them back in their studies, job hunting, or at work. Help users manage their phone usage and improve their overall well-being and productivity.
❓ Don’t have time to check out the complete case study?
Well, I’ve got you covered! Check out this video where I walk you through the hero features of the app.
😎 Seeking Inspiration from Competition
🧑🏽💻 Included Features
🧘🏼♂️ Focus Sessions:
- Users can allocate dedicated time slots throughout the day for specific tasks.
- Users have the flexibility to choose which apps and websites to block during their scheduled focus sessions.
- Upon successfully completing a focus session, users earn reward points. Additionally, exceeding the session duration yields extra reward points.
- This feature ensures that all distracting activities within selected apps are blocked during the focus session.
- Users can utilise this feature to create a focused and productive environment, enabling them to efficiently complete important tasks without distractions.
📱 App Limits
- Users can set time limits for specific apps to control their usage.
- When the set limit is reached, users will encounter a blocking screen upon attempting to open the app.
- App limits empower users to proactively manage their app usage and regain control over their time.
😄 Mood Logging
- Users can log mood after each focus session and at the end of the day for their app usage during the day.
- They have the option to select apps from a list of those they’ve used and associate them with their mood.
- This feature helps users in tracking and understanding how the apps they use may be influencing their mood, whether positively or negatively.
🛌 Bed Time
- With bed time, users can set their preferred bedtime and wake-up time.
- The feature blocks access to most apps during bedtime hours, minimising distractions.
- Essential functionalities like phone calls, messages, and select apps remain accessible.
- This encourages a consistent sleep cycle to enhance users’ mood and overall well-being.
📄 Analytics and Reports
- The app monitors users’ app usage, session duration, number of pickups, and more, offering comprehensive insights into their smartphone habits.
- Weekly reports will be generated, featuring data on the most frequently used apps, average screen time, average session durations, and identification of apps or sessions that has affected the user’s mood.
✍🏽 Inspiring and Motivating Content
- Focusly displays motivational quotes on the block screen, providing users with inspiration to resist the urge to use their phone when they’ve reached their app limit. Users can also set custom messages for additional personal motivation.
- Users are prompted to take a pledge within the app, helping them to solidify their commitment to reducing phone usage and staying focused.
- Encouraging empty state and confirmation messages throughout the app provide positive reinforcement and support the users in their journey.
🎮 Gamification
- Focusly incorporates a reward point and level-based gamification model inspired by games like PUBG.
- Users receive reward points for various actions such as onboarding, completing setup, session completion, mood logging, and meeting screen time goals, which are then used to level up.
- Users can engage in global or local competitions with friends to climb the leaderboard. The leaderboard resets weekly for fairness, but user levels persist to reflect ongoing progress.
- Spending less time on distracting apps and completing more focus sessions enhances users’ chances of reaching the top positions on the leaderboard.
👁️ Visualising the solution
🛣️ Onboarding
Well, onboarding is the very first experience the user is going to have with the app. Since the user is already feeling low with excessive screen usage and is expecting the app to help them come out of it, the onboarding needs to be motivating, up to the point and should not ask for any irrelevant inputs from the user.
Initially, in the onboarding process, I considered prompting users to choose their reasons for installing Focusly, offering five different options. However, I realised the app didn’t need this input; its purpose was simply to motivate users for being aware of their issues. Therefore, I decided to eliminate the reason selection screen and instead directly encourage the users for downloading Focusly.
👀 Check out the onboarding flow
🙋🏽♂️ User Guide
The user guide introduces three main features: Focus Sessions, App Limits, and Bedtime, designed to help users combat distractions and regain control over their time. It’s essential for users to explore these features thoroughly, so the home screen provides a quick start guide. When users choose to explore a feature, the app guides them to the relevant section and offers a quick walkthrough. This helps users navigate more efficiently and find what they need faster. Additionally, upon completing each task successfully, users earn reward points, contributing to their level progression, thus maintaining motivation throughout the guide.
👀 Check out the User Guide flow
😄 Mood Logging
The purpose of mood logging is to assist users in identifying apps and focus sessions that affect their mood either positively or negatively. This information can help users to make informed decisions about which apps to block and which ones to continue using. Likewise, it can help them determine which sessions are beneficial and which ones are not.
The users will get a notification and a prompt on the home-screen to log their mood at the end of the day few hours before the bedtime. I decided to nudge the user 1hr before the bed time because in the user research I conducted, the participants suggested that they would like to log their mood 1-1.5hrs before their scheduled bed time.
👀 Check out the Mood Logging flow
📄 Weekly Report
The app will create a personalized weekly report that compares the user’s screen time to their initial goal, shows the average time spent in sessions, categorises the apps used, and identifies apps and sessions that impact mood. It also compares the user’s progress with other Focusly users to motivate them and support their productivity journey.
👀 Check out the Weekly Report flow
✍🏽 Incorporating feedback from Usability Testing
I conducted a moderated usability test with a select group of potential users using Google Meet. This step was integrated into my design process once I had a functional prototype of the UI. This approach significantly enhanced my understanding of the user’s perspective on the app, as the test produced valuable insights.
👀 Check out other essential screens
🧠 My learnings
While working on Focusly, I got to learn about the user’s mindset and what makes them keep scrolling. As per the research I conducted, I learnt that people are more likely to spend time on social media when they are sad or feeling low. Also, when they have a complex task at hand which requires them to consciously use their senses to do the task, after few minutes, they often find themselves using their phones. So, handling the urges and managing it can help them get out the loop of short term rewards. In order to come out of an addiction, people need to realise, visualise and cultivate internal motivation.
During the entire period, I deeply empathised with this issue and spoke with numerous individuals about the impact of smartphones on their lives. It’s astonishing how smartphones are drastically altering our lifestyles, making it crucial to control their usage.
Apart from the user’s mindset, I gained experience in conducting and moderating usability testing, which provided valuable insights into user behaviour. I also learned how impactful content can inspire and foster a stronger connection with the user.
👀 Observations from real life
In my surroundings, I’ve noticed that 10-month-old children only eat their food when they’re shown YouTube videos on smartphones. I’ve also observed that children who use smartphones tend to become introverted over time, struggle to develop strong communication skills, have difficulty focusing for extended periods, and get easily irritated by minor things.
It’s not only limited to children, young adults and old people are also addicted and glued to their phones missing the real essence of life.
And that’s a wrap…
In case you are interested to check out my work, please feel free to check it out:
Research | UI Design | Prototype
🤝 Let’s connect and build a meaningful network:
💼 Want to discuss about a work opportunity? Drop a mail at
sahuraghabendra200@gmail.com or DM me on Linkedin
