☄︎

@0xca0a • 58,515 subscribers

Founder PMNDRS | Author of Zustand | R3F | react-spring | Vercel design team | CAD at AWV

Shorts

getting quite close to real time ssgi with 0beqz realism-effects (the v2 branch).

getting quite close to real time ssgi with 0beqz realism-effects (the v2 branch).

166,793 просмотров

ssgi + ssr + bloom on the physics/spheres demo. last time i posted this one it only ssr and bloom, but global illumination gives it something special. demo (+code) below ↓

ssgi + ssr + bloom on the physics/spheres demo. last time i posted this one it only ssr and bloom, but global illumination gives it something special. demo (+code) below ↓

37,675 просмотров

drei/view got a massive update. mix webgl/three right into your html as views, as many as you want. they're self contained. events, controls, everything works. it's driven by a single canvas split into chunks via webgl_skissor. the demo is made with Next.js shadcn v0

drei/view got a massive update. mix webgl/three right into your html as views, as many as you want. they're self contained. events, controls, everything works. it's driven by a single canvas split into chunks via webgl_skissor. the demo is made with Next.js shadcn v0

70,510 просмотров

i liked basement.studio's so much i wanted to see how much effort it would be to create a shadow overlay. this is a quick throwaway using drei/softShadows (which DLC uses, too) and drei/scrollcontrols.

i liked basement.studio's so much i wanted to see how much effort it would be to create a shadow overlay. this is a quick throwaway using drei/softShadows (which DLC uses, too) and drei/scrollcontrols.

48,691 просмотров

trying out the upcoming ssgi effect (paired with ssr). i guess all i ever wanted out of three is reflections and global illumination. come next three we'll have it. 🫡 live demo link (+ code) below ↓

trying out the upcoming ssgi effect (paired with ssr). i guess all i ever wanted out of three is reflections and global illumination. come next three we'll have it. 🫡 live demo link (+ code) below ↓

25,761 просмотров

threejs is a forward renderer, since lights are expensive it can't have more than 4-8 lights max. or can it, how about 100.000 point lights. 🤔

threejs is a forward renderer, since lights are expensive it can't have more than 4-8 lights max. or can it, how about 100.000 point lights. 🤔

58,450 просмотров

import { ConvexObjectBreaker } from 'three-stdlib' had no idea this even existed, shatters objects. wrap it into a <RigidBody> and you have exploding physics.

import { ConvexObjectBreaker } from 'three-stdlib' had no idea this even existed, shatters objects. wrap it into a <RigidBody> and you have exploding physics.

54,034 просмотров

typing with a broken hand is tiresome, it's been a major hinderance over the last weeks. i missed trying to crack interesting design puzzles on the internet. this one is from discourse "how to push meshes away on hover, similar to sparkk dot fr/en"

typing with a broken hand is tiresome, it's been a major hinderance over the last weeks. i missed trying to crack interesting design puzzles on the internet. this one is from discourse "how to push meshes away on hover, similar to sparkk dot fr/en"

36,253 просмотров

one more example of what N8 Programs AO can do for you. switch it on and you immediately go from cheap 90s era cgi to something that feels much more realistic.

one more example of what N8 Programs AO can do for you. switch it on and you immediately go from cheap 90s era cgi to something that feels much more realistic.

33,398 просмотров

three/webgpu + TSL in react-three-fiber, if you ever wanted to try it out though this part of three is under construction it has great potential. former cpu tasks could quite effortlessly be put onto the gpu.

three/webgpu + TSL in react-three-fiber, if you ever wanted to try it out though this part of three is under construction it has great potential. former cpu tasks could quite effortlessly be put onto the gpu.

20,597 просмотров

the amount of work and dedication Next.js teams spent on this figuring out all these little details ..., i'm blown away by the result!

the amount of work and dedication Next.js teams spent on this figuring out all these little details ..., i'm blown away by the result!

29,817 просмотров

from discord, "how was the footer made?" using react-three/rapier, did you know that you can lock both translation and rotation, thereby enabling 2d physics?

from discord, "how was the footer made?" using react-three/rapier, did you know that you can lock both translation and rotation, thereby enabling 2d physics?

23,502 просмотров

ever wanted to overlay multiple materials in threejs? drei can help with this now: <mesh> <boxGeometry /> <MultiMaterial> <meshBasicMaterial /> <customMaterial /> ... thx to Verekia | ManaBlade.com for the idea & Don McCurdy for fixing glitches

