Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

Design Engineering Tip: If you struggle to describe button or card hover states in Claude or Codex, these commonly used hover effect terms can help.

gabriell_lab's profile picture

Gabriel

8,816 subscribers

37,882 Aufrufe • vor 2 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

New in Jupiter Desktop Wallet: Hover over any token ticker on Twitter, Google or Claude and its price chart pops up instantly with a swap button. The Most Powerful Trading Wallet on Solana Install now using the Link Below 👇
0:19

New in Jupiter Desktop Wallet: Hover over any token ticker on Twitter, Google or Claude and its price chart pops up instantly with a swap button. The Most Powerful Trading Wallet on Solana Install now using the Link Below 👇

Jupiter

58,882 Aufrufe • vor 6 Monaten

📌📌📌📌📌📌📌 You can now hover to pin chats and projects on web, then organize Recents however you like: together in one list or grouped by project
0:13

📌📌📌📌📌📌📌 You can now hover to pin chats and projects on web, then organize Recents however you like: together in one list or grouped by project

ChatGPT

198,449 Aufrufe • vor 3 Monaten

Hailuo MiniMax Design MiniMax Design (H3) MiniMax (official) Another Prototype Another Test - PASSED SOLESHIFT° A playful footwear e-commerce concept where every cursor hover transforms the shoe, typography, colors and motion graphics. No single text error or inaccuracy throughout all the video. The model passed the followings successfully - Animated Shape Layers - Kinetic Typography - Cursor Hover Update - Bounce Effects - Wiggle Effects - Live Background - Micro Text Renders - Ease in Ease out Keyframes Tip: Use Visual Hierarchy - One of the most essential core design principle. Prompt & Workflow below
0:15

Hailuo MiniMax Design MiniMax Design (H3) MiniMax (official) Another Prototype Another Test - PASSED SOLESHIFT° A playful footwear e-commerce concept where every cursor hover transforms the shoe, typography, colors and motion graphics. No single text error or inaccuracy throughout all the video. The model passed the followings successfully - Animated Shape Layers - Kinetic Typography - Cursor Hover Update - Bounce Effects - Wiggle Effects - Live Background - Micro Text Renders - Ease in Ease out Keyframes Tip: Use Visual Hierarchy - One of the most essential core design principle. Prompt & Workflow below

Shams

44,151 Aufrufe • vor 1 Monat

Added new transitions to There are now 21 transitions you can copy as CSS or React code or use as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev
0:15

Added new transitions to There are now 21 transitions you can copy as CSS or React code or use as a skill for Claude, Cursor or Codex npx skills add jakubantalik/transitions.dev

Jakub Antalik

219,105 Aufrufe • vor 3 Monaten

Added 12 new transitions to 33 total You can copy as CSS or React code or use as a skill for Claude, Cursor or Codex or use with Refine tool npx skills add jakubantalik/transitions.dev
0:13

Added 12 new transitions to 33 total You can copy as CSS or React code or use as a skill for Claude, Cursor or Codex or use with Refine tool npx skills add jakubantalik/transitions.dev

Jakub Antalik

74,750 Aufrufe • vor 2 Monaten

Design Engineering Tip Make hover interactions respond to where the cursor actually comes from. Instead of revealing content with the same animation every time, detect the cursor entry direction and move the image + content accordingly. It makes a simple card feel much more spatial and responsive. const direction = getDirection(event, ref.current); const variants = { top: { y: 20 }, bottom: { y: -20 }, left: { x: 20 }, right: { x: -20 }, };
0:16

Design Engineering Tip Make hover interactions respond to where the cursor actually comes from. Instead of revealing content with the same animation every time, detect the cursor entry direction and move the image + content accordingly. It makes a simple card feel much more spatial and responsive. const direction = getDirection(event, ref.current); const variants = { top: { y: 20 }, bottom: { y: -20 }, left: { x: 20 }, right: { x: -20 }, };

Gabriel

18,508 Aufrufe • vor 1 Monat

Shopify should work wherever merchants work. We now have Claude, ChatGPT, and Perplexity connectors. If you prefer a CLI or IDE, our AI Toolkit works with Claude Code, Codex, and Cursor. If you don’t have a store yet, vibe code one in v0, Manus, Replit, or Lovable.
0:18

