Focus To-Do is a time management app that combines To-Do list with the Pomodoro Technique - one of the most popular productivity strategies.
A story about why I chose this app to redesign...
As a second-year master student, one of my challenges is to balance our time among submitting assignments, seeking jobs, and having fun. One day I was chatting with 5 of my friends about how to squeeze more time out and have a grad trip. We accidentally found out that 4 of us had used Focus To-Do before with the hope of having better time management. However, none of us achieved the goal by using this app.
TYPE
Individual project for usable design course
KEY SKILLS
End-to-End UX Design, User Research,Product Strategy, Competitive Analysis
TIMELINE
3 month (Jan-Mar 2020)
TOOLS
Sketch, Pixlr
01. Overview
PROBLEM STATEMENT
How Focus To-Do can help people build their time management habits?
As a multitasker, I constantly try different productivity applications to improve my time management skills. Yet, I haven't found an application that has helped me to successfully build good habits.
How could I overcome this challenge and also help others in a similar situation? I started to think about redesigning Focus To-Do, a fully functional time management app that failed to keep me loyal to it.
SOLUTION
Turning virtual efforts into real-world rewards: using coupons to motivate users.
I began the project by understanding the market and interviewing users for deeper insight. Defining the problems and researching relative documents to create a solution concept. With the concept in mind, I visualized the ideas and iterated the design, which led me to deliver the final solution.
02. Research
COMPETITIVE ANALYSIS
Looking into the market, trying to find inspiration and gaps among the existing products.
I used Appfollow, an application insight tool, to look into the app market and find competitive apps. Then chose 2 most similar apps that are in some way better than Focus To-Do to do the analysis.
A screenshot from Appfollow dashboard.
Focus To-Do
Pros:
- Have more competitive time management relative report
- Have To-do list
- Have laptop version
Cons:
- Task and timer need to be set in seperate page
- Unclear timer setting method
Be Focused
Pros:
- User can setup the task and timer in the main page
- Have to-do list
- Have laptop version
Cons:
- Too many advertisements
- Interface design is over simple
Focus Keeper
Pros:
- Clear timer setting method
Cons:
- Do not have to-do list
- Do not laptop version
What are the products in the market now?
Combining their pros, a good app should have
1) the to-do list and time management relative report.
2) clear setting function for users to set up the timer and task.
However, none of these apps provide a function to help users build up time
management
habits.
"As a designer, I know that I shouldn't design for myself. I cannot assume that the problem is widespread enough that it's worth the effort to design something to solve it."
INTERVIEWS & PERSONAS
Thinking from the users, discovering their needs.
To quickly understand whether this is a problem worth solving, I tried to understand more about the challenges that arose while people use this kind of mobile application. I conducted quick, semi-structured interviews with 5 random people and came up with the persona.
What are the users' needs?
For new users, it is a challenge for them to build up the routine to use the time management app; while for people who already have time management habit, they hope the app is easy to use and can provide have time analysis report, allowing them to track and improve their skill better.
ONLINE REVIEWS & JOURNEY MAP
Back to the product, what is the gap between user goals and pain points?
With users' needs in mind, I started to look back into Focus To-Do. Looking at the entire experience from user's standpoint, thinking of the problems it may have, and also identifying some potential opportunities for the product.
I also read through online reviews on both Google Play and App Store to make sure that I have covered all the problems of this app.
What are the problems for Focus To-Do?
Problem 1: Unintuitive and confusing user experience.
Inefficient ways of presentations make the majority of the information displayed on
the main page irrelevant to user needs.
The overused icons without any explanation also create obstacles to users. The
unintuitive design hurts users' experience, which in turn
leads users
to switch to other time management app.
Problem 2: The theme colors limit potential users.
Theme colors and the app style are also two of the main concerns for users
when deciding to use the app or not. The bright pink
color themes
for this app had reduced some users' willingness to use it.
Problem 3: Cannot help new users to build up the time management habit.
Lack of
consistency and
motivation are two of the most common problems that stop people from pursuing a
new
habit. As a human being, it is natural for us to revert to familiar structures.
Building
a new habit usually often takes extra effort, and people tend to avoid
effort.
03. Ideation
BRAINSTORMING
To turn problems into opportunities.
After understanding the problems, it is time to think about how to use design to turn problems into opportunities.
" How to make the design intuitive? "
INSIGHT 1: DESIGN FROM MENTAL MODEL
Lack of visual content and
unfriendly flow design create obstacles to users. Designed based on users'
mental models.
Simplified the user flow and reorganized the information is the solution.
" What is the color that can be accepted by more users and also is a color that can help users to focus? "
INSIGHT 2: DESIGN FOR EVERYONE
After researching, the neutral tone is
my answer. With a high
acceptance, the
neutral
tone also provides a calming effect which is a plus to concentrate.
" How can an application help people build up a habit? "
INSIGHT 3: DESIGN FOR HABIT-FORMING
There is a 3R principle
(reminder,
routine, and reward) for building and maintaining
habits.
The app already had the first two R's, so my solution focused on “reward" to
attract and
motivate users to keep managing their time with this app. I created a new coupon
feature,
letting users earn real-world discounts by accumulating their focused time.
04. Prototype
SKETCH
Visualize the ideas.
Based on the insights I had come up with, I started to think about the opportunities that I
can turn the
ideas into reality and sketched them up quickly.
- Redefining the countdown timer on the main page.
- Recategorizing the information and reorganized the list page.
- Redesigning the adding function.
- Replacing bright pink colors to neutral colors
- Created a new coupon feature, so people can use the focusing time that they
accumulated to exchange to real-world discounts.
PROTOTYPE
Think key elements into detail.
After defined and design the main function of each page, I began mapping the new user journey. Thinking about the user flow and also creating more details for each page.
USABILITY TESTING
Test with users to make sure the design is following the mental model.
Followed Steve Krug’s template and KJ analysis as my usability testing,I hold the test and analyzed the result in order to make the solution close to users' mental models.
REPEAT
Iterate to have a better solution.
I iterated the design from time to time by acting on user feedback. The iterations covered from a page layout to a simple small piece.
05. Design
DESIGN GOAL 1
Simplify the user flow and use more neutral colors to raise acceptance.
Reduce 3 clicks to 1 click
This design reduces users' cognitive load when they start a task timer. According to
previous
research, users feel lost when they want to create and start a task. Moving
the timer to the first page, users can now start a task
timer simply and quickly.
Create dark/bright mode
With the thought in mind of using more neutral colors, this design provides white and
black
background colors for users to choose from.
Add a navigation bar
The navigation bar provides users with a clear concept about what this app has and where the
functions are. Users can now use the function they want directly.
Before
After
DESIGN GOAL 2
Intuitive design and functions.
Use labels to clarify unique icons
In this version, I created a new page for creating new tasks. Since this is one of the most
frequent functions used, the information and functions should be expressed
clearly.
By putting relevant information into a list, users now know the meaning of each icon and how
to
adjust them.
Before
After
Reorganize the information
I replaced the date list with a drop-down calendar and combined it with the To-Do task
page.
This
simplifies the user flow and also makes the information easy for users to understand.
Before
After
DESIGN GOAL 3
Create a coupon feature to help users form a habit.
Turn focused time into real-world discounts
I created a new feature -- coupons.
After one hour of use, the user is rewarded with 1 point. And the Points can be exchanged
for coupons. So users can enjoy the rewards for their hard work.
CROSS PLATFORM SOLUTION
Users can focus anytime anywhere.
