Eye Fresh

Problem Space

Problem Background  

Digital work is the norm, but the scale of our screen time may cause some surprise. People spend about 44% of their waking hours in front of a digital screen (Howarth). Assuming people get about 8 hours of sleep a night, 44% of one’s waking hours spent on a screen is equivalent to about 7 hours of their day. That’s a lot of screen time. All this digital time can have negative implications on our health. In fact, 2 out of 3 Americans have reported that they have experienced digital eye strain in their health history (Chu). Cedars Sinai Medical Center has identified symptoms of digital eye strain to include “eye discomfort and fatigue, dry eyes, blurry vision, and headaches”, all of which are symptoms that negatively impact our day.

Problem Statement

How might we encourage people to take more visual breaks from their screens throughout their workflow? 

Research Insights

User Pain Points

To get a better understanding of others’ computer screen usage and digital work habits, we conducted an online survey with 31 respondents and interviewed 3 people. We focused specifically on researching participants’ computer screen usage and computer work habits to reduce any distracting findings from other digital devices (smartphones, tablets, etc.). 

According to our survey, over 83% of respondents reported that they wished to incorporate more breaks throughout their working sessions. Our user interviews uncovered the following interesting points:

• People tried working with a Pomodoro strategy (this is a time management practice where you work for a chunk of time, then take a scheduled break, and repeat that cycle). Often times, people didn’t honor their breaks and kept working 
• People needed tools that are intuitive and configurable to tailor to their working style 
• People wanted to focus on their work with minimal distractions and notifications. They only wanted to allow in relevant notifications without “derailing” their workflow

Our survey also found that the majority of computer users are between the ages of 18-35 who work on their computers more than 4 hours a day. Due to their high computer screen usage time, this audience would benefit the most from implementing visual breaks in their workflow. 

Solution Explanation

Eye Fresh is a Google Chrome extension to remind users to give their eyes a break. Eye Fresh is designed to help users apply the 20-20-20 rule to their workflow. The 20-20-20 rule is a guideline which advises that for every 20 minutes spent on a digital device, the user should take a 20 second break and look at something 20 feet away. Applying the 20-20-20 rule is intended to reduce digital eye strain caused by looking at digital screens for extended periods of time. 

Based on our target users’ pain points and time limitations of the 8-week COLAB bootcamp, we decided to prioritize the following features:

Ability for users to set a timer for work time before getting their visual break

• Users need to be able to set how long they want to work before receiving the notification that it is time to take a visual break 

Ability for users to receive their 20 second break timer after their initial work time is finished

• The break timer must be functional without action from the user because the goal of this timer is to take a visual break - the user shouldn’t be on their computer, or looking at their computer screen at this time 

Ability for users to access an On/Off toggle for the Google Extension

• Users need to be able to enable and disable the Google Extension for when they deem it is necessary to use the tool

Simplistic design of the Eye Fresh pop-up window

• Users disliked being derailed from their workflow, so the design of the pop-up window had to be simplistic and minimal so that it didn’t distract the user from their overall goal of doing good work 

Based on our initial research with our users, we identified the following features that would be nice to have in Eye Fresh: 

Ability for users to customize the sound notification for their break alerts

• Customization is a feature that users preferred and expected from their digital tools 

Ability for users to see a notification indicator to show that it is break time in the Google extension bar

• Users reported that they like to allow in only relevant notifications while working, so having a notification indicator is another feature that users could benefit from if they preferred not to be interrupted by a pop-up window

However, since these features are nice to have, and not critical to the functionality of the overall Eye Fresh extension, our team decided to deprioritize these features due to the time constraints of the 8-week Co.Lab bootcamp. 

Lofi & Hifi Mockups

Lofi Mockups: 

Hifi Mockups:

Iterative Design Learnings

Our team used Maze to gather asynchronous user feedback for our MVP. We also conducted 5 moderated sessions with users where we gave them access to the Google Extension and observed how they interacted with the Google Extension over video chat. 

In both Maze and the moderated sessions, we asked users to perform the following tasks: 

Open the Eye Fresh extension from the google extension bar in the browser

• 92% of users successfully opened Eye Fresh 

Configure the timer settings

• 83% of users successfully configured the timer settings

Save the timer settings 

• 83% of users successfully saved their timer settings

In both Maze and the moderated sessions, we asked users to provide their thoughts and feedback after their interactions with Eye Fresh. We discovered that 83% of users’ first impression of EyeFresh is that it is “simple” and “easy” to read, or access. 

The users also provided feedback about the display/design of the Eye Fresh extension. Some users wished there was less clutter, different placement for certain elements, or wished the colors were different. Additionally, some feedback was provided on how the user wished the timer was displayed. 

Given the short timeline of the Co.Lab bootcamp, our team wasn’t able to prioritize and implement solutions to the display/design feedback given by the users. However, if given more time, our team will use this feedback and prioritize iterating Eye Fresh so that the features follow accessibility standards. In doing so, Eye Fresh would be closer to becoming a simple, intuitive, and user-friendly tool in one’s workflow.

Implementation Details 

Technical implementation

Where is it hosted? 

• Chrome Web Store

What is your tech stack?

• HTML, Tailwind, Javascript

Technical challenges

What was the hardest part of development?

Building two countdown timer alarms (one to track the work time, the other for tracking the break time)

• Developers had to learn how to store the timers on Chrome Storage
• Ensuring the timers behaved as expected

One of our technical challenges was learning how to build a chrome extension while trying to make sure enough progress is being made 

• No one on the team built a Google Chrome extension before, so it was an interesting process for the developers to learn how to build an extension on the fly while ensuring that ample development progress was being made on the user stories for Eye Fresh 

What are some key takeaways?

Build important features first and make sure it works well before trying to add more 

Coordination and communication with a team is important when building a collaborative project 

• Our team provided daily asynchronous updates via Discord 
• Our team met 3x per week to collaborate over video call

Teamwork is very important as well as resilience

Future Steps

At this point in time, our team is willing to continue collaboration after COLAB17 ends to ensure full functionality of the work timer as well as the break timer. Once the timers are fully functional, our team will check-in with one another to discuss how much further everyone is comfortable with continuing the Eye Fresh project.