Open-source rapid gel imaging in the browser, developed with support from Prof. Anderson at UC Berkeley. Optimized for GelGreen® nucleic acid dye.
- Put a blue filter over your phone flashlight for best results. The specifics don't matter, but ideally transparent enough for significant blue light to pass through. The better quality the filter, the better your images will turn out.
This was taken with blue plastic cut out of a $2.00 subject divider:
-
Go to https://jakebildy.github.io/SnapGel/ on your phone. Works best on Google Chrome using Android - for iOS use Safari, and make sure you've enabled 'Camera Permissions' in Settings. Some iOS versions don't work with 'getUserMedia'.
-
Put your phone over the gel and take a screenshot when the camera focuses.
-
That's it!
SnapGel works by getting an image stream from a mobile device, and manipulating the pixels in such a way that the gel bands are rendered visible.
The algorithm works something like this:
- Iterating through every pixel, convert the RGB values into HSL (Hue, Saturation, Lightness)
- Scale the saturation by a factor of four
- Reconvert into RGB
- Set the B value to 0 (removing the illumination from the flashlight)
- Remove flashlight glare
- Multiply the G value by 0.5 to reduce the general blue-green let in by the filter (GelGreen emits enough yellow not to be affected)
- Convert to black and white
• Select a better filter than a cut-out from a subject divider.
• Improve image optimization by reducing the contrast at the end result.
• Improve capability to run on iOS