Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Exploring liquid aesthetics in shaders #creativecoding #shaders #webgl #glsl

supahfunk's profile picture

Fabio Ottaviani

4,776 subscribers

62,503 Aufrufe • vor 2 Jahren •via X (Twitter)

Wissenschaft & TechnologieBildungKunst#creativecoding#shaders#webgl#glsl
LIVE

Anya Rossi• Live Now

Private livecam show

10 Kommentare

Profilbild von Richard Mattka
Richard Mattkavor 2 Jahren

Looking super nice!

Profilbild von Fabio Ottaviani
Fabio Ottavianivor 2 Jahren

Thanks Richard 💧🔮

Profilbild von Henry Dan
Henry Danvor 2 Jahren

@heyjohannes Looks awesome! I can't tell if I'm inspired to learn webgl now or make a sunny side up egg

Profilbild von Zeth Dean
Zeth Deanvor 2 Jahren

Really incredible stuff. Out of curiosity, If you were to load this into a browser (say as a hero background), do you think it would be a noticeable load time?

Profilbild von Fabio Ottaviani
Fabio Ottavianivor 2 Jahren

No, it's a webgl content and not even very complex, it has practically no loading times.

Profilbild von 🆅🅸🅽🅲🅴
🆅🅸🅽🅲🅴vor 2 Jahren

That’s gorgeous. 😍

Profilbild von Balraj Johal
Balraj Johalvor 2 Jahren

wow that's so fluid, really clean!

Profilbild von Maxime
Maximevor 2 Jahren

the one and only glsl king

Profilbild von Fabio Ottaviani
Fabio Ottavianivor 2 Jahren

No, please don't refer to me as a king! Out of respect for the true shader kings!

Profilbild von Oleg Kovalenko
Oleg Kovalenkovor 2 Jahren

Magical🧙

Ähnliche Videos

BIOCOMPUTE #4 — CIRCUIT Reaction diffusion across an quadtree substrate, greyscale, no trails, normal lighting. JavaScript + WebGL #javascript #webgl #shaders #creativecoding #generativeart
0:30

BIOCOMPUTE #4 — CIRCUIT Reaction diffusion across an quadtree substrate, greyscale, no trails, normal lighting. JavaScript + WebGL #javascript #webgl #shaders #creativecoding #generativeart

Daniel Lever

41,500 Aufrufe • vor 3 Jahren

Glass Marbles! A small experiment in real-time refraction. Combining SVG filters with a WebGL-rendered displacement map to simulate the optical properties of glass spheres. #webgl #svg #shaders #creativecoding
0:48

Glass Marbles! A small experiment in real-time refraction. Combining SVG filters with a WebGL-rendered displacement map to simulate the optical properties of glass spheres. #webgl #svg #shaders #creativecoding

Hans Chiu

11,241 Aufrufe • vor 9 Tagen

Particle visualization with shockwaves and themes. Uses JavaScript, Three.js for WebGL, and GLSL shaders for visual effects. Source code/CodePen link in the comment below. 👇
0:36

Particle visualization with shockwaves and themes. Uses JavaScript, Three.js for WebGL, and GLSL shaders for visual effects. Source code/CodePen link in the comment below. 👇

Puneet | Techartist

13,326 Aufrufe • vor 1 Jahr

God I missed writing tiny #glsl shaders
0:22

God I missed writing tiny #glsl shaders

kishimisu

14,182 Aufrufe • vor 2 Monaten

here’s GPT-4 writing midi-controllable GLSL shaders
1:39

here’s GPT-4 writing midi-controllable GLSL shaders

harley turan

78,697 Aufrufe • vor 3 Jahren

Interactive 3D particle simulation built with Three.js (WebGL), JavaScript (ES6), & GLSL shaders. Features shape morphing, post-processing (Bloom, custom effects), OrbitControls. Source code link in the reply below. 👇
0:50

