Wups, it seems you forgot we are in 2022!

You are using a browser that is older than 6 years. In browser years, that's like 1000. I can only advise you to updgrade it so that you can enjoy today's internet properly.
Join today's internet

Building a planet visualizer for MoMA-sold watches

Project skills: HTML Canvas, AWS

Auteur watches had a bold vision for a unique custom watch to be sold at the Museum of Modern Art of New-York: choose a special date, and the position of the planets on that day will be engraved on the dial. I build the mobile site and e-commerce plugin creating animated and shareable previews of the planets' positions based on the date chosen by the user.

The vision was simple: take the custom-watch one step further.

Instead of an invisible engraving of a date on the back of the watch, the whole dial would subtly and visually remind the wearer of their special day. What more unique, powerful and poetic than the planets' positions on that chosen day?

The Ephemeris watch by Auteur was born, to be launched via a kickstarter, and sold among other places at the MoMA store.

I was tasked with the implementation of this vision: users would pick a date, instantly see how the planets were aligned that day - both on a cartoonish visual and a preview of the final watch - and place an order once seduced by their creation.

Computing the planets' positions

On the opposite of what one might think, the planets positions - with their continuous mutual interactions - is a very difficult matter to compute. Even today, we cannot calculate with perfect certainty further than some centuries in advance. It follows that my first task was to find an existing library that could approximate the positions of the planets on any given day.

Once I did, and after reading a fair bit on the many, many parameters involved to describe a planet's orbit and trajectory, I figured out how to approximate the angle at which the planet was with an heliocentric model. The radial angle at which planets are at a given time, so that Earth is always at 0° (as on the Ephemeris dial) is obviously not something that is used anywhere else - so a fair amount of trial and error of mathematical formulas was needed.

Drawing and animating the planets on the canvas to create shareable images

The next step was logically to use the above formulas and plug them in an HTML canvas that would animate the planets to rotate at the computed positions when the user entered a new date. This would then let the user toggle between the two previews: cartoon and actual watch, with the added possibility to select and preview the wristband option too.

At this point, the user was to be able to share their creation, with a custom message, to their social media. Obviously, this created a bit of a technical challenge once again: the created canvas was running and updated only on the users' device. Thus, I implemented an automated AWS integration: every time the user inputed a new date and some idle time had passed, a dump of the canvas was stored publicly as an image in an S3 bucket (but with a unique hash for privacy), resulting in a non-guessable public URL linking to that specific creation: date, planets, wristband and custom message. The optimistic uploading (not waiting to see if the user actually wanted to share the image) meant a few images were stored and never shared, but on the other hand, instant sharing was made possible, which was of paramount importance for the sake of the project and the success of the kickstarter.

Ecommerce & factory integration

Finally, the last step of this project was to integrate a trim-downed version of the standalone mobile site as an e-commerce widget: once the kickstarter was over, people could still come to Auteur's web-store, visualise their unique watch and order it, all from within the flow and UX of a usual e-commerce experience.

On top of this, the watches had to be eventually manufactured, and for this, the acutal angle values computed by my formulas were needed to provide to the engraving machines. A very simple mini-site was thus created for this purpose, so a date could be instantly converted into angles in the format expected by the machines.

This project was one of the most creative I ever did and full of exciting challenges, especially as a hobby project: combining creativity, advanced mathematics, new and interesting theoretical and technical challenges leading to a lot of learning. All of this for the purpose of creating a beautiful and unique physical design product, it was the perfect mix for my interests and skills. And I am still to this day a proud wearer of Auteur's watches.