In May of 2025, I got the privilege to give a talk at Figma's yearly conference, Figma Config, in San Francisco. This opportunity was not only meaningful from a professional standpoint, but it was also the chance for me to finally talk in real life about what has become a real passion of mine: Shaders and Real-Time 3D on the Web.
So far, I've only ever shared about that subject on this blog, where I not only have the luxury to go as deep as I want on any topic without a hard time limit but also do not have to deal with the nerves of speaking in front of a crowd; although I still do feel a bit nervous every time I publish a new post, crossing my fingers, you'll like it as much as the previous ones. I hope that, whether you've watched this talk in San Francisco or at home, live or deferred, you've enjoyed my presentation and that the few examples I gave on stage inspired you to start your shader learning journey and put together something beautiful with them.
This small post serves as a drop-off point for the people who have watched the talk to find a recording for you to rewatch, as well as a list of resources I personally recommend to anyone interested in getting started with real-time 3D on the web. Whether those are courses, YouTube channels, blog posts (of mine or others), or discord servers, they are all equally beneficial and inspiring.
There are countless great resources out there, made by some of the most interesting people you could ever encounter across the web. Even if the list below may miss some of those people, it nonetheless contains a good chunk of the creators and developers that influenced my work and continue to be helpful to me to this day.
The following courses are to me some of the best content on shaders and real-time 3D (not a paid endorsement) if what you need is a more structured approached to learning:
Inigo Quilez' blog which contains a lot of advanced more shader-focused articles. It's been super helpful to me when I started learning raymarching.
Yuri Artiukh's YouTube channel. I really like the concept behind Yuri's channel: he looks at a Three.js scene running in production and will try to reverse-engineer it live. I highly recommend watching some of his content as it will teach you how to think when writing your shaders or 3D scenes.
Acerola's YouTube channel. Acerolla produces more shader-focused content and will do a lot of deep-dives into specific aspects of shading and video game development.
Offscreen Canvas a newsletter by Daniel Velasquez that contains a lot of very cool shader tips and tricks. Every single issue of this newsletter teaches me something new!
Mofu by Misaki Nakano which contains a lot of interesting Three.js and shader related blog posts in both English and Japanese.
Geomancer developed by my friend Kenneth Pirman. His main focus is on generating realistic 3D fantasy worlds directly in your browser. One of the most impressive real-time 3D projects out there that I also have the privilege of following closely and asking many questions about.
Basement Studio which created one of the most unique agency websites I've ever seen: a PS1 graphic style walkthrough of their studios. They are the masterminds behind some of the most creative websites you can find on the web. Check out their work for a big dose of inspiration, you won't be disappointed.
Shadertoy: THE place where creative developers build and share the most creative shaders. If you want to see how the pros approach a given topic you're interested in, I highly recommend starting on Shadertoy as you will always learn something new from the many examples posted.
Mario Kart 3.js by Alex Moulinneuf, a WebGL port of Mario Kart that runs on your browser. Not only it is impressive, but it is also open source so you can see how it was made! Alex created many other games that are very inspiring and from which there is a lot to learn. I highly recommend looking what's under the hood of his creations if your goal is to make games
This blog! As stated in my talk, I'm just a mere frontend engineer, but have been focusing on shader and 3D development for over 3 years now. I spend my free-time documenting what I learn, and all of that is available for free on here.
My portfolio which was featured in this talk in case you want to take a closer look at the 3D scene showcased in it or if you want to check out some of my other work.
Poimandres Discord, the official Discord server for React Three Fiber, Drei, and many other libraries this team is behind.
Web Game Dev, a cool Discord server where a lot of developers hang out and share tips on how to create games for the Web.
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。