Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

been willing to make this kind of "perspective stack" component for a while it was a fun little challenge to orchestrate the transitions just right built with Motion

MaximeHeckel's profile picture

Maxime

14,954 subscribers

15,817 Aufrufe • vor 11 Monaten •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Kommentare

Keine Kommentare verfügbar

Kommentare vom Original-Post werden hier angezeigt

Ähnliche Videos

Let's make Android development in React Native great and fun again. This is the official native Material 3 carousel composable rendered using Expo native views. The result is a simple-to-use React component with all native behavior (gestures and transitions) built in.
0:19

Let's make Android development in React Native great and fun again. This is the official native Material 3 carousel composable rendered using Expo native views. The result is a simple-to-use React component with all native behavior (gestures and transitions) built in.

Oliver Lopez

19,336 Aufrufe • vor 1 Jahr

I don't think its usable but it was a fun little experiment built with Three.js Motion Tailwind CSS and Next.js
0:15

I don't think its usable but it was a fun little experiment built with Three.js Motion Tailwind CSS and Next.js

Manu Arora

25,757 Aufrufe • vor 9 Monaten

Great motion triggers literal dopamine... Just finished this animation. Spent a little too much time getting the transitions right, but honestly, that final polish is always worth it. 🤌🏻
0:19

Great motion triggers literal dopamine... Just finished this animation. Spent a little too much time getting the transitions right, but honestly, that final polish is always worth it. 🤌🏻

Michael Nowak

35,804 Aufrufe • vor 3 Monaten

i tried to recreate forest maze without from memory while my friend tries to correct my mistakes through vc. it was a fun little challenge.
0:10

i tried to recreate forest maze without from memory while my friend tries to correct my mistakes through vc. it was a fun little challenge.

AymenZero🇩🇿

27,374 Aufrufe • vor 7 Monaten

I've started using Base UI for Hypermode's new UI components and I'm absolutely loving it. The component API's are excellent, and the DX in pairing it up with Motion has been seamless. WIP of a new Hypermode dialog with form elements built on BaseUI 👇
0:14

I've started using Base UI for Hypermode's new UI components and I'm absolutely loving it. The component API's are excellent, and the DX in pairing it up with Motion has been seamless. WIP of a new Hypermode dialog with form elements built on BaseUI 👇

Derek Briggs

14,980 Aufrufe • vor 1 Jahr

Alpha testing some of my upcoming tools. Atm just figuring out best ways to utilize Asset Library, what kind of Prefabs to make etc. Looks fun doesnt it;) and you can just stack them! #geometrynodes #b3d
0:15

Alpha testing some of my upcoming tools. Atm just figuring out best ways to utilize Asset Library, what kind of Prefabs to make etc. Looks fun doesnt it;) and you can just stack them! #geometrynodes #b3d

Miettinen Jesse - Embrace FX

81,417 Aufrufe • vor 7 Monaten

