正在加载视频...

视频加载失败

返回首页

I wrote a technical demo article explaining how you can build a seamless interactive web experience using the GSAP animation library alongside other techs like WebGL and page transitions. The article is live on Codrops ↓

highpfloat's profile picture

chakib

2,958 subscribers

36,859 次观看 • 4 个月前 •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

Well… things escalated fast. This started as me re-purposing dusty / rejected Figma concepts to study page transitions using WebGL + Taxi. Somehow it turned into a mini site with… a lot going on. Live: #webflow #threejs #gsap #webgl
0:21

Well… things escalated fast. This started as me re-purposing dusty / rejected Figma concepts to study page transitions using WebGL + Taxi. Somehow it turned into a mini site with… a lot going on. Live: #webflow #threejs #gsap #webgl

Bimo Tri. P

13,575 次观看 • 5 个月前

Interactive sunny-side pattern! 🍳 (a little tribute to my love for gooey shapes and dumb demos) Live demo & source code: Made with #webgl #shader and a bit of GSAP (GSAP) Hosted on CodePen.IO
0:21

Interactive sunny-side pattern! 🍳 (a little tribute to my love for gooey shapes and dumb demos) Live demo & source code: Made with #webgl #shader and a bit of GSAP (GSAP) Hosted on CodePen.IO

Ksenia Kondrashova

18,827 次观看 • 1 年前

Multi-talented Filip ↟ shares an incredible article with us today: learn how he built a sci-fi-worthy 3D audio visualizer with Three.js, GSAP & Web Audio API — glowing shaders, draggable UI, and beats that shape the visuals in real time. 🎶🎧 👉
0:58

Multi-talented Filip ↟ shares an incredible article with us today: learn how he built a sci-fi-worthy 3D audio visualizer with Three.js, GSAP & Web Audio API — glowing shaders, draggable UI, and beats that shape the visuals in real time. 🎶🎧 👉

Codrops

15,391 次观看 • 1 年前

I upgraded how the shadows look in the game, using a lesser-known technique called Light Space Perspective Shadow Maps. I also wrote a short article about using this technique on my blog!
2:31

I upgraded how the shadows look in the game, using a lesser-known technique called Light Space Perspective Shadow Maps. I also wrote a short article about using this technique on my blog!

Taha Torabpour

16,500 次观看 • 17 天前

⚡️Live: A new project for #havaianas is finally live. An interactive landing page using #threejs and GSAP that shows how the most beloved flip flops in Brazil are created. Congrats to all the Neotix Transformação Digital team. Case study is here:
0:30

⚡️Live: A new project for #havaianas is finally live. An interactive landing page using #threejs and GSAP that shows how the most beloved flip flops in Brazil are created. Congrats to all the Neotix Transformação Digital team. Case study is here:

Anderson Mancini

11,525 次观看 • 3 年前

What if your website felt like a living canvas? 💣 I built a WebGL experiment to test that idea. A reactive image grid powered by Three.js + GSAP + Webflow , where every tile bends, scales and reacts to your cursor like a soft “force field”. 🔗 Live demo: 🔗 Case study on Contra #WebGL #ThreeJS #GSAP #CreativeCoding #Webflow #InteractionDesign
0:23

What if your website felt like a living canvas? 💣 I built a WebGL experiment to test that idea. A reactive image grid powered by Three.js + GSAP + Webflow , where every tile bends, scales and reacts to your cursor like a soft “force field”. 🔗 Live demo: 🔗 Case study on Contra #WebGL #ThreeJS #GSAP #CreativeCoding #Webflow #InteractionDesign

Franco Beltramella | Webflow Expert

15,590 次观看 • 6 个月前

As promised, more insights on the webgl raytracer. It is based on this article/paper by Tero Karras: It uses Morton code to build a BVH binary radix tree on the GPU in realtime. #webgl #bvh #raytracing
0:35

As promised, more insights on the webgl raytracer. It is based on this article/paper by Tero Karras: It uses Morton code to build a BVH binary radix tree on the GPU in realtime. #webgl #bvh #raytracing

Nicolas Riciotti

43,994 次观看 • 3 年前

Claude can now create slides your next technical talk! I asked Claude to create a presentation based on an article I wrote a few years back that talks about the Web Storage APIs. In about 3 min I had a ready to go talk. (see the full deck in sub-tweet).
0:29

Claude can now create slides your next technical talk! I asked Claude to create a presentation based on an article I wrote a few years back that talks about the Web Storage APIs. In about 3 min I had a ready to go talk. (see the full deck in sub-tweet).

Ado

72,326 次观看 • 9 个月前

I wrote an interactive article explaining the geometric intuition behind Rectified Flows. I visually explain why flow-models tend to learn curved trajectories, why this is bad for sampling latency, and a relatively simple technique for mitigating it. Check it out! Link 👇
0:25

I wrote an interactive article explaining the geometric intuition behind Rectified Flows. I visually explain why flow-models tend to learn curved trajectories, why this is bad for sampling latency, and a relatively simple technique for mitigating it. Check it out! Link 👇

Alec Helbling

158,731 次观看 • 4 个月前

Seems like everyone's talking about database sharding. Earlier this year, I wrote an interactive guide on how it works for relational databases. Every engineer should know the core principles and challenges of sharding. This article is here to help.
0:20

Seems like everyone's talking about database sharding. Earlier this year, I wrote an interactive guide on how it works for relational databases. Every engineer should know the core principles and challenges of sharding. This article is here to help.