Shopify should work wherever merchants work. We now have Claude, ChatGPT, and Perplexity connectors. If you prefer a CLI or IDE, our AI Toolkit works with Claude Code, Codex, and Cursor. If you don’t have a store yet, vibe code one in v0, Manus, Replit, or Lovable.

tobi lutke

26,039 Aufrufe • vor 3 Monaten

made this with text to lottie and claude code my workflow: design something in figma or just make a rough draft. then ask claude to animate it you'd be surprised how easy it is to add easings, masks, transforms, text effects and all the motion details you can also ask claude to export it as a gif, mp4, png sequence, resize it in different aspect ratios claude and codex already creates something with taste and if you know what you want to create, this workflow is really useful and btw, it's free
0:19

made this with text to lottie and claude code my workflow: design something in figma or just make a rough draft. then ask claude to animate it you'd be surprised how easy it is to add easings, masks, transforms, text effects and all the motion details you can also ask claude to export it as a gif, mp4, png sequence, resize it in different aspect ratios claude and codex already creates something with taste and if you know what you want to create, this workflow is really useful and btw, it's free

Doruk

14,966 Aufrufe • vor 3 Monaten

Super useful collection of texts that are commonly used around the web! 🚀🔖 Copy book is a collection of commonly used texts. So whenever you need a copy for a design or if you ever get stuck in the middle of development, you can use copy book. Here's the link: By Praveen Juge #ux #uxdesign #ui #uidesign #productdesign #userexperience #webdesign #psychology #research #uxresearch #usertesting #usability #uxmethods #prototype #designresearch #ecommerce #webdesign #visualdesign #figma
0:15

Super useful collection of texts that are commonly used around the web! 🚀🔖 Copy book is a collection of commonly used texts. So whenever you need a copy for a design or if you ever get stuck in the middle of development, you can use copy book. Here's the link: By Praveen Juge #ux #uxdesign #ui #uidesign #productdesign #userexperience #webdesign #psychology #research #uxresearch #usertesting #usability #uxmethods #prototype #designresearch #ecommerce #webdesign #visualdesign #figma

UX Links

10,349 Aufrufe • vor 2 Jahren

We're building After Effects for the web. Vector animation that goes from design to production, built on Lottie, the industry-standard for product animation. Describe what you want and Motion Copilot animates it, or generate Lottie straight from Codex/Claude with our MCP. All in the browser. This is Lottie Creator 2.0. The biggest update we've ever shipped.
0:10

We're building After Effects for the web. Vector animation that goes from design to production, built on Lottie, the industry-standard for product animation. Describe what you want and Motion Copilot animates it, or generate Lottie straight from Codex/Claude with our MCP. All in the browser. This is Lottie Creator 2.0. The biggest update we've ever shipped.

Nattu

20,973 Aufrufe • vor 2 Monaten

If you’re looking for a new design or engineering role this is probably the best place to search. I’ll add the link in the thread
0:18

If you’re looking for a new design or engineering role this is probably the best place to search. I’ll add the link in the thread

Design Chief Priest

28,892 Aufrufe • vor 5 Monaten

