Breakful

Time reminder extension

Timeline

June - July 2022

My Role

- Research           
- UX Design
- Visual Design

Team

- 1 Product Manager
- 1 UX Designer
- 2 Developers

PROBLEM

How can we simplify the process of taking breaks for people who work at home so that they can take more restful breaks and are inclined to continue taking breaks in the future?

COVID-19 has severely altered the way employees and students work. Although this style of working has its benefits, there are a few downsides to this such as burnout, lack of community, and lack of motivation. A problem we have seen is the lack of breaks people take during their work day and the feeling of exhaustion afterwards.

This could be partly due to the fact that working in an office creates a separation between your personal life and work life. However, at home, the lines between your work and personal life get blurred. We suspected that people are not taking enough breaks at home, or their “breaks” are not very restful.

DESIGN PROCESS

Investigation & Research

COMPETITIVE ANALYSIS

3 time reminder chrome extension

I worked with the project manager to see what’s the trending time reminder chrome extensions, and downloaded three of them to experience how we feel while using them. After tryout them ourselves, we pinned our ideas together for an affinity mapping to collect ideas for future design.

Insight 1

Customize break timing

Let users to customize break time less than 30 seconds.

Insight 2

Clear Treatment Info

Different categories to let users fully relax during the breaks.

Insight 3

Not Efficient UI design

To avoid time conflicts that come between taking breaks and having online meetings.

USER INTERVIEW

9 interviews: > 60% people who wfh struggled with time management

While conducting our own user research, we found that more than 60% of people working from home struggled with time management - they find that they are “rushing” to get back to work while on breaks, and thus don’t take restful breaks. Not having “breakful” breaks can result in numerous problems such as burnout, declines in mental health and physical health, and decreased productivity.

After interview, we identified 3 main pain points

Pain point 1

Feels rushing back to work

Not having “breakful” breaks can result in numerous problems such as burnout, declines in mental health and physical health, and decreased productivity.

Pain point 2

Conflict with work schedule

This is a problem because people feel rushed during their breaks, unsure of when their next meeting is or if they have unfinished work.

Pain point 3

When to take or disable breaks

People have busy schedule when working from home, so they should have the options to choose when to take breaks or disable them.

USER PERSONA & JOURNEY MAPPING

Meet Cam! One of our user:

The problem now is that there is not an effective solution that promotes taking breaks while taking into account people’s work schedule. This is a problem because people feel rushed during their breaks, unsure of when their next meeting is or if they have unfinished work.

Design Solution & User Flow

DESIGN SOLUTION

Breakful : A time reminder for breakful breaks

Key feature 1

Connect with Google calendar

The ability to connect to your google calendar and schedule breaks directly on your calendar.

Key feature 2

Notifiable break timing

Users will be notified of when it is time for their break and have a timer to indicate the amount of break time left

Key feature 3

Provide content for break

Users are able to choose what they want to do during their break and will be provided content to watch depending on their choice of activity

Before using Breakful, you are exhausted with those virtual meetings. You could only rest between them, and feel rushing to go back to work.

After using Breakful, you will be alerted 30s before the break. A full-screen notification lets you know how much time left. A sound alert will show when break ends, so you won’t need to look at the timer all the time.

USER FLOW

A easy flow during a busy work day

Users will easily sign in Breakful by signing into their Google Account, which will connect connect their Google calendar with Breakful. Before starting the busy day, the user could choose when and how to take breaks by easily selecting given options on Breakful. Then the user could start enjoying breakful breaks during a busy work day.

Wireframe Design & Visual Design

LO-FI DESIGN

Schedule time

1. Connect with user’s google Calendar to     help them better decide when to take       breaks

2. Let user choose the time and date for     each break

Break content

1. Let user choose duration for the break

2. Let user choose/customize the content     for the break

3. Let user choose to turn on/off sound     notification and full screen notification

Confirm break

After setting up the break, it will show on the calendar.

Notification

After the user sets up breaks, the chrome extension will show the time till next break, and will let user to skip or postpone the break.

DESIGN GUIDE

Teal:  a relaxing color pattern for time reminder

When setting up the color pattern and tone for Breakful, we are thinking of something that makes people feel relaxing, and will not cause panic or anxiety. After researching and testing, we decided to go with the teal: a mix of green and blue:

HI-FI DESIGN

Landing page

Schedule time

Choose content

Confirm break

Break time!

Break content

Next break alert

REFLECTION

Agile Working in a cross-functional team

1. Be reliable and flexible when working with developers and managers
‍
2. Always focus on the main goal, remember to make the solutions based on the research, not intuition
‍
3. Coordinate with developers with feasibility at early stage of design, and be flexible to adjust design in different iterations
‍
4. Provide clear design system (color pattern, iconology, font) for developers

Want to learn more? Let's connect!
LinkedInResume
© 2024 by Can (Sunny) Sun