Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

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_'s profile picture

Techartist

12,484 subscribers

14,977 görüntüleme • 1 yıl önce •via X (Twitter)

SanatBilim & TeknolojiEğitim#OpenSource#javascript
LIVE

Anya Rossi• Live Now

Private livecam show

11 Yorum

Puneet | Techartist profil fotoğrafı
Puneet | Techartist1 yıl önce

Source Code: Once again thanks in advance for liking and reposting. Appreciate every engagement. ❤️🙏

Rainmaker profil fotoğrafı
Rainmaker2 yıl önce

Can Machine Learning beat the market? Check out this post on my free Substack where I share code and commentary for an XGBoost model and a Random Forest model that both deliver powerful performances.

Dammon Burden profil fotoğrafı
Dammon Burden1 yıl önce

It's amazing! I love it! Beautiful work, Puneet.

Puneet | Techartist profil fotoğrafı
Puneet | Techartist1 yıl önce

Thanks Dammon, means a lot mate. ❤️🙏

prabhu💢 profil fotoğrafı
prabhu💢1 yıl önce

This is an incredible use of WebGL and GLSL shaders! Love the seamless morphing and interactivity. The combination of @threejs and UnrealBloomPass makes it feel truly dynamic. 🔥 Can't wait to check out the source code!

Puneet | Techartist profil fotoğrafı
Puneet | Techartist1 yıl önce

@threejs Thanks mate, appreciate the kind words. ❤️🙏🏼

Brian Jordan profil fotoğrafı
Brian Jordan1 yıl önce

@JungleSilicon

π profil fotoğrafı
π1 yıl önce

💯

Johnny ₿ ⚡️ profil fotoğrafı
Johnny ₿ ⚡️1 yıl önce

Lovely stuff!

Puneet | Techartist profil fotoğrafı
Puneet | Techartist1 yıl önce

Thanks mate. ❤️🙏🏼

Onto nexyai.io 🍊,💊 profil fotoğrafı
Onto nexyai.io 🍊,💊1 yıl önce

That sounds amazing! Interactive visualizations with shaders are always a treat. Meanwhile, have you heard how #SparkChainAI lets your unused bandwidth transcend into rewards? Run a Lite Node and earn SOL while you code!

Benzer Videolar

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 görüntüleme • 1 yıl önce

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 görüntüleme • 11 ay önce

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 görüntüleme • 1 yıl önce

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 görüntüleme • 1 yıl önce

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 görüntüleme • 1 yıl önce

A 3D scene built with Three.js, WebGL, and JavaScript. Features shape changing with a click/tap, camera navigation via dragging and scrolling, and adjustable bloom effects and animation properties. Source code/CodePen link in the comment below. 👇
0:40

A 3D scene built with Three.js, WebGL, and JavaScript. Features shape changing with a click/tap, camera navigation via dragging and scrolling, and adjustable bloom effects and animation properties. Source code/CodePen link in the comment below. 👇

Techartist

11,390 görüntüleme • 1 yıl önce

Interactive particle system built with p5.js. Shapes smoothly morph between circle, square, and triangle on click. Made with javascript. Source code/CodePen link in the comment below. 👇
0:20

Interactive particle system built with p5.js. Shapes smoothly morph between circle, square, and triangle on click. Made with javascript. Source code/CodePen link in the comment below. 👇

Puneet | Techartist

12,164 görüntüleme • 1 yıl önce

A dynamic 3D particle system built with Three.js, styled with Tailwind CSS, and enhanced by custom GLSL shaders. Features interactive pattern transitions, camera controls, and animation toggles for an immersive visual experience. Source code link in the reply below. 👇🏼
0:31

A dynamic 3D particle system built with Three.js, styled with Tailwind CSS, and enhanced by custom GLSL shaders. Features interactive pattern transitions, camera controls, and animation toggles for an immersive visual experience. Source code link in the reply below. 👇🏼

Techartist

14,014 görüntüleme • 11 ay önce

An interactive 3D particle system visualizing dynamic attractors. Coded with Grok 4 from xAI using Three.js and custom GLSL shaders for particle behavior and post-processing effects like Unreal Bloom. Click morphs between generative patterns.
0:42

An interactive 3D particle system visualizing dynamic attractors. Coded with Grok 4 from xAI using Three.js and custom GLSL shaders for particle behavior and post-processing effects like Unreal Bloom. Click morphs between generative patterns.

Techartist

14,276,434 görüntüleme • 11 ay önce

An interactive 3D visualization using Three.js and WebGL. Button click activates energy pulses in this dynamic cosmic portal with custom shaders and post-processing effects. Source code link in the reply below. 👇🏼
0:43

An interactive 3D visualization using Three.js and WebGL. Button click activates energy pulses in this dynamic cosmic portal with custom shaders and post-processing effects. Source code link in the reply below. 👇🏼