Smol tip: pasting long text into Claude Code collapses it into [Pasted text #1]. If you need to edit it you can paste again to expand. Or, Ctrl+G to open the whole prompt in your code editor. Saved changes sync back to Claude's input field.
0:14

Smol tip: pasting long text into Claude Code collapses it into [Pasted text #1]. If you need to edit it you can paste again to expand. Or, Ctrl+G to open the whole prompt in your code editor. Saved changes sync back to Claude's input field.

Delba

90,399 Aufrufe • vor 2 Monaten

Raise your hand if you want quick answers and personalized help right on your wrist ✋ With Raise to Talk on #PixelWatch, you can now get help from Gemini hands-free—no button presses or “Hey Google” needed.¹ #MadeByGoogle
0:10

Raise your hand if you want quick answers and personalized help right on your wrist ✋ With Raise to Talk on #PixelWatch, you can now get help from Gemini hands-free—no button presses or “Hey Google” needed.¹ #MadeByGoogle

Made by Google

29,882 Aufrufe • vor 1 Jahr

Hailuo MiniMax (official) MiniMax Design (H3) H3 A prototype motion-graphics landing page for ice cream, built to test just how far H3 can push UI animation, typography, transitions, hover interactions, and product motion. I tried creating similar effects manually in Adobe After Effects but this version is 100% generated with H3. The model handles these complex motion-design elements incredibly well, and the results are STUNNING - Animated Shape Layers - Kinetic Typography - Cursor Hover Update - Bounce Effects - Wiggle Effects - Live Background - Micro Text Renders - Ease in Ease out Keyframes Prompt Below
0:15

Hailuo MiniMax (official) MiniMax Design (H3) H3 A prototype motion-graphics landing page for ice cream, built to test just how far H3 can push UI animation, typography, transitions, hover interactions, and product motion. I tried creating similar effects manually in Adobe After Effects but this version is 100% generated with H3. The model handles these complex motion-design elements incredibly well, and the results are STUNNING - Animated Shape Layers - Kinetic Typography - Cursor Hover Update - Bounce Effects - Wiggle Effects - Live Background - Micro Text Renders - Ease in Ease out Keyframes Prompt Below

Shams

35,225 Aufrufe • vor 1 Monat

You’ve got to be kidding me. The power button is ON THE BOTTOM of the new M4 Mac Mini. So in order to power the computer on, you have to lift it or tip it forward. That is the dumbest design EVER. Who approved that?
0:13

You’ve got to be kidding me. The power button is ON THE BOTTOM of the new M4 Mac Mini. So in order to power the computer on, you have to lift it or tip it forward. That is the dumbest design EVER. Who approved that?

sysadafterdark

440,244 Aufrufe • vor 1 Jahr

These battleground states are ESSENTIAL to maintaining our razor thin Senate majority. But Republicans have already started their attacks in these make-or-break districts. Will you rush a $24 donation today to help keep these key seats blue in 2024?
0:18

These battleground states are ESSENTIAL to maintaining our razor thin Senate majority. But Republicans have already started their attacks in these make-or-break districts. Will you rush a $24 donation today to help keep these key seats blue in 2024?

Blue Senate

4,908,493 Aufrufe • vor 2 Jahren

"HOPEFULLY I CAN WIN THE BIDS OR ME AND LUIS CAN AGREE TERMS THIS WEEK" Eddie Hearn has confirmed that he intends to return to Liverpool with a STACKED card IF he wins the bids for Mundo vs Morrell Jr or can agree a deal for the fight. What fights/fighters would you like to see on that card? 🤔 Full interview with Eddie is available to watch HERE 🔗 #EddieHearn | #Liverpool | #SmithMorrell | #Boxing
0:19

"HOPEFULLY I CAN WIN THE BIDS OR ME AND LUIS CAN AGREE TERMS THIS WEEK" Eddie Hearn has confirmed that he intends to return to Liverpool with a STACKED card IF he wins the bids for Mundo vs Morrell Jr or can agree a deal for the fight. What fights/fighters would you like to see on that card? 🤔 Full interview with Eddie is available to watch HERE 🔗 #EddieHearn | #Liverpool | #SmithMorrell | #Boxing

IFL TV

17,573 Aufrufe • vor 8 Monaten

🐰: "So, in conclusion... is Charlotte Austin beautiful?" AI Voice: "If you mean the Charlotte Austin in real life, I don't have any visual data of her because I haven't seen her. But if you have a photo or can describe her features, I can help talk about her or offer an opinion." 🐰: "Fine, never mind. Just go to sleep!" //Someone train this AI! #PaseoLiveXCharlotte #ชาล็อตออสติน #CharlotteAustin
0:17

🐰: "So, in conclusion... is Charlotte Austin beautiful?" AI Voice: "If you mean the Charlotte Austin in real life, I don't have any visual data of her because I haven't seen her. But if you have a photo or can describe her features, I can help talk about her or offer an opinion." 🐰: "Fine, never mind. Just go to sleep!" //Someone train this AI! #PaseoLiveXCharlotte #ชาล็อตออสติน #CharlotteAustin

Prol_x

25,379 Aufrufe • vor 7 Monaten