Diopter Calculator Web App

This past week I’ve been working on a web application that can estimate your diopters.

Right now I have a deployed prototype, which can be found here: https://em-ui.herokuapp.com/


  1. First you have to calibrate based on the camera you are using. So fill out the distance you are from the camera in cm.
  2. Next fill out your pupillary distance in cm.
  3. Then click the “Calibrate Focal Length” button. This should give you a focal length. Keep trying if it doesn’t.
  4. Next, move yourself away or toward camera finding the edge of blur.
  5. Finally, click the “Estimate Diopters” button. This should give you a reasonable diopters measurement. If not keep trying or repeat from step 1.

For example: I measure myself 70 cm away from the web camera. Then I fill out 6.8 cm for the PD. Calibrate. Then move back and click estimate.

This far from perfect but seems to work decently at times. It depends on the camera I believe, but a focal length around 500 or 600 should be displaying after calibration.

  • Tip: Make sure are looking straight at the camera and your head and eyes are clearly visible in the image and the lighting is good.

Also, this is deployed using a free server so the response time will be slow and loading the app initially could be really slow if the server has gone to sleep. Please be patient.

The state of the frontend is stored in the user’s browser. The backend application is stateless, meaning no image or data is currently stored.

I’d love to hear some feedback. Thanks.


Great work!

Community programmed apps are always great @jakey

Its not working for me at the moment. maybe the server is down…

1 Like

Cooool! The two variables though … maybe we need the phone app to figure out the screen distance first? :slight_smile:

1 Like

Yeah unfortunately I couldn’t find a packaged depth estimator feature for the web like the phone app has with its augmented reality kit and fancy cameras. There may be something if I look harder but it would be experimental at best.

Therefore I had to use something called triangle similarity, which requires first getting the camera’s focal length using the known distance away from the camera and the width of the object (in this case the pupillary distance).

1 Like

It’s still pretty cool for sure.

1 Like

I can’t figure out how to edit the post above, so I will put my updates as replies.

Update 1/28/2021:

  • Boosted the app’s performance by paying for the server (~$14/month)
  • Now storing the calibration data in the user’s browser (localStorage), so that returning to the app loads this saved data and prevents having to recalibrate.
    • Data should remain in browser cache until cleared by the user
    • As long as the camera and angle of the camera remains the same, this should be fine for the resulting estimates; you can always recalibrate if you believe it is off