Techartist

15,679 görüntüleme • 11 ay önce

Prompted xAI's Grok 4 with the code from my quoted post and built this interactive 3D particle system with Three.js, GSAP, and WebGL. Features include shape morphing, bloom effects, and fluid animations.
0:36

Prompted xAI's Grok 4 with the code from my quoted post and built this interactive 3D particle system with Three.js, GSAP, and WebGL. Features include shape morphing, bloom effects, and fluid animations.

Techartist

106,082 görüntüleme • 10 ay önce

Three.js visualization of a glowing planetary core with animated energy veins flowing inward from the surface. Built with custom GLSL shaders, bloom post processing, and orbit controls with switchable color themes. Sound on 🔊 Demo & source code:
0:28

Three.js visualization of a glowing planetary core with animated energy veins flowing inward from the surface. Built with custom GLSL shaders, bloom post processing, and orbit controls with switchable color themes. Sound on 🔊 Demo & source code:

Techartist

14,877 görüntüleme • 3 ay önce

Digital Metamorphosis... Interactive real-time 3D particle display of 60,000 points that smoothly morph between shapes with bloom, motion trails and color themes, built with Grok 4 from xAI using Three.js and GLSL shaders.
0:36

Digital Metamorphosis... Interactive real-time 3D particle display of 60,000 points that smoothly morph between shapes with bloom, motion trails and color themes, built with Grok 4 from xAI using Three.js and GLSL shaders.

Techartist

13,295 görüntüleme • 10 ay önce

from the archives - a particle fluid sim i'd originally built in unity now translated to webgl / Three.js ! Claude was surprisingly good at all the boring bits with glsl compatibility etc so i could focus on the creative, building on the wordmark in my folio. link below ↓
0:22

from the archives - a particle fluid sim i'd originally built in unity now translated to webgl / Three.js ! Claude was surprisingly good at all the boring bits with glsl compatibility etc so i could focus on the creative, building on the wordmark in my folio. link below ↓

Aj

23,966 görüntüleme • 4 ay önce

Exploring liquid aesthetics in shaders #creativecoding #shaders #webgl #glsl
0:45

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

Fabio Ottaviani

62,503 görüntüleme • 2 yıl önce

Coded with Grok A glowing stream of flowing particles forming mirrored arcs around a radiant core in 3D, rendered with Three.js, BufferGeometry, PointsMaterial, OrbitControls, and UnrealBloomPass for smooth motion, glow, and depth.
0:20

Coded with Grok A glowing stream of flowing particles forming mirrored arcs around a radiant core in 3D, rendered with Three.js, BufferGeometry, PointsMaterial, OrbitControls, and UnrealBloomPass for smooth motion, glow, and depth.

Techartist

29,204 görüntüleme • 8 ay önce

Weekend vibecoding project: inventing a new way to annoy my gf and neighbors 👿 Creating an 808 drum kit that you play with hand gestures, using Three.js, Rosebud AI, and webgl shaders. Link to try and source code below! Guitar or piano/synths next? 👀
0:27

Weekend vibecoding project: inventing a new way to annoy my gf and neighbors 👿 Creating an 808 drum kit that you play with hand gestures, using Three.js, Rosebud AI, and webgl shaders. Link to try and source code below! Guitar or piano/synths next? 👀

AA

27,271 görüntüleme • 1 yıl önce

SwissGL Demo: Particle Lenia with alien SOUNDS! Audio is fully rendered on GPU with GLSL shaders and streamed to WebAudio thanks to the new async GPU->CPU read feature. LIVE DEMO: Press "toggleAudio" in settings for sound 4K YouTube version: Source code:
0:28

SwissGL Demo: Particle Lenia with alien SOUNDS! Audio is fully rendered on GPU with GLSL shaders and streamed to WebAudio thanks to the new async GPU->CPU read feature. LIVE DEMO: Press "toggleAudio" in settings for sound 4K YouTube version: Source code:

Alex Mordvintsev

34,571 görüntüleme • 2 yıl önce

Realtime WebGL, galaxy in a Snow Globe! (three.js, glsl and ts)
3:24

Realtime WebGL, galaxy in a Snow Globe! (three.js, glsl and ts)

🌈 George Corney

72,306 görüntüleme • 2 yıl önce

An interactive 3D simulation and visualization of a black hole, leveraging Three.js for rendering and custom GLSL shaders to achieve stunning details in the event horizon, starfield, and accretion disk. Coded using newly released Grok 4 from xAI
0:30

An interactive 3D simulation and visualization of a black hole, leveraging Three.js for rendering and custom GLSL shaders to achieve stunning details in the event horizon, starfield, and accretion disk. Coded using newly released Grok 4 from xAI

Techartist

2,986,432 görüntüleme • 11 ay önce