Interactive 3D particle simulation built with Three.js (WebGL), JavaScript (ES6), & GLSL shaders. Features shape morphing, post-processing (Bloom, custom effects), OrbitControls. Source code link in the reply below. 👇

Techartist

29,367 Aufrufe • vor 10 Monaten

An interactive, animated spiral pattern with dynamic colors, energy bursts, and bloom effects created with Three.js (WebGL) and custom GLSL shaders. Source code link in the comment below. 👇 #OpenSource #Threejs #JavaScript
0:49

An interactive, animated spiral pattern with dynamic colors, energy bursts, and bloom effects created with Three.js (WebGL) and custom GLSL shaders. Source code link in the comment below. 👇 #OpenSource #Threejs #JavaScript

Puneet | Techartist

11,398 Aufrufe • vor 1 Jahr

Interactive simulation built with Three.js, WebGL, and GLSL shaders featuring dynamic lattice structures, particle effects, and a UI for scene controls. Source code link in the comment below. 👇 #OpenSource #Threejs #JavaScript
0:29

Interactive simulation built with Three.js, WebGL, and GLSL shaders featuring dynamic lattice structures, particle effects, and a UI for scene controls. Source code link in the comment below. 👇 #OpenSource #Threejs #JavaScript

Puneet | Techartist

14,638 Aufrufe • vor 1 Jahr

WebGL particle simulation with custom GLSL shaders, morphing between formations with mouse interaction. Uses Three.js, BufferGeometry, and UnrealBloomPass. Click/Tap changes patterns. Source code/CodePen link in the comment below. 👇 #OpenSource #javascript
0:26

WebGL particle simulation with custom GLSL shaders, morphing between formations with mouse interaction. Uses Three.js, BufferGeometry, and UnrealBloomPass. Click/Tap changes patterns. Source code/CodePen link in the comment below. 👇 #OpenSource #javascript

Techartist

14,977 Aufrufe • vor 1 Jahr

An interactive 3D electric sphere rendered via JavaScript, Three.js, and WebGL. Custom GLSL shaders generate dynamic lightning and particle effects that react to user interaction. Source code/CodePen link in the comment below. 👇
0:48

An interactive 3D electric sphere rendered via JavaScript, Three.js, and WebGL. Custom GLSL shaders generate dynamic lightning and particle effects that react to user interaction. Source code/CodePen link in the comment below. 👇

Techartist

13,955 Aufrufe • vor 1 Jahr

Built a browser shader to teach relativistic effects. Beaming, lensing, Doppler & redshift—live sliders. Based on Koiava's blackhole shader on Shadertoy. I wrapped it in Three.js, added GUI toggles (beaming, redshift, photon ring), Kerr spin cheat. Link in thread. Turn sound on to play with it with the interstellar soundtrack 😀 #PhysicsTwitter #ThreeJS #WebGL #GLSL #Shaders #CreativeCoding
2:34

Built a browser shader to teach relativistic effects. Beaming, lensing, Doppler & redshift—live sliders. Based on Koiava's blackhole shader on Shadertoy. I wrapped it in Three.js, added GUI toggles (beaming, redshift, photon ring), Kerr spin cheat. Link in thread. Turn sound on to play with it with the interstellar soundtrack 😀 #PhysicsTwitter #ThreeJS #WebGL #GLSL #Shaders #CreativeCoding

Lisha

15,978 Aufrufe • vor 7 Monaten

Realtime GLSL programming with a touch of mediapipe. TouchDesigner TD environment, 60fps, regular webcam. Vertex & Pixel shaders. 💦 #glsl #CodingChallenge
0:28

Realtime GLSL programming with a touch of mediapipe. TouchDesigner TD environment, 60fps, regular webcam. Vertex & Pixel shaders. 💦 #glsl #CodingChallenge

ScottieFox

62,929 Aufrufe • vor 1 Jahr

i made a 3D stained glass type design tool it renders live in the browser using threejs and webgl shaders
0:30