Ben Dicken

103,277 次观看 • 10 个月前

Just SKETCH IT, and GROK will bring it into reality for you! Building a web page has never been easier! See below how you can build a web page from a drawing using Grok! 👇
1:07

Just SKETCH IT, and GROK will bring it into reality for you! Building a web page has never been easier! See below how you can build a web page from a drawing using Grok! 👇

Nima Owji

1,445,698 次观看 • 1 年前

Hey everyone!! I made a new demo for a Codrops article made with #threejs, #blender3d, and #krita ! The article itself is about the increasing importance of psychological safety and self-awareness for creative work. I think as more and more people get super-talented/skilled the emphasis will shift to emotional safety rather than just technical skills. I think there's a ton of hidden talent out there that never shines because they're never provided safe environments to grow in. It's not a new concept by any means, but I'm an advocate for it. Article: Website: Code:
0:42

Hey everyone!! I made a new demo for a Codrops article made with #threejs, #blender3d, and #krita ! The article itself is about the increasing importance of psychological safety and self-awareness for creative work. I think as more and more people get super-talented/skilled the emphasis will shift to emotional safety rather than just technical skills. I think there's a ton of hidden talent out there that never shines because they're never provided safe environments to grow in. It's not a new concept by any means, but I'm an advocate for it. Article: Website: Code:

Andrew Woan

34,494 次观看 • 5 个月前

To highlight the new v2 API integrations for x402, Ash built a demo app on Replit ⠕ showing how teams can build agents that can autonomously retrieve data from the web using a wallet with stablecoin payments. Watch the demo 👇
3:41

To highlight the new v2 API integrations for x402, Ash built a demo app on Replit ⠕ showing how teams can build agents that can autonomously retrieve data from the web using a wallet with stablecoin payments. Watch the demo 👇

Coinbase Developer Platform🛡️

16,290 次观看 • 8 个月前

We just released our latest NanoGL experience! If you haven’t already, head over: The code is fully open source ( so you can see how we make interactive experiences at Makemepulse using our Webgl framework:
0:29

We just released our latest NanoGL experience! If you haven’t already, head over: The code is fully open source ( so you can see how we make interactive experiences at Makemepulse using our Webgl framework:

makemepulse

10,835 次观看 • 2 年前

I want to show you a demo of what I believe the future of user interaction to look like. This is ChatGPT controlling a live energy simulator (MCP App). I'll explain why today's architecture is clunky, and how WebMCP makes agent-driven UX much simpler. Read the article/watch 👇
0:47

I want to show you a demo of what I believe the future of user interaction to look like. This is ChatGPT controlling a live energy simulator (MCP App). I'll explain why today's architecture is clunky, and how WebMCP makes agent-driven UX much simpler. Read the article/watch 👇

Kent C. Dodds ⚡

27,852 次观看 • 4 个月前

🚨BREAKING: You can now build full websites by just typing. It’s called Youware, and it runs on pure vibe coding. Here’s how it works (with a live demo):👇 1. Create a web page or game just by typing. You can even send a screenshot to make it live. 2. Use built-in tools like Figma, YouTube, and Notion. 3. Change a Figma design into a real website. 4. Change how the webpage looks with one click using the boost button on the profile page. 5. Easily deploy code with a link you can share. 6. Highlights: free online AI coding. Try it today:
0:23

🚨BREAKING: You can now build full websites by just typing. It’s called Youware, and it runs on pure vibe coding. Here’s how it works (with a live demo):👇 1. Create a web page or game just by typing. You can even send a screenshot to make it live. 2. Use built-in tools like Figma, YouTube, and Notion. 3. Change a Figma design into a real website. 4. Change how the webpage looks with one click using the boost button on the profile page. 5. Easily deploy code with a link you can share. 6. Highlights: free online AI coding. Try it today:

Hasan Toor

73,491 次观看 • 1 年前

Sharding is the best way to scale a database. But how does it work? And what's the best way to ensure data and queries are evenly distributed? Our interactive article on database sharding teaches you how.
0:25

Sharding is the best way to scale a database. But how does it work? And what's the best way to ensure data and queries are evenly distributed? Our interactive article on database sharding teaches you how.

PlanetScale

28,639 次观看 • 1 个月前

LISTEN TO THIS ARTICLE 🎧 Dear readers, we’ve made your experience even more comfortable: You can now listen to any article on our website — just tap “LISTEN TO THIS ARTICLE” and stay informed on the go.
0:39

LISTEN TO THIS ARTICLE 🎧 Dear readers, we’ve made your experience even more comfortable: You can now listen to any article on our website — just tap “LISTEN TO THIS ARTICLE” and stay informed on the go.

KyivPost

32,626 次观看 • 10 个月前

A small video explaining the content of the below article.
4:26

A small video explaining the content of the below article.

rangarajan

14,798 次观看 • 1 年前

Building Fullstack LangGraph AI agents can be a challenge. So I wrote a tutorial on how to build a Frontend for your LangGraph AI agent in minutes using: - @LangChainAI - CopilotKit🪁 - Tavily Here is the demo + checkout tutorial link below 👇
1:56

Building Fullstack LangGraph AI agents can be a challenge. So I wrote a tutorial on how to build a Frontend for your LangGraph AI agent in minutes using: - @LangChainAI - CopilotKit🪁 - Tavily Here is the demo + checkout tutorial link below 👇

Bonnie

23,999 次观看 • 1 年前