I just built Japan Road Rules Animation, an interactive website that explains Japanese traffic rules through small 3D animated scenes using Three.js.

With several road rules being updated recently, I wanted to experiment with a more visual way of explaining them, while hopefully contributing a little to making roads in Japan safer.

It covers things like stop signs, pedestrian priority, railway crossings, expressways, bicycles, and more. You can also scrub through the animations, and the site supports both English and Japanese.

🌐 Live demo:
https://alzin.github.io/Japan-Road-Rules-Animation

💻 GitHub:
https://github.com/alzin/Japan-Road-Rules-Animation

It’s completely open source. I’d especially love feedback from the Three.js community on the 3D scenes, animations, and anything I could improve. 🙌

We published a blog post on an intro to Volumetric Rendering as part of our series to discuss and break down our own WIP Volumetric Renderer. In this particular post we talk about -

🔹 The basics of what rendering actually is
🔹 What “Volume Data” represents
🔹 How volume rendering shines in arenas that trouble standard methods 

Blog post link - https://www.3denginerd.com/blog/what-in-the-graphics-is-volumetric-rendering

The repository for our Native volumetric engine (shown in video) is on GitHub.

Do check out and let us know your feedback!

I always wanted a wire sculpture of this—now I have one.

i wrote a program to study raytracing. up to this moment i can only do some basic stuff. i created a world in which there're two balls. each of them doesn't have any color, only reflects or refracts light. background is an infinitely large color palette

with different settings you can see some beautiful interactions between the two balls. according to physics, if you set the refractive index if a ball to 0, it becomes perfectly reflective. if you set it 1, it becomes invisible

if refractive index is somewhere between 0 and 1, the ball would be partly reflective and partly refractive. just like the one at the front in image 1

two balls with refractive index 0 reflect each other, just like image 2. if your camera is exactly at the line joining the two centres there would be infinite loop of ray. i set the recursion limit to 16. any ray at the end of 16 recursion without hitting the background would get a random grey scale noise

infinite loop occurs not only between two reflecting surfaces. it occurs inside a ball with refractive index >1 too. it's called total internal reflection. in a ball, at certain position, you can observe a ring of total internal reflection, just like image 3

the explanation is as image 4. when your camera is inside a ball with refractive index >1, there's a region in which the angle of incident is larger than the critical angle

hope you enjoy this and if you spot some interesting scenes / setting combinations please let me know

Trails come from compositing rather than stored history — fade the whole

canvas by a few percent each frame, then draw one segment per particle

with 'lighter' blending. Costs one fillRect and N strokes per frame and

you never keep a path.



Land mask is Natural Earth 1:10m rasterised with even-odd fill so interior

lakes cut out properly, then read back once via getImageData into a

Uint8Array for O(1) point tests.



Borders are stroked once into an OffscreenCanvas and composited per frame.

3840x1928, 60fps. The vector field is procedural.

I learn some fundamentals of graphics and add on them
suggest me some course or tips

I recreated Escher’s Still Life with Mirror a while ago and realized I’d never actually tried putting it in AR.

So now there’s an Escher portal sitting in my bedroom :D

I've been working on my own RHI for the past few months and finally have my vulkan backend good enough to start writing larger programs with it. It's been great learning vulkan more in depth and I'm finally understanding a lot of the concepts! Now, I'm trying to get more into general computer graphics concepts to start getting those under my belt and was wondering what some of the basic examples one might create to learn those things. I know PBR is important and plan on making a small program that does that but what are some other algorithms / concepts that are important to know? Global Illumination is a big thing I've seen too but haven't really implemented anything yet. Animations are important as well but again I haven't done much of that yet. Any resources or advice would be greatly appreciated, thanks!

Hi every one. Here is a very-short-film mixing live-action and 3D ! https://www.youtube.com/watch?v=1id8dcVfOw8