正在加载视频...

视频加载失败

返回首页

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

supahfunk's profile picture

Fabio Ottaviani

4,776 subscribers

62,503 次观看 • 2 年前 •via X (Twitter)

科学技术教育艺术#creativecoding#shaders#webgl#glsl
LIVE

Anya Rossi• Live Now

Private livecam show

10 条评论

Richard Mattka 的头像
Richard Mattka2 年前

Looking super nice!

Fabio Ottaviani 的头像
Fabio Ottaviani2 年前

Thanks Richard 💧🔮

Henry Dan 的头像
Henry Dan2 年前

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

Zeth Dean 的头像
Zeth Dean2 年前

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?

Fabio Ottaviani 的头像
Fabio Ottaviani2 年前

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

🆅🅸🅽🅲🅴 的头像
🆅🅸🅽🅲🅴2 年前

That’s gorgeous. 😍

Balraj Johal 的头像
Balraj Johal2 年前

wow that's so fluid, really clean!

Maxime 的头像
Maxime2 年前

the one and only glsl king

Fabio Ottaviani 的头像
Fabio Ottaviani2 年前

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

Oleg Kovalenko 的头像
Oleg Kovalenko2 年前

Magical🧙

相关视频

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 次观看 • 3 年前

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,263 次观看 • 14 天前

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 次观看 • 1 年前

God I missed writing tiny #glsl shaders
0:22

God I missed writing tiny #glsl shaders

kishimisu

14,182 次观看 • 2 个月前

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

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

harley turan

78,697 次观看 • 3 年前

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 次观看 • 10 个月前

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 次观看 • 1 年前

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 次观看 • 1 年前

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 次观看 • 1 年前

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 次观看 • 1 年前

Analog UI experimentitation, canvas for the UI elements, shaders for postprocessing. #creativecoding #generativeart
0:37

Analog UI experimentitation, canvas for the UI elements, shaders for postprocessing. #creativecoding #generativeart

Bart Simons

10,361 次观看 • 3 个月前

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 次观看 • 7 个月前

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 次观看 • 1 年前

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

47,279 次观看 • 1 个月前

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 次观看 • 1 年前

🚀 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 次观看 • 1 年前

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 次观看 • 6 个月前

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 次观看 • 1 个月前

🌿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,783 次观看 • 2 个月前

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 次观看 • 6 个月前