Rendering the Sky, Sunsets, and Planets

이 글은 웹 브라우저에서 실시간으로 하늘, 일몰, 행성의 대기 산란 효과를 셰이더로 구현하는 과정을 상세히 설명합니다. Rayleigh 산란, Mie 산란, 오존 흡수 등 대기 물리 현상을 수학적으로 모델링하고, 광선 마칭(raymarching) 기법을 활용해 광선의 투과율과 산란을 계산합니다. 이를 통해 실제와 거의 구분이 어려운 하늘 색상과 일출·일몰 효과를 재현하며, 게임 및 그래픽 분야에서 활용 가능한 고성능 대기 렌더링 기법을 제시합니다. 또한, 성능 최적화를 위한 LUT 기반 접근법도 소개합니다.

https://blog.maximeheckel.com/posts/on-rendering-the-sky-sunsets-and-planets/

#shader #atmosphericscattering #raymarching #realtimerendering #webgl

On Rendering the Sky, Sunsets, and Planets - The Blog of Maxime Heckel

This article explores how to render realistic skies and atmospheres in real time in the browser with shaders, from simple sky domes, to entire planets using shaders, raymarching, Rayleigh and Mie scattering, and ozone absorption.

The Blog of Maxime Heckel
🚀 Ah, the riveting saga of Jax's "true calling"—because nothing screams excitement like ray-marching renderers on #WebGL. 🤯 It's like the author stumbled upon a new toy and decided to write a love letter... to themselves. 🎨 I can hardly wait for the sequel, "Jax: The Revenge of the N-dimensional Arrays."
https://benoit.paris/posts/jax-ray-marcher/ #raymarching #Jax #truecalling #techhumor #programming #HackerNews #ngated
JAX's true calling: Ray-Marching renderers on WebGL

JAX’s true calling: Ray-Marching renderers in Python on WebGL Demo (move your mouse/thumb across the image) Why, though? Well, I’ve been drooling over this tool the cool kids use, and wondering how I can join the gang. It’s called JAX. It’s got GPU accelerated functions over n-dimensional arrays. And built-in compile-time differentiability of these!? Auto-vectorization?? And you just have to do like with numpy. What’s not to like? Go home APL!

That .gif i posted yesterday was baad, recompiled ffmpeg with h264 support today and cranked up the perlin #noise resolution on my #planetoid #SDF.

#gamedev #vulkan #3d #graphicsprogramming #raymarching

Got back into #gamedev a bit recently and this is one of the most wholesome bugs I've ever encountered. #signeddistancefunction and #raymarching is so exceedingly bodacious, we can have accidental shadows on our debug #octree grid lines.

#sologamedev #solodev #indiedev #vulkan

It's been a while since I did a #devDiary but I've recently updated the #stars in Teskooano to use volumetric #raymarching and new effects like the Wolf-Rayet wind cloud #threeJS #webGL #simulation #gameEngine #gameDev

Welcome to #TextModeTuesday! For the next few weeks I'll be posting some projects & experiments related to this just spontaneously made up hashtag. If you've got something related to interesting text-based art/experiments, patterns, ASCII-art, ANSI-art etc. please share — the more, the merrier...

To start with, here's an experiment from a few years ago to demonstrate some capabilities of https://thi.ng/text-canvas and https://thi.ng/shader-ast to create a raymarching renderer outputting images in text mode (with customizable character sets to represent luminance).

Demo:
https://demo.thi.ng/umbrella/ascii-raymarch/

Commented source code:
https://github.com/thi-ng/umbrella/blob/develop/examples/ascii-raymarch/

Hotkeys:

- c = toggle color on/off
- t = toggle theme switch
- space = toggle update

WebGL version of the same scene (using an almost identical TypeScript shader source, only here transpiled to GLSL and using slightly different colors):
https://demo.thi.ng/umbrella/shader-ast-raymarch/

#TextModeTuesday #ASCIIArt #ThingUmbrella #TypeScript #ShaderAST #Raymarching

Also, ran out of space, but maybe these tags will increase visibility: #SDF, #Blender, #blender3d, #Raymarching, #Lightwave, #Maya, #3dmodel, #DCC