2018/11/30, twentieth day in a row

Stars

There was an exercise on freeCodeCamp today that was really nice. It was a night sky with stars, and by using animation you had to make the stars twinkle. The exercise is here. What I did from that, and I'm surprised that it seems to not exist on the web, is recreate a real constellation with stars also twinkling.

How did I do that?

My code is here. It is plain, trivial and repetitive HTML+CSS.
I found a picture of the Scorpio constellation on the web.
I opened it in Preview and used the screenshot cursor to find the coordinates of each star relative to the top left screen corner.
I recorder all the coordinates while measuring them with the new Voice Memo application on Mojave, and I played myself the recording when I was done to write down the measurements.
I used a few quick regex/replacements to create some CSS code for each star, tested, adapted and put the code up here.
The CSS itself is trivial, each star comes with individual characteristics and each has a specific animation. I'm thinking to make that for a significant part of the night sky, with cool references appearing when hovering on a star, but that's for a different project.
Tomorrow, I'll start working on "Applied Accessibility" in the evening. But in the afternoon I'll be going to a local community center to hear John Kaizan Neptune play...