Awesome. I remember much earlier in my career I was working on a 3D turn-by-turn navigation software, and one of my tasks was to draw the sky in the background. The more senior guy on the team said, just draw a blue rectangle during the day and a dark gray one at night and call it job done. Of course, I had to do it the hard way, so I looked up the relevant literature on sky rendering based on the environment, latitude, longitude, time of day and so on, which at the time was Preetham[1] ("A Practical Analytic Model for Daylight"), and built a fully realistic sky model for the software. I even added prominent stars based on a hard-coded ephemeris table. It was quite fast, too.
Well, the higher ups of course hated it, they were confused as to why the horizon would get hazy, yellowish, and so on. "Our competitors' skies are blue!" They didn't like "Use your eyes and look outside" as an answer.
Eventually, I was told to scrap it and just draw a blue rectangle :(
A past coworker who worked on Cobalt[1] told me that they spent entirely too much time implementing stars in the sky of the game with some amount of real(ish) star system physics behind them.
I can understand people removing polish things like that if there are usability concerns, but those small things add up to a lot in an end product and are a joy to find and explore.
You could've sold it with telling them Vincent Van Gogh's paintings had the location of stars accurately, you were inspired by those paintings to reproduce the sky color accurately.
> the little-known meta http-equiv="Refresh" HTML tag
Oh, don't mind me, I'll just be over here in the corner laughing ruefully as my bones crumble to dust: back when I started, if you wanted a page to refresh on its own, this was the only way.
Beautiful work! A splendid example of formal minimalism at its best.
Thank you! And umm, not to make you feel ancient, but I think I wasn't even alive yet when `setTimeout(() => location.reload(), ...)` first became widely available.
Oh, don't worry about it at all, and I don't just mean in my own case. Every generation learns to age graciously or otherwise, partly through experience, and for me it's a regular source of joy to see you young 'uns independently rediscover things I long since quit bothering to remember.
Put my phone against the window and I had to call over my wife to come to check it: it matches 100% (clear sky right now). It's amazing, congratulations
That'd be a pretty large introduction of a dependency. The sky can be calculated with just lat/lon and the current date+time. Adding in weather would mean querying some external weather service.
A server is needed to calculate the sun's position from latitude + longitude + time, and then render the gradient. I could use HTML templating in some other language/framework, but I used Astro because that's what I'm familiar with and it's very easy to deploy to Cloudflare Pages.
- First and most impactful: as the earth curves down and away from the observer's horizon, your line of sight goes through a thicker slice of the atmosphere.
Looking straight up you might have 100km of atmosphere until space (the distance is made up here, but I'm using the Kármán line as an arbitrary ruler), but looking out towards the horizon (assuming a perfectly spherical Earth), it's much, much more than that 100km, so the light will scatter off of (and/or be filtered by, depending on angle and time of day) more particles in the atmosphere, affecting the colour of the sky.
- The compounding factor here is if there are environmental factors that boost the particle count in the air, and especially particles that'd stay in lower layers of the atmosphere. Where I am, we've been dealing with wildfire smoke of varying strengths for a few weeks. Today's gentle enough, but it's bad enough that my gradient goes from rgb(115, 160, 207) at the top of the sky to rgb(227, 230, 227) at the horizon (which is shockingly accurate).
Well, the higher ups of course hated it, they were confused as to why the horizon would get hazy, yellowish, and so on. "Our competitors' skies are blue!" They didn't like "Use your eyes and look outside" as an answer.
Eventually, I was told to scrap it and just draw a blue rectangle :(
All that to say, nice job on the site!
1: https://courses.cs.duke.edu/cps124/fall01/resources/p91-pree...
I can understand people removing polish things like that if there are usability concerns, but those small things add up to a lot in an end product and are a joy to find and explore.
1: https://en.wikipedia.org/wiki/Cobalt_(video_game)
You could've sold it with telling them Vincent Van Gogh's paintings had the location of stars accurately, you were inspired by those paintings to reproduce the sky color accurately.
Oh, don't mind me, I'll just be over here in the corner laughing ruefully as my bones crumble to dust: back when I started, if you wanted a page to refresh on its own, this was the only way.
Beautiful work! A splendid example of formal minimalism at its best.
what got me the most is opening chrome dev tools and seeing nothing there
I wonder what it would take to account for weather?
- First and most impactful: as the earth curves down and away from the observer's horizon, your line of sight goes through a thicker slice of the atmosphere.
Looking straight up you might have 100km of atmosphere until space (the distance is made up here, but I'm using the Kármán line as an arbitrary ruler), but looking out towards the horizon (assuming a perfectly spherical Earth), it's much, much more than that 100km, so the light will scatter off of (and/or be filtered by, depending on angle and time of day) more particles in the atmosphere, affecting the colour of the sky.
- The compounding factor here is if there are environmental factors that boost the particle count in the air, and especially particles that'd stay in lower layers of the atmosphere. Where I am, we've been dealing with wildfire smoke of varying strengths for a few weeks. Today's gentle enough, but it's bad enough that my gradient goes from rgb(115, 160, 207) at the top of the sky to rgb(227, 230, 227) at the horizon (which is shockingly accurate).