low key obsessed with Inertia.js + Rails + React. I built this Notion like UI in a day (and I don't know React or Typescript). Not even sure if I'm doing it right (am I supposed to redirect to the parent page if I'm just updating a component??) but it just works ™️
0:14

low key obsessed with Inertia.js + Rails + React. I built this Notion like UI in a day (and I don't know React or Typescript). Not even sure if I'm doing it right (am I supposed to redirect to the parent page if I'm just updating a component??) but it just works ™️

Colleen Schnettler

26,061 Aufrufe • vor 1 Jahr

always tricky to find like.. a gameplay purpose for this kind of fun stuff but maybe we just let it be fun? without making the player 'solve' something?
0:17

always tricky to find like.. a gameplay purpose for this kind of fun stuff but maybe we just let it be fun? without making the player 'solve' something?

thomas "noio" vandenberg

17,286 Aufrufe • vor 7 Monaten

Fable 5 just dropped and someone already built a $10k-looking website with it. Here's the full workflow The smooth scrolling, the animations, the transitions, all built with Fable 5. Here's how to get the same result instead of a generic template. 1. Steal a direction first. Go to Mobbin or Godly and find a site whose feel you love. Screenshot it. Fable copies a vibe far better than it invents one. 2. Grab real components. Pull animation-ready blocks from Aceternity UI or Magic UI. These are built for exactly this look (scroll reveals, parallax, gradients). 3. Prompt Fable with all of it. Switch to Fable 5 in Claude Code, drop in your screenshots and the component references, and describe the sections and scroll behavior you want. Let it plan before it builds. 4. Animate with the right tools. Tell it to use GSAP with ScrollTrigger for scroll effects, or Framer Motion for React. This is what separates "nice" from "$10k." 5. Iterate on feel, not code. Preview it, then give Fable specific notes ("slower fade, more spacing on mobile") until it lands. Bookmark this
0:16

Fable 5 just dropped and someone already built a $10k-looking website with it. Here's the full workflow The smooth scrolling, the animations, the transitions, all built with Fable 5. Here's how to get the same result instead of a generic template. 1. Steal a direction first. Go to Mobbin or Godly and find a site whose feel you love. Screenshot it. Fable copies a vibe far better than it invents one. 2. Grab real components. Pull animation-ready blocks from Aceternity UI or Magic UI. These are built for exactly this look (scroll reveals, parallax, gradients). 3. Prompt Fable with all of it. Switch to Fable 5 in Claude Code, drop in your screenshots and the component references, and describe the sections and scroll behavior you want. Let it plan before it builds. 4. Animate with the right tools. Tell it to use GSAP with ScrollTrigger for scroll effects, or Framer Motion for React. This is what separates "nice" from "$10k." 5. Iterate on feel, not code. Preview it, then give Fable specific notes ("slower fade, more spacing on mobile") until it lands. Bookmark this

Fokki

72,175 Aufrufe • vor 4 Monaten

🌵🪐one📷🧃day🗿🍄 i’ve been doing a one-image-a-day diary for a while now & really wanted something more enjoyable and personalized something that makes it easy to look back, feels fun, and adds little (time) pressure keep this little habit going built with cursor & xcode
0:13

🌵🪐one📷🧃day🗿🍄 i’ve been doing a one-image-a-day diary for a while now & really wanted something more enjoyable and personalized something that makes it easy to look back, feels fun, and adds little (time) pressure keep this little habit going built with cursor & xcode

sam

219,558 Aufrufe • vor 2 Jahren

It was fun, for a little while. Video courtesy: CHICAGO CRITTER.
0:10

It was fun, for a little while. Video courtesy: CHICAGO CRITTER.

Chicago Contrarian

195,211 Aufrufe • vor 3 Jahren

🐧 we also filmed the hooligan challenge as short form content 🧸 that’s right! 🐿️ we’ve been doing a lot of fun short form content lately and a lot of fun things will be coming out 🦊 (dancing to ‘hooligan’) 🐧 the choreography was cool 🦊 it was really cool
0:11

🐧 we also filmed the hooligan challenge as short form content 🧸 that’s right! 🐿️ we’ve been doing a lot of fun short form content lately and a lot of fun things will be coming out 🦊 (dancing to ‘hooligan’) 🐧 the choreography was cool 🦊 it was really cool

💬

109,947 Aufrufe • vor 7 Monaten

Q: A deal of ownership for Greenland? Trump: It is a little bit complex. We will explain it down the line. It is the kind of a deal that I wanted to be able to make. Source: CNBC
0:14

Q: A deal of ownership for Greenland? Trump: It is a little bit complex. We will explain it down the line. It is the kind of a deal that I wanted to be able to make. Source: CNBC

Clash Report

32,298 Aufrufe • vor 9 Monaten

A component to test API Responses, designed in Paper, animated with Motion
0:16

A component to test API Responses, designed in Paper, animated with Motion

Jeet

18,386 Aufrufe • vor 6 Monaten

I always compared these #Elemental shots to building a ship in a bottle - I wasn’t able to hide the set while animating because it was integral to Ember and Wade’s motion, so I was stuck in the crack along with them. So many headaches in this little space!
0:16

I always compared these #Elemental shots to building a ship in a bottle - I wasn’t able to hide the set while animating because it was integral to Ember and Wade’s motion, so I was stuck in the crack along with them. So many headaches in this little space!

Cody Lyon

112,970 Aufrufe • vor 3 Jahren

I built a clone of the Yeezy store with Next.js. This was a fun challenge — the site has some smooth animations and feels very fast. But it was bothering me that I couldn't use the browser back button. Can we do better? So I rebuilt the site with v0 and Motion. Here's how it works: 1. When you click on a product, Motion is able to animate the original position of the product in the grid, to the zoomed in product detail page. 2. During this transition, we also shallow update the URL with the `/p/slug` route for the page. 3. If you press the back button in the navbar, or use the browser back button, or press escape — all options will take you back to the main product listing page. 4. If you reload the page while looking at a product, or someone sends you a link to a specific product, it still works! This is the best parts of a SPA and MPA mixed together. In the future, I can make this even better with View Transitions (I wasn't able to get the product animation just right, but if you can I'd love to see it!). I also took some creative liberties from the original design. The whole 1/2/3 size thing, where you needed to click the "?" to see SM/MD/LG was strange, so I just went directly to those sizes. Similarly, I prefered the more traditional style sheet/modal with the background color change, versus the full screen takeover. If you wanted to actually hook this up to Shopify now, you can swap the cart implementation with Next.js Commerce, which has all the APIs you need + optimistic writes 🔥 Should I make a video walking through the code?
0:16

I built a clone of the Yeezy store with Next.js. This was a fun challenge — the site has some smooth animations and feels very fast. But it was bothering me that I couldn't use the browser back button. Can we do better? So I rebuilt the site with v0 and Motion. Here's how it works: 1. When you click on a product, Motion is able to animate the original position of the product in the grid, to the zoomed in product detail page. 2. During this transition, we also shallow update the URL with the `/p/slug` route for the page. 3. If you press the back button in the navbar, or use the browser back button, or press escape — all options will take you back to the main product listing page. 4. If you reload the page while looking at a product, or someone sends you a link to a specific product, it still works! This is the best parts of a SPA and MPA mixed together. In the future, I can make this even better with View Transitions (I wasn't able to get the product animation just right, but if you can I'd love to see it!). I also took some creative liberties from the original design. The whole 1/2/3 size thing, where you needed to click the "?" to see SM/MD/LG was strange, so I just went directly to those sizes. Similarly, I prefered the more traditional style sheet/modal with the background color change, versus the full screen takeover. If you wanted to actually hook this up to Shopify now, you can swap the cart implementation with Next.js Commerce, which has all the APIs you need + optimistic writes 🔥 Should I make a video walking through the code?

Lee Robinson

148,937 Aufrufe • vor 1 Jahr