Focused
What is Focused?
Focused is a mobile, web and desktop application which helps users manage their screen time and be mindful about how the use their digital devices.
How it all started?
Like most people, I had to prepare for the CAT exam from home due to the pandemic. Since my notes, classes and exams were online, most of my preparation had to be done on my phone and laptop. However, at times I found it very difficult to focus on my preparation due to the endless distractions on these digital devices. This made me think that there are probably a lot more people with the same problem. It might not necessarily be students preparing for exams, but freelancers or anyone trying to work from home could be facing this issue.
Tools used:
Adobe XD, Figma, Miro, Canva, Uizard
Problem Statement
Users are unable to focus fully on their work due to multiple distractions on their digital devices
Design Approach
Research
Analyze
Design
Test
User Research
Step 1: Participants selection
To gather more information on what and how users felt, I decided to conduct user interviews. Before conducting user interviews, I decided to screen the participants to select the appropriate target audience. I prepared a survey which contained a few screening questions and floated it to the participants. From the 31 respondents, I selected 8 candidates who could be potential future users. I used “high screen time usage” and “people who feel they should reduce their screen time” as parameters to select the interview candidates.
Step 2: User interview
I conducted user interviews with the selected participants to understand their requirements, challenges and also to discover design opportunities. Out of the 8 interviews, 4 were face to face, 3 were telephonic and 1 was through video call.
Step 3: Interview analysis
After the interview, I documented their responses in Miro for further analysis. I categorized the responses into needs, goals, emotions, solutions adopted, routines, and other characteristics. The below is a snap of the affinity diagram of user responses.
.jpg)
Affinity Diagram of User Responses
User Personas
From the above affinity diagram, I was able to identify two main types of user. For each of these user types, I created a detailed user persona.
Features
After analyzing the personas and all the user data , I summarized the major user needs. This helped me to define the features that could solve the user's pain points.
Tasks
Based on the above features, I decided the list of tasks that an user might have to perform. This is a very basic list and the number of tasks will increase after iterations and usability test.
Task Flows
I created task flows for all the tasks mentioned above. Here is a snap of the task flows for the tasks under the heading "Website / App blocking related".
Wireframes
After defining the task flows, I created wireframes for the app. Here are a few snaps of wireframes for different screens and task flows.
Main screens
Creating new session
Editing a session
