EyeCare
Web app that supports users in creating habit of taking regular computer screen time breaks to alleviate eye strain.
Problem Background
During the COVID-19 pandemic, many workers shifted to work from home and increased their computer screen time. Our team wanted to better understand the various physical and mental struggles people working from home experience in relation to their computer screen time consumption.
Research Insights & User Pain Points
We conducted 15 remote virtual user interviews with individuals ages 19-35 who were working from home to learn about behaviours and attitudes related to their computer screen usage. We concluded that 33% of users spent 6-8 hours on a computer per day, 50% spent 8-10 hours and 17% spent 12-14 hours. 60% of participants stated that the longest period of time they could work at their computer without taking a break is 2-3 hours, while 40% stated 4-5 hours.
User Feedback
Our preliminary research concluded that the most common pain point was spending prolonged periods of time in front of a computer screen and as a result, developing physical irritations. The most common pain point was eye strain.
Solution Explanation
Our solution encourages users to take regular computer screen breaks to reduce their eye strain. The EyeCare web app pushes scheduled notifications to remind users to take a screen break. Users are prompted to incorporate the 20-20-20 rule. Studies have shown that the best way to reduce eye fatigue is to follow the 20-20-20 rule. When you’re working on a computer, take a break every 20 minutes. Look at an object 20 feet away for 20 seconds to give your eyes a chance to relax.
Lofi & Hifi Mockups
Iterative Design Learnings
After we showcased our prototype to the users again, we learned that we needed to level up the fidelity of the designs, including adding a color palette. Additionally, we needed to scale down our MVP and focus on one screen for the web app. We also removed the option for users to see data from their previous sessions.
This allowed for developers to omit the need to store and organize large amounts of data. We prioritized four features; track a user’s total screen time consumption, track how many breaks a user has taken in a session, customizable push notifications and the ability to pause/play notifications.
Implementation Details
Technical implementation
- Language: React
- Framework: Reactjs
- APIs: ReactPush Notifications, Socket.io
- Storage: Firebase
- UI: Bootstrap, Material UI, Animate.css, Figma, Miro
- Deploy: Github pages, Vercel
- Charts: ApexCharts
Future Steps
From speaking to users about our product, we learned that turning our product into a Chrome extension would seamlessly integrate our product into users’ everyday computer use.
We will not be continuing this project, however we are very proud of the hard work our teammates put in the past 7 weeks.
Learnings
Product Manager Learnings:
Aleksandra R.
As a Product Manager, I learned the importance of being organised and clearly communicating with all team members while organising sprints. I also learned the value of vertical slicing when building a product under time constraint.
Designer Learnings:
Allegra Glatzer
As a Designer, I learned that it’s imperative to conduct transparent conversations with developers in order to properly hand off designs. I learned that the more detailed comments about feature designs, the better to achieve a seamless handoff. Additionally, I learned to strategically design our MVP first, instead of thinking about the nice-to-haves.
Designer Learnings:
Jo Sturdivant
- Adapting to an Established Team: Joining the team in week 6 of 8 was challenging, as I had to quickly adapt to existing workflows, dynamics, and goals. This mirrors real-world situations where you often integrate into teams mid-project, and flexibility is essential.
- Work-Blocking for Efficiency: With only two weeks to complete the project, I learned the importance of a structured work-blocking system. This approach allowed me to manage my time effectively and meet deadlines under pressure.
- Making Data-Driven Design Decisions: Unlike my past projects, I had to rely on research conducted by others. This was a valuable experience in using pre-existing data to guide design decisions, helping me focus on the core insights without starting from scratch.
Developer Learnings:
Mfon Nta
Developer Learnings:
Vanady Beard
&
As the back-end developer, I learned how important it is to create efficient and reliable systems that support the entire application. This experience also taught me the importance of optimising the database and ensuring the backend is scalable and easy to maintain.
Developer Learnings:
Stephen Asiedu
&
As a back-end developer, I've come to understand the importance of being familiar with various database systems and modules. This knowledge enables me to build diverse applications and maintain versatility in my work. I've also learned that the responsibility for making the right choices rests on my shoulders, guided by my best judgement.
Developer Learnings:
Fisayo Takuro
&
Developer Learnings:
Maurquise Williams
&
- Process of Creating an MVP: Developing a Minimum Viable Product (MVP) taught me how to focus on delivering core functionalities balancing between essential features and avoiding scope creep.
- Collaboration in a Real-World Tech Setting: This experience taught me how to collaborate efficiently in a fast-paced tech environment, keeping the team aligned and productive, even while working remotely across time zones.
- Sharpening Critical Thinking and Problem-Solving Skills: This experience honed my ability to think critically and solve problems efficiently. By tackling challenges and finding quick solutions, I sharpened my decision-making and troubleshooting skills in a dynamic, real-world setting.
Developer Learnings:
Jeremiah Williams
&
All in all this experience was very awesome I learned that in coding with others being transparent is key
Developers Learnings:
Justin Farley
&
I learned how important communication is when working with a team. Communication provides understanding, advice, ideas, and much more. While working with the product team, I’ve found that communication keeps everything flowing smoothly. Working with a team also showed me that every member brings something different to the table and we all have to work together in order to align and meet our end goal.