Thea:

Pre Screening for Diabetic Retinopathy



My roles: Lead product designer, front-end developer

*Thea started as a project developed for Boston TechTogether 2020, where it won Best Software Design, Best Education, and Best Human Progress awards.

Read the full case study here




CONTEXT + RESEARCH


Diabetic retinopathy (DR) is the leading cause of blindness in American adults.
Diabetics who suffer from this condition are recommended to visit an ophthalmology office every 1-4 months




Traditionally, DR is identified via Fluorescein angiography– basically, an invasive and super uncomfortable procedure that requires injecting dye directly into the eyeball to make the blood vessels more visible.

Emerging literature suggests Smartphone Fundus Technology is a simple way of obtaining high-quality retinal scans using just a smartphone camera and a handheld ophthalmoscopy lens.

Diagnosis for DR used to be painful and invasive, but recent technology has made imaging simpler, to the point where you can take a retinal scan using your smartphone.  




 

SOLUTION THINKING



🧐


Problem

DR is a chronic disease that requires many trips to the eye doctors office 

🧠


Insights

How can we empower patients to monitor their disease at home?

🤩


Solution

Build a smart pre-screening tool that assesses user risk


Thea is a machine-learning based web app that acts as a pre-screening diabetic management tool for patients with diabetic retinopathy.

    1. Visual acuity test

    This is similar to the test you’d take at the eye doctor’s office with the E’s facing every which way– except we digitized it.

    2. Lifestyle survey

    Since DR progression depends on key holistic choices, we ask patients several questions to assemble a more comprehensive understanding of their risk assessment. 

    3. ML-based retinal scan predictor

    A patient would obtain a retinal scan and upload the image to Thea, which would assess the severity of DR progression using ML technology.



GOALS + OBJECTIVES



⭐️


Develop a user friendly tool for diabetic people to monitor their progress at home

⭐️⭐️


Provide a personalized holistic assessment for each patient

⭐️⭐️⭐️


Promote early screening/detection of DR to mitigate the chances of vision loss





BRANDING




I explored several icons and typography styles for Thea’s logo in order to find a one that feels modern and clean.



This is the final logo we came up with:




WIREFRAMING


V1 



We decided to make Thea a web app considering the ease of visibility of a larger screen for vision-impaired DR patients.


V2


V3 




FINAL UI


Landing page developed using HTML5, CSS3, and Javascript.










The results screen displays the patient’s progressiveness of disease in an easy-to-understand way– by using emoji faces.

The green emoji would indicate the patient is likely low risk for diabetic retinopathy, the yellow emoji would indicate the patient is likely medium risk, and so on.



The final model correctly categorized retinal scans at an accuracy rate of ~85%. 



CONCLUSION / KEY TAKEAWAYS


  • Prioritization of aims is important– as much as you want the product to be ~aesthetic~ it must first be functional.

  • When it comes to web development, what you think may take you one hour will likely actually take you three.

  • MVP first– especially in the context of a time constrained project.