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


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.  





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



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



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.



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


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:



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




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%. 


  • 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.