Coloroid Mini

The brightness algorithm described in Bright & Proper can now be tested out in Coloroid Mini, the smallest, most private image processing app.

Coloroid Mini: A temporary interface

Coloroid Mini is less than 700 KB  300KB. It's currently 256 KB.

Coloroid Mini has 30 filters, 7 adjustments, tools such as rotation, image size, and cumulative mode.

Coloroid Mini is written in Javascript and works on all modern browsers. Mobile Safari is not one but it now works there as well.

Coloroid Mini works best on Firefox OS. #foxyeah

Bright & Proper

My husband was curious about how to make his photos look brighter with code while I was away so he grabbed a star studded algorithm from someone on github and then came to me after it didn’t work like he thought it would.  

The star studded algorithm (it had at least a billion github stars) was just adding integers to the individual RGB values. In other words, it was doing: r = r + 30; g = g + 30; b = b + 30; 

The reason why adding integers to the individual RGB values does not produce the brightness results that a serious photographer might expect is that each value contains information not only about the brightness of each pixel but also about the saturation and the hue. 

In order to obtain information about only the brightness of a pixel one must convert to a space that has separate channels for hue, saturation, and brightness.

The image in the middle below is the original image that my husband wanted to brighten. The image on the right side is produced using the star studded algorithm from github. The image on the left side of the original is what my husband was expecting to see.

Night and Day

The image on the right side may seem brighter to the untrained eye, but it is also less saturated, and the hue is off.

It is easy to achieve the image on the left from the image on the middle with a proper brightness function, provided below in Javascript.

The rgb2separate_channels() and separate_channels2rgb() functions below could be simply rgb2hsv() and hsv2rgb() used in previous examples in this blog, or they could be something fancier.