Dev Blog #9- Making Beautiful Sunsets

Dev Blog #9- Making Beautiful Sunsets

Multiverse Team

Originally written 06/19/2020, some information may be out of date or have changed. Read the original Tweet here.

Moshi Moshi - it's Hisham (@ultimate_afro) from team MV, coming at you hot with some BOMBASTIC insight into multiverse development! Today we'll be talking about how to make a beautiful sunset:

Working at Multiverse is a welcomed departure from other engineering organizations. At MV, the art and design process is just as important as coding and tech. Engineers focus on pushing web-tech to support the vision of our artists and designers.

This means we work to solve underlying problems to get the best art possible. Art and tech works together in lock-step, overlooking the easy for the vibrant. This has led us toward building our own custom web-game engine and creating new web-based editing interfaces.

The most important lesson I've learned so far is that the artist is always right. The artists have a 6th sense for making things beautiful and fun, which they've built through years of dedicated effort, crits, and self-exploration.

Engineering has its challenges, but there's no stack-overflow for artists: you can't just google answers for most art questions. A great example of how this workflow evolved is our approach to in-game sunset. Sunsets can be described both scientifically and perceptually. From the perspective of science: at noontime the sun hits the ground from a very direct angle, but at twilight, the sun's rays come in at an angle.

That means the sunlight has further air to get through before it hits your eyes. Due to Rayleigh scattering, the blue part of the sunlight (short wavelength) is scattered by air particles. At sunset, sunrays travel through more air, meaning more blue light is scattered away, and the resulting light that reaches us is tinted red and orange.

We can generate a sunset this way by reducing the amount of blue, green, and red light at each pixel over time. While this can give a more physically accurate sunset, we believed a more stylistic sunset was more appropriate to build a stronger narrative. So we took to changing the color-balance and saturation of the scene in a non-physically accurate way to really make it pop.

We began building a sunset shader by having artists provide mockups using photoshop, and reproducing them in our web-engine. We then generated sunset curves by eye-balling values in photoshop and interpolating between them.

After 15 different revisions, our art team wasn't completely satisfied with the curves we hard-coded into the shader. We realized it would be better to build the tech so that our art team is in the driver's seat. We built a web-based curve tool that can handle both positive and negative values, and set this up with our shader to affect RGB color-balance and saturation levels. From there, it was just a matter of dragging the curves around until the sunset looked just right.

It's definitely more work to make a sunset tool than it is to make a sunset, but at Multiverse, that's the whole point. By giving you the power to build limitless worlds, we enable you to tell limitless stories.  The 16th revision was beautiful. 🙂

Thanks for reading!