ever wanted to overlay multiple materials in threejs? drei can help with this now: <mesh> <boxGeometry /> <MultiMaterial> <meshBasicMaterial /> <customMaterial /> ... thx to Verekia | ManaBlade.com for the idea & Don McCurdy for fixing glitches

18,160 просмотров

$trying something else with the liquid glas thing, working towards buttons that have self contained world inside them, be it more text, routes, scenes ... they would refract the environment, but also let the inner scene peek through.$

trying something else with the liquid glas thing, working towards buttons that have self contained world inside them, be it more text, routes, scenes ... they would refract the environment, but also let the inner scene peek through.

13,434 просмотров

i only just noticed 🫣😂 so much attention to detail

i only just noticed 🫣😂 so much attention to detail

24,560 просмотров

Videos

Anya Rossi

sweetdream.ai

SweetDream.ai•Sponsored•Livecam

Watch Anya Live

Anya is streaming live right now! Join her private show and enjoy exclusive content.

Exclusive private shows

1.2k viewers online

Private Show

Join now for exclusive access

Free preview available • Premium content

Big news for CAD: SMLIB, NVIDIA's NURBS based kernel is finally open source today 🍻🎉 We have been working with SMLIB and its dev team for more than 20 years. It enables all our products: headless CAD, GUI, AI/MCP, PDM, etc

Big news for CAD: SMLIB, NVIDIA's NURBS based kernel is finally open source today 🍻🎉 We have been working with SMLIB and its dev team for more than 20 years. It enables all our products: headless CAD, GUI, AI/MCP, PDM, etc

472,301 просмотров • 5 дней назад

We are releasing → today: AI driven embeddable CAD. If you ever enjoyed my OSS projects (zustand, react-spring, r3f, pmndrs), these all came out of CC. 🍻 A small 🇨🇭 team has been working on CAD for so many years, release seemed always out of reach. This is a huge milestone for us and i'd appreciate a RT. 🙏

We are releasing → today: AI driven embeddable CAD. If you ever enjoyed my OSS projects (zustand, react-spring, r3f, pmndrs), these all came out of CC. 🍻 A small 🇨🇭 team has been working on CAD for so many years, release seemed always out of reach. This is a huge milestone for us and i'd appreciate a RT. 🙏

275,384 просмотров • 16 дней назад

pmndrs/uikit by Bela Bohlender is fully responsive via flexbox, built on the yoga layout engine. making UI in webgl opens up interesting possibilities: effects, 2.5D & 3D navigation, perspective shift, parallax, more to come ... very early dev preview

pmndrs/uikit by Bela Bohlender is fully responsive via flexbox, built on the yoga layout engine. making UI in webgl opens up interesting possibilities: effects, 2.5D & 3D navigation, perspective shift, parallax, more to come ... very early dev preview

572,217 просмотров • 2 лет назад

drei/meshportalmaterial can now be entered with a single prop, "blend". it will have lots of creative potential, for spatial UI and the meaning of "routes". made a small showcase using models from my fav designer on sketchfab Omar Faruq Tawsif🍉 sandbox

drei/meshportalmaterial can now be entered with a single prop, "blend". it will have lots of creative potential, for spatial UI and the meaning of "routes". made a small showcase using models from my fav designer on sketchfab Omar Faruq Tawsif🍉 sandbox

497,399 просмотров • 3 лет назад

so, liquid glass. 😂 here are 3 boxes that show you how to do it in react + three. one with a meta shape, a lens, and one where the entire site is in a liquid state —

so, liquid glass. 😂 here are 3 boxes that show you how to do it in react + three. one with a meta shape, a lens, and one where the entire site is in a liquid state —

163,578 просмотров • 1 год назад

$how to have URL routes inside your scene, as well as bind webgl text to html to that it's accessible, selectable, and webgl gets to refract it.$

how to have URL routes inside your scene, as well as bind webgl text to html to that it's accessible, selectable, and webgl gets to refract it.

181,316 просмотров • 3 лет назад

$this is what happens when you run a website through a lens — refraction, chroma and all. 🫠 live:$

this is what happens when you run a website through a lens — refraction, chroma and all. 🫠 live:

142,051 просмотров • 3 лет назад

splats will change everything, it's like entering a live photograph. nobody modelled this in blender. it was shot with a handheld. reflections, lights etc aren't post pro render effects, it's all just in there. using drei/<Splat src="scene.splat" />, literally all it takes.

splats will change everything, it's like entering a live photograph. nobody modelled this in blender. it was shot with a handheld. reflections, lights etc aren't post pro render effects, it's all just in there. using drei/<Splat src="scene.splat" />, literally all it takes.

96,652 просмотров • 2 лет назад

