Neues zu #3D und #WebGl mit #OpenStreetMap von Tobias und dem #osm2world Team
http://www.osm2world.org
Neues zu #3D und #WebGl mit #OpenStreetMap von Tobias und dem #osm2world Team
http://www.osm2world.org
Code/Demo: https://sketchpunklabs.github.io/threejs_proto/code/webgl/maths/gizmos_actions.html
I may need to build 3D Gizmos again, so thought I put together a simple ex of all the main actions needed. Got line & plane translation with visualizers for the raw data. FromScratch raycasts + mathlib, free & portable 4 all
#threejs #maths #gamedev #indiedev #javascript #webgl #webdev
Today, we’re shining the spotlight on web developer Jean Mazouni!
Jean shares his journey, favorite projects, his passion for WebGL/Three.js, and how he approaches building innovative web experiences.
Read it here: https://tympanus.net/codrops/?p=89618
One day, one decomposition
A208177: Primes of the form 128*k + 1
3D graph, threejs - webGL https://decompwlj.com/3Dgraph/A208177.html
2D graph, first 500 terms https://decompwlj.com/2Dgraph500terms/A208177.html
We're starting this week with a beautiful case study by Meguru Muramoto from Garden Eight, sharing how serendipity and precision come together in the design of Motoyoshi Takamitsu's portfolio. A thoughtful approach filled with innovation.
Read it here: https://tympanus.net/codrops/?p=88189
In today's #gleo news: ScaledHeatMap and ScaledHexBin.
This is an old request from @jorgesanz - a heatmap/hexbin in which the map's scale factors into the field intensity, so that apparent visual intensity kinda stays constant across the screen (otherwise, zooming out means more data points with constant intensity enter the screen, thus increasing the apparent intensity).
In today’s tutorial, Matt Park explores the magic of light and refraction!
Using Three.js, React Three Fiber, and Drei, he breaks down how light bends, refraction works, and how to create a super slick 3D glass torus.
Read it here: https://tympanus.net/codrops/?p=89382
Replicating the "object-fit: cover" behavior in WebGL can be tricky, but Nicolas Giannantonio breaks it down with optimized techniques using shaders for image scaling and positioning.
Learn how to do it in our latest tutorial: https://tympanus.net/codrops/2025/03/11/replicating-css-object-fit-in-webgl/
We are kickstarting this week with a tutorial by MisterPrada on rendering a procedural vortex inside a glass sphere using Three.js and TSL. From shader composition to particle systems, follow the step-by-step breakdown in this great guide.
Read it here: https://tympanus.net/codrops/?p=88757
LOOP, a camera with an internal feedback loop
I am currently developing effect filters that can also be used on a smartphone. The new filters work with an internal feedback loop / additional color buffer. This creates effects similar to intentional camera movement.
I have released a browser-based app with these filters as open source today. The current version is not yet the final version but is already quite usable.
He dedicado un tiempo este fin de semana a crear una versión online de un juego que publiqué hace unos años para iOS y Android. Puede jugarse en cualquier navegador que soporte Web GL.
He dedicado un tiempo este fin de semana a crear una versión online de un juego que publiqué hace unos años para iOS y Android. Puede jugarse en cualquier navegador que soporte Web GL.
Curious about how Stefan Vitasović brought his amazing 2025 portfolio to life?
From minimalist design to dynamic shader effects, this case study takes you behind the scenes of a truly unique creative dev journey.
Read it here: https://tympanus.net/codrops/2025/03/05/case-study-stefan-vitasovic-portfolio-2025/
Today we have a very unique tutorial for you!
Thalles Lopes walks us through creating stylized water effects with React Three Fiber for a beautiful game he made as a birthday gift to his wife.
You'll learn so much, he's a true master at his art!
Read it here: https://tympanus.net/codrops/2025/03/04/creating-stylized-water-effects-with-react-three-fiber/
When artistic intuition meets WebGL mastery, something remarkable emerges.
Our latest Developer Spotlight explores Maximilian Berndt's journey from designer to creative developer and his work at Antinomy Studio, where he collaborates with a talented team to push the boundaries of digital experiences.
Read it here: https://tympanus.net/codrops/2025/02/27/developer-spotlight-maximilian-berndt/
Is it possible to enabled #WebGL on some sites/domains but not others? Or is it an all-or-nothing thing in #Firefox / #Librewolf?
Today, we have something truly special for you.
What if reality can be expressed through code?
Yohei Nishitsuji takes us on a mind-expanding journey through GLSL, simulation theory, and the nature of existence—where art meets physics, and perception dissolves.
Read it here: https://tympanus.net/codrops/2025/02/18/rendering-the-simulation-theory-exploring-fractals-glsl-and-the-nature-of-reality/
We're kicking off the week with a tutorial on creating a dissolve effect with shaders and particles in Three.js
Jatin Chopra breaks down the technique step by step, showing how to use shaders, particles, and bloom to achieve a dynamic effect often used in games for fading and transitions.
Read it here: https://tympanus.net/codrops/2025/02/17/implementing-a-dissolve-effect-with-shaders-and-particles-in-three-js/