i made a 3D stained glass type design tool it renders live in the browser using threejs and webgl shaders

AA

46,992 Aufrufe • vor 1 Monat

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders
0:51

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders

Dan Greenheck

28,002 Aufrufe • vor 6 Monaten

🚀 Exciting news😍. My new material for #ref is finally here! 🎉 It allows smooth color transitions, making life easier for devs. ✨ Free version for basic transitions ✨ Premium version with GLSL shaders for amazing effects 🔗 #threejs #creativecoding
1:37

🚀 Exciting news😍. My new material for #ref is finally here! 🎉 It allows smooth color transitions, making life easier for devs. ✨ Free version for basic transitions ✨ Premium version with GLSL shaders for amazing effects 🔗 #threejs #creativecoding

Anderson Mancini

16,274 Aufrufe • vor 1 Jahr

Meet Kimi K2.6 agent - Video hero section, WebGL shaders, real backends. From one prompt. 🔹 Video hero sections - cinematic aesthetic, auto-composited 🔹 WebGL shader animations - native GLSL / WGSL, liquid metal, caustics, raymarching 🔹 Motion design - GSAP + Framer Motion 🔹 Backend database: Kimi wires up auth + database + backend in one pass. 🔹 Website stack - React 19 + TypeScript + Vite + Tailwind + shadcn/ui 🔹 3D w/ physically-based lighting - Three.js + React Three Fiber
0:43

Meet Kimi K2.6 agent - Video hero section, WebGL shaders, real backends. From one prompt. 🔹 Video hero sections - cinematic aesthetic, auto-composited 🔹 WebGL shader animations - native GLSL / WGSL, liquid metal, caustics, raymarching 🔹 Motion design - GSAP + Framer Motion 🔹 Backend database: Kimi wires up auth + database + backend in one pass. 🔹 Website stack - React 19 + TypeScript + Vite + Tailwind + shadcn/ui 🔹 3D w/ physically-based lighting - Three.js + React Three Fiber

Kimi.ai

385,550 Aufrufe • vor 1 Monat

shimmering shaders buttery-smooth motion wild what the web can do nowadays ✨ built with Cursor, threejs/glsl, motion
0:20

shimmering shaders buttery-smooth motion wild what the web can do nowadays ✨ built with Cursor, threejs/glsl, motion

Ryo Lu

57,246 Aufrufe • vor 1 Jahr

These are all the shaders we've created so far while writing the Unity Shaders Bible and Shaders & Procedural Shapes in Unity! Want to learn shaders? Start step by step today! ✨ #unity3d #indiedev #3DCG
0:30

These are all the shaders we've created so far while writing the Unity Shaders Bible and Shaders & Procedural Shapes in Unity! Want to learn shaders? Start step by step today! ✨ #unity3d #indiedev #3DCG

The Unity Shaders Bible

95,266 Aufrufe • vor 6 Monaten

🌿WIP of shaders in Unreal!🌿 #3DArt #GameDev #UnrealEngine #CharacterArt #Shaders #WIP
0:20

🌿WIP of shaders in Unreal!🌿 #3DArt #GameDev #UnrealEngine #CharacterArt #Shaders #WIP

✨Roanna✨

43,745 Aufrufe • vor 2 Monaten

WebGPU + Compute Shaders = 🤯 >500K stars runs at 60fps on my M1 Pro ⚡️ In my latest blog post, I walk through how to build this interactive galaxy simulation 🌌 Source code and live demo link in comments 👇🏻 #threejs #webgl #webgpu #shaders
0:46

WebGPU + Compute Shaders = 🤯 >500K stars runs at 60fps on my M1 Pro ⚡️ In my latest blog post, I walk through how to build this interactive galaxy simulation 🌌 Source code and live demo link in comments 👇🏻 #threejs #webgl #webgpu #shaders

Dan Greenheck

18,136 Aufrufe • vor 6 Monaten