Recently my wife did a Halloween photo-shoot and shortly after was given the task of picking the top few photos from the shoot she wanted to pay to have post-processed and printed. Of the 350+ photos taken, she was able to narrow it down, by picking the best of each series, to about 20 photos; the problem being she needed to pick 7.

After a lot of conversation and frustration trying to pick which ones were the best, I drew some inspiration from the movie The Social Network and particularly the part where Mark uses the Elo Chess Rating system to rank girls that went to his school. I figured, the elo rating system is a well known problem, and all I need is to upload a set of photos, randomly pair them together, and iterate until the scores find the best ranking of photos.

Making the tool reusable and accessible to my wife was a priority, so I decided to build a single page web application to do the lifting. Browsers can natively take uploads and display photos, so all I needed was a way of randomly pairing the photos together and allowing select. Bonus points for keybinding so a user can just pick left or right using the arrow keys intead of having to use the mouse.

As with most browser projects these days, my first choice was Elm, mostly for the development experience. A few parts, namely file handling and random generation were a little difficult, but nothing I havent dealt with before in Elm applications. Overall the project took a little bit more than 4 hours to complete, and can cloned from https://gitlab.com/mc706/elm-elo-photos/ or used at https://mc706.gitlab.io/elm-elo-photos/.