more work on dreis new transmissionmaterial as a direct replacement for THREE.MeshPhysicalMaterial N8 Programs added white noise roughness/blur to it today, it looks so much better than physicals chonk pixel blur! 🤩

more work on dreis new transmissionmaterial as a direct replacement for THREE.MeshPhysicalMaterial N8 Programs added white noise roughness/blur to it today, it looks so much better than physicals chonk pixel blur! 🤩

118,835 просмотров • 3 лет назад

simplest magic/impossible box ever? i remember when stuff like that was so complex, tutorials spanning dozens of pages using tricky stencil operations. now it's just ... react ✨ <MeshPortalMaterial> {children} </MeshPortalMaterial>

simplest magic/impossible box ever? i remember when stuff like that was so complex, tutorials spanning dozens of pages using tricky stencil operations. now it's just ... react ✨ <MeshPortalMaterial> {children} </MeshPortalMaterial>

107,180 просмотров • 3 лет назад

ray marched <Caustics> new in drei 💫 beautiful swirls and patterns that appear when light passes through transmissive surfaces. 😍 this was a huge effort by N8 Programs! react + threejs users just have to type: <Caustics {...config}> <Model /> demo:

ray marched <Caustics> new in drei 💫 beautiful swirls and patterns that appear when light passes through transmissive surfaces. 😍 this was a huge effort by N8 Programs! react + threejs users just have to type: <Caustics {...config}> <Model /> demo:

112,753 просмотров • 3 лет назад

Mini tutorial on making WebGL look ✨ good ✨. One of the hardest—easiest tasks. These are often ignored: 🔑 SRGB, Gamma & tonemapping 🔐 Env maps and good lighting Deployed: Sandbox: GH Sponsors: ↓

Mini tutorial on making WebGL look ✨ good ✨. One of the hardest—easiest tasks. These are often ignored: 🔑 SRGB, Gamma & tonemapping 🔐 Env maps and good lighting Deployed: Sandbox: GH Sponsors: ↓

77,956 просмотров • 3 лет назад

drei/MeshTransmissionMaterial is complete 🎉 thx to N8 Programs taking over! acts like MeshPhysicalMaterial (transmission, thickness, IOR, roughness, etc) but has chromatic aberration, noise roughness, anisotropy, DISTORTION. compare it w/ the original

drei/MeshTransmissionMaterial is complete 🎉 thx to N8 Programs taking over! acts like MeshPhysicalMaterial (transmission, thickness, IOR, roughness, etc) but has chromatic aberration, noise roughness, anisotropy, DISTORTION. compare it w/ the original

78,622 просмотров • 3 лет назад

from reddit, "how can I arrange my images in circular manner just like clouarchitects dot com" it's a 10 minutes draft, just a couple of lines, but could be extended and optimized further

from reddit, "how can I arrange my images in circular manner just like clouarchitects dot com" it's a 10 minutes draft, just a couple of lines, but could be extended and optimized further

63,723 просмотров • 2 лет назад

drei/<Cloud> is finally published and documented 🎉 it's particle based and instanced. you can glob cloud formations into components for re-use or full interop with 3rd party, physics etc. try the sandbox below ↓

drei/<Cloud> is finally published and documented 🎉 it's particle based and instanced. you can glob cloud formations into components for re-use or full interop with 3rd party, physics etc. try the sandbox below ↓

51,650 просмотров • 3 лет назад

in preparation of spatial UI i've begun to add pass-through to drei/MeshPortalMaterial. not finished but it will be so easy to use. the demo uses real URL routes. vision pro will redefine what we understand as a route today, having your fav router within the scene will help.

in preparation of spatial UI i've begun to add pass-through to drei/MeshPortalMaterial. not finished but it will be so easy to use. the demo uses real URL routes. vision pro will redefine what we understand as a route today, having your fav router within the scene will help.

50,797 просмотров • 3 лет назад

drei/ + Clouds + MeshTransmissionMaterial + RoundedBox + Float + ContactShadows + CameraShake + PerspectiveCamera + Environment + OrbitControls maath/ + random.FlashGen →

drei/ + Clouds + MeshTransmissionMaterial + RoundedBox + Float + ContactShadows + CameraShake + PerspectiveCamera + Environment + OrbitControls maath/ + random.FlashGen →

43,316 просмотров • 3 лет назад

and as of today also in rt/postprocessing, thank you N8 Programs and 🙏 <EffectComposer> <N8AO />

and as of today also in rt/postprocessing, thank you N8 Programs and 🙏 <EffectComposer> <N8AO />

46,890 просмотров • 3 лет назад