Загрузка видео...

Не удалось загрузить видео

На главную

Design Engineering Tip: One CSS property is responsible for most ugly expand animations. It’s height: auto. Replace it with: grid-template-rows: 0fr → 1fr;

gabriell_lab's profile picture

Gabriel

8,870 subscribers

110,624 просмотров • 2 месяцев назад •via X (Twitter)

ОбразованиеНаука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 0

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

Похожие видео

Design Engineering Tip If your modal scrolls like this, you’re probably missing one CSS property: overscroll-behavior: contain; It prevents the page behind the modal from scrolling when users reach the top or bottom.
0:11

Design Engineering Tip If your modal scrolls like this, you’re probably missing one CSS property: overscroll-behavior: contain; It prevents the page behind the modal from scrolling when users reach the top or bottom.

Gabriel

29,144 просмотров • 1 месяц назад

Probably the most annoying thing for me in animations / scrollable content is how easy it is to just clip the content. Even if there is no border around to clip it with, adding masks is a one-liner in css now. (slowed down transition)
0:11

Probably the most annoying thing for me in animations / scrollable content is how easy it is to just clip the content. Even if there is no border around to clip it with, adding masks is a one-liner in css now. (slowed down transition)

Dima Belyaev

27,653 просмотров • 8 месяцев назад

Someone just broke the paywall on Claude Design… and almost no one noticed. It’s called Open Design. No subscription. No limits. No “Pro plan required.” Just raw access. 👉 Turn prompts into real UI/UX 👉 Generate designs with Claude 👉 Replace expensive design tools 👉 Fully customizable (open source) This isn’t a tool. It’s a shortcut around the entire design economy. Most people will ignore this. A few will build insane things with it. Guess which side wins. Save this before it explodes Repo:
0:14

Someone just broke the paywall on Claude Design… and almost no one noticed. It’s called Open Design. No subscription. No limits. No “Pro plan required.” Just raw access. 👉 Turn prompts into real UI/UX 👉 Generate designs with Claude 👉 Replace expensive design tools 👉 Fully customizable (open source) This isn’t a tool. It’s a shortcut around the entire design economy. Most people will ignore this. A few will build insane things with it. Guess which side wins. Save this before it explodes Repo:

Leonard Rodman

29,227 просмотров • 4 месяцев назад

You all watch Geo-Engineering with your own eyes - look at the abrupt change - takes hours. Now The State of Florida just banned Aircraft responsible for Geo-Engineering from all its Airports ‼️ The fightback has begun - clearly happening, anyone who says it’s still just a Conspiracy is just simply ignorant - you witness it in real time.
0:10

You all watch Geo-Engineering with your own eyes - look at the abrupt change - takes hours. Now The State of Florida just banned Aircraft responsible for Geo-Engineering from all its Airports ‼️ The fightback has begun - clearly happening, anyone who says it’s still just a Conspiracy is just simply ignorant - you witness it in real time.

Concerned Citizen

12,260 просмотров • 11 месяцев назад

Ready for takeoff ✈️👨‍✈️ Rocking the new twinkx X-Force vegan leather outfit today. The pilot pants and bomber jacket is a bold signature design, but with smooth internal nylon lining, it’s easy to slip on. It’s honestly one of the most comfortable outfits from TwinkX
0:17

Ready for takeoff ✈️👨‍✈️ Rocking the new twinkx X-Force vegan leather outfit today. The pilot pants and bomber jacket is a bold signature design, but with smooth internal nylon lining, it’s easy to slip on. It’s honestly one of the most comfortable outfits from TwinkX

Steven Wu | Sportswear

15,585 просмотров • 6 месяцев назад

Kirato Hitaka breaks the world record for most skips in a single rope jump with 8 skips in one revolution. It’s almost impossible to catch in real time, but once they slow it down, you realize how insane it actually is.
0:15

Kirato Hitaka breaks the world record for most skips in a single rope jump with 8 skips in one revolution. It’s almost impossible to catch in real time, but once they slow it down, you realize how insane it actually is.

Dudes Posting Their W’s

792,536 просмотров • 4 месяцев назад

With Claude Fable 5 making software creation more accessible, interaction design is becoming an even bigger differentiator. So here is a Design Engineering Tip: Most interfaces wait for users to act. Better interfaces prepare for what users are about to do. This pattern is called Input Anticipation. By reacting to intent before an interaction happens, products feel faster, smarter, and easier to use. JS const box = document.querySelector(".input") const ring = document.querySelector(".focus-ring") addEventListener("pointermove", (e) => { const r = box.getBoundingClientRect() const dx = Math.max(r.left - e.clientX, 0, e.clientX - r.right) const dy = Math.max(r. top - e.clientY, 0, e.clientY - r.bottom) const distance = Math.hypot(dx, dy) const intent = Math.max(0, 1 - distance / 180) ** 2 ring. style.opacity = intent }) Save this for later.
0:16

With Claude Fable 5 making software creation more accessible, interaction design is becoming an even bigger differentiator. So here is a Design Engineering Tip: Most interfaces wait for users to act. Better interfaces prepare for what users are about to do. This pattern is called Input Anticipation. By reacting to intent before an interaction happens, products feel faster, smarter, and easier to use. JS const box = document.querySelector(".input") const ring = document.querySelector(".focus-ring") addEventListener("pointermove", (e) => { const r = box.getBoundingClientRect() const dx = Math.max(r.left - e.clientX, 0, e.clientX - r.right) const dy = Math.max(r. top - e.clientY, 0, e.clientY - r.bottom) const distance = Math.hypot(dx, dy) const intent = Math.max(0, 1 - distance / 180) ** 2 ring. style.opacity = intent }) Save this for later.

Gabriel

39,344 просмотров • 2 месяцев назад

Even while maintaining the boycott, we sincerely ask for your help in mass-emailing the company regarding Mashiro’s well-being. As you can see, in her most recent stream, she appeared with bruises, which is deeply concerning for her health. Unfortunately, the company is the only entity we can reach out to in order to voice our concerns. MADEIN is 7, and it’s our responsibility to protect each and every one of them. 🔗 TEMPLATE Thank you for your support.
0:18

Even while maintaining the boycott, we sincerely ask for your help in mass-emailing the company regarding Mashiro’s well-being. As you can see, in her most recent stream, she appeared with bruises, which is deeply concerning for her health. Unfortunately, the company is the only entity we can reach out to in order to voice our concerns. MADEIN is 7, and it’s our responsibility to protect each and every one of them. 🔗 TEMPLATE Thank you for your support.

Protect MADEIN

404,424 просмотров • 1 год назад

MOST PEOPLE WHO BUILD WEBSITES USE CLAUDE CODE THE WRONG WAY A few people train it properly and get the bottom one. The difference is not the model. It is the skills you feed it. Regular Claude without web-design systems produces clean but average product pages. The same Claude, loaded with the right skills, starts delivering sites that look like they cost $5,000. Those skills are free right now. They live on GitHub. The exact names sit in the article below. One set of prompts. One trained workflow. Suddenly every luxury brand page you build stops looking like a template and starts looking like money.
0:18

MOST PEOPLE WHO BUILD WEBSITES USE CLAUDE CODE THE WRONG WAY A few people train it properly and get the bottom one. The difference is not the model. It is the skills you feed it. Regular Claude without web-design systems produces clean but average product pages. The same Claude, loaded with the right skills, starts delivering sites that look like they cost $5,000. Those skills are free right now. They live on GitHub. The exact names sit in the article below. One set of prompts. One trained workflow. Suddenly every luxury brand page you build stops looking like a template and starts looking like money.

Romario

295,855 просмотров • 1 месяц назад

🏜️ I set out to explore one of the most mysterious and luxurious off-grid properties in Joshua Tree… @LostMoonRanch. With a hidden airplane hangar, secret cave, and panoramic desert views, this place feels like something out of a movie. In this video, I’ll take you inside the ranch, share the story behind it, and show you what it’s like to throw a party in the middle of the desert. From the architecture to the isolation, every corner of this property tells a story of creativity, freedom, and desert magic. If you love off-grid living, unique properties, desert exploration, or Joshua Tree adventures, this one’s for you! LIVE ON MY CHANNEL 🎥 Fieldtrip #youtube #outdoorshower #joshuatree
0:13

🏜️ I set out to explore one of the most mysterious and luxurious off-grid properties in Joshua Tree… @LostMoonRanch. With a hidden airplane hangar, secret cave, and panoramic desert views, this place feels like something out of a movie. In this video, I’ll take you inside the ranch, share the story behind it, and show you what it’s like to throw a party in the middle of the desert. From the architecture to the isolation, every corner of this property tells a story of creativity, freedom, and desert magic. If you love off-grid living, unique properties, desert exploration, or Joshua Tree adventures, this one’s for you! LIVE ON MY CHANNEL 🎥 Fieldtrip #youtube #outdoorshower #joshuatree

Janna Breslin

42,276 просмотров • 10 месяцев назад

(1/3) Sanctum has acquired Ironforge. At its peak, the Ironforge team handled up to one-third of all Solana transaction volume, making it one of the ecosystem’s most trusted transaction layers. The acquisition brings Ironforge’s battle-tested architecture and the team behind it into Sanctum, making our engineering team stronger than ever. “When it comes to building reliable infrastructure, the Ironforge team is unmatched, and their product completes our stack. Together, we’ve been able to build [redacted] in record time, which allows us to expand into a brand new vertical. They build like we do: fast, reliably, and with real conviction.” - fp 🌱 A full product reveal is imminent. Stay tuned for our next update!
0:12

(1/3) Sanctum has acquired Ironforge. At its peak, the Ironforge team handled up to one-third of all Solana transaction volume, making it one of the ecosystem’s most trusted transaction layers. The acquisition brings Ironforge’s battle-tested architecture and the team behind it into Sanctum, making our engineering team stronger than ever. “When it comes to building reliable infrastructure, the Ironforge team is unmatched, and their product completes our stack. Together, we’ve been able to build [redacted] in record time, which allows us to expand into a brand new vertical. They build like we do: fast, reliably, and with real conviction.” - fp 🌱 A full product reveal is imminent. Stay tuned for our next update!

Sanctum ☁️

78,057 просмотров • 1 год назад

A vehicle is seen with possibly one of the most controversial ways of advertising you’ll see On the top of the car is the advertisement… A closer look and it says Northrop Grumman. The United States Military contractor I thought this had to be fake or a mistake, but it’s not. Northrop Grumman runs a lot of vehicle advertising campaigns This design choice is just very…. Interesting…
0:19

A vehicle is seen with possibly one of the most controversial ways of advertising you’ll see On the top of the car is the advertisement… A closer look and it says Northrop Grumman. The United States Military contractor I thought this had to be fake or a mistake, but it’s not. Northrop Grumman runs a lot of vehicle advertising campaigns This design choice is just very…. Interesting…

Wall Street Apes

56,503 просмотров • 4 месяцев назад

MOST PEOPLE WHO BUILD WEBSITES USE CLAUDE THE WRONG WAY A few train it properly and get the bottom one. The difference is not the model. It is the skills you feed it. Regular Claude without design systems produces clean but average product pages. Same model loaded with the right skills starts delivering sites that look like they cost $7,000. Dark garage hero. Black Porsche under spotlights. Compound bottles that feel expensive. Smooth scroll reveals. Zero templates. Those skills are free right now. They live on GitHub. One trained workflow. Suddenly every detailing brand page stops looking like a template and starts looking like money.
0:19

MOST PEOPLE WHO BUILD WEBSITES USE CLAUDE THE WRONG WAY A few train it properly and get the bottom one. The difference is not the model. It is the skills you feed it. Regular Claude without design systems produces clean but average product pages. Same model loaded with the right skills starts delivering sites that look like they cost $7,000. Dark garage hero. Black Porsche under spotlights. Compound bottles that feel expensive. Smooth scroll reveals. Zero templates. Those skills are free right now. They live on GitHub. One trained workflow. Suddenly every detailing brand page stops looking like a template and starts looking like money.

Romario

31,481 просмотров • 22 дней назад

I Made 16 High Quality EDITABLE Iphone Mockups with Midjourney AI. Great design isn't all you need to standout, Presentation is one of the most important aspects — You can grab these for free. 🔥 Dropping in 24H, grab it for free! To get your copy: 1️⃣ Like ❤️ 2️⃣ Comment 'SEND' ✉️ 3️⃣ Give us a 🔁 for the community! (Must be following for DM access)
0:16

I Made 16 High Quality EDITABLE Iphone Mockups with Midjourney AI. Great design isn't all you need to standout, Presentation is one of the most important aspects — You can grab these for free. 🔥 Dropping in 24H, grab it for free! To get your copy: 1️⃣ Like ❤️ 2️⃣ Comment 'SEND' ✉️ 3️⃣ Give us a 🔁 for the community! (Must be following for DM access)

Kadao

125,573 просмотров • 2 лет назад

We have FINALLY solved how to generate infinite static ads completely on autopilot (including copy) and put them in a Drive folder, with ZERO human intervention necessary: 1. Generate ChatGPT headlines and push them into Google Sheets with Zapier. 2. Create one or several design templates for your brand in using their Canva integration 3. Set up a Zap that pushes your Google Sheet copy into the Switchboard template. It will automatically handle text formatting and centering 4. Auto upload the completed design file into Google Drive with Zapier You can do this with infinite design templates and different sources of copy (website reviews, subreddits, etc) so you ALWAYS have brand new ads READY TO GO, organized in the Drive folder of your choice for someone on your team to review and launch. The copy refreshes weekly in this zap according to your prompt. Comment if you want the SOP document for this that outlines it step-by-step!
0:18

We have FINALLY solved how to generate infinite static ads completely on autopilot (including copy) and put them in a Drive folder, with ZERO human intervention necessary: 1. Generate ChatGPT headlines and push them into Google Sheets with Zapier. 2. Create one or several design templates for your brand in using their Canva integration 3. Set up a Zap that pushes your Google Sheet copy into the Switchboard template. It will automatically handle text formatting and centering 4. Auto upload the completed design file into Google Drive with Zapier You can do this with infinite design templates and different sources of copy (website reviews, subreddits, etc) so you ALWAYS have brand new ads READY TO GO, organized in the Drive folder of your choice for someone on your team to review and launch. The copy refreshes weekly in this zap according to your prompt. Comment if you want the SOP document for this that outlines it step-by-step!

Peter Czepiga

26,109 просмотров • 1 год назад

One of the most common mistakes manufacturers make is relying on engineering logic to shape user behavior, while ignoring how users actually feel. Engineers often believe that as long as a feature exists, moves, or looks different, users will appreciate it. Users, however, care about something much simpler: whether the experience feels natural, refined, and intuitive. Great user experience is never created by stacking options. It is created by coherence and emotional consistency. Samsung’s recent update to Lock Star is a clear example. The new version introduces unlock animations that appear to add playfulness, yet the real experience feels disappointing. Many of these animations come across as childish, low level, poorly connected, and mechanically rigid. They feel closer to children’s UI effects than something designed for Samsung’s broad premium user base. The issue is not the presence of animations themselves. The problem lies in the mindset behind them. These effects are clearly driven by implementation logic rather than user perception. The assumption seems to be that adding visual flair automatically creates delight, while ignoring rhythm, emotional tone, and aesthetic maturity. This reflects a long standing pattern in Samsung’s software design. Random stickers, cartoon like emojis, and decorative elements often appear without a cohesive design language. There is a belief that younger users are attracted to these visuals, yet for Gen Z, such elements often feel outdated, immature, and disconnected from a premium identity. Strong product design allows user experience to constrain engineering decisions. When engineering begins to entertain itself, users quietly begin to disengage. Let's see how far apart Samsung and Xiaomi are.
0:07

One of the most common mistakes manufacturers make is relying on engineering logic to shape user behavior, while ignoring how users actually feel. Engineers often believe that as long as a feature exists, moves, or looks different, users will appreciate it. Users, however, care about something much simpler: whether the experience feels natural, refined, and intuitive. Great user experience is never created by stacking options. It is created by coherence and emotional consistency. Samsung’s recent update to Lock Star is a clear example. The new version introduces unlock animations that appear to add playfulness, yet the real experience feels disappointing. Many of these animations come across as childish, low level, poorly connected, and mechanically rigid. They feel closer to children’s UI effects than something designed for Samsung’s broad premium user base. The issue is not the presence of animations themselves. The problem lies in the mindset behind them. These effects are clearly driven by implementation logic rather than user perception. The assumption seems to be that adding visual flair automatically creates delight, while ignoring rhythm, emotional tone, and aesthetic maturity. This reflects a long standing pattern in Samsung’s software design. Random stickers, cartoon like emojis, and decorative elements often appear without a cohesive design language. There is a belief that younger users are attracted to these visuals, yet for Gen Z, such elements often feel outdated, immature, and disconnected from a premium identity. Strong product design allows user experience to constrain engineering decisions. When engineering begins to entertain itself, users quietly begin to disengage. Let's see how far apart Samsung and Xiaomi are.

Ice Universe

59,712 просмотров • 7 месяцев назад

I built a full 3D #lego brick builder using Claude 4.6. Took 12 iterations. Runs entirely in the browser. You pick a brick size, pick a color, and click to place. Snap-to-grid, collision detection, ghost preview, it feels like building with real bricks. But the fun part? Hit one of the template buttons and watch it auto-build a pyramid, a rocket, a house, or an Eiffel Tower. Bricks fly in from random directions, spin through the air, and snap into place with particle bursts. tech stack: → #Threejs for the full 3D scene → #Raycasting for click-to-place → Custom wedge geometry for slope bricks → Quadratic Bézier curves for the fly-in animations → #2d canvas particle system layered on top of the 3D scene → #InstancedMesh for the base plate studs The product potential: this could become a real educational toy. Kids (or adults) building in the browser, sharing creations, loading custom templates. No install, no app store. ( LEGO you may like this one! ) Want to try it? Link in the first comment 👇
0:17

I built a full 3D #lego brick builder using Claude 4.6. Took 12 iterations. Runs entirely in the browser. You pick a brick size, pick a color, and click to place. Snap-to-grid, collision detection, ghost preview, it feels like building with real bricks. But the fun part? Hit one of the template buttons and watch it auto-build a pyramid, a rocket, a house, or an Eiffel Tower. Bricks fly in from random directions, spin through the air, and snap into place with particle bursts. tech stack: → #Threejs for the full 3D scene → #Raycasting for click-to-place → Custom wedge geometry for slope bricks → Quadratic Bézier curves for the fly-in animations → #2d canvas particle system layered on top of the 3D scene → #InstancedMesh for the base plate studs The product potential: this could become a real educational toy. Kids (or adults) building in the browser, sharing creations, loading custom templates. No install, no app store. ( LEGO you may like this one! ) Want to try it? Link in the first comment 👇

Hasan Aboul Hasan

13,762 просмотров • 5 месяцев назад

🏜️ I set out to explore one of the most mysterious and luxurious off-grid properties in Joshua Tree… @LostMoonRanch. With a hidden airplane hangar, secret cave, and panoramic desert views, this place feels like something out of a movie. In this video on my channel, I’ll take you inside the ranch, share the story behind it, and show you what it’s like to throw a party in the middle of the desert. From the architecture to the isolation, every corner of this property tells a story of creativity, freedom, and desert magic. If you love off-grid living, unique properties, desert exploration, or Joshua Tree adventures, this one’s for you! LIVE ON MY CHANNEL 🎥 Fieldtrip #joshuatree #lostmoonranch #gtfoutside #yoga
0:13

🏜️ I set out to explore one of the most mysterious and luxurious off-grid properties in Joshua Tree… @LostMoonRanch. With a hidden airplane hangar, secret cave, and panoramic desert views, this place feels like something out of a movie. In this video on my channel, I’ll take you inside the ranch, share the story behind it, and show you what it’s like to throw a party in the middle of the desert. From the architecture to the isolation, every corner of this property tells a story of creativity, freedom, and desert magic. If you love off-grid living, unique properties, desert exploration, or Joshua Tree adventures, this one’s for you! LIVE ON MY CHANNEL 🎥 Fieldtrip #joshuatree #lostmoonranch #gtfoutside #yoga

Janna Breslin

26,630 просмотров • 10 месяцев назад

Hailuo MiniMax Design H3 is quickly becoming one of my favorite tools for creating music videos. You can experiment with wildly different visual styles, transitions, effects, and ideas, the creative possibilities feel almost endless. And the best part? It’s incredibly fun to use. I’m sharing the prompt below so you can try it yourself 👇
0:15

Hailuo MiniMax Design H3 is quickly becoming one of my favorite tools for creating music videos. You can experiment with wildly different visual styles, transitions, effects, and ideas, the creative possibilities feel almost endless. And the best part? It’s incredibly fun to use. I’m sharing the prompt below so you can try it yourself 👇

OscarAI

12,295 просмотров • 5 дней назад

CLIENT ASKED 20 YEAR OLD TO BUILD A "SIMPLE" WEBSITE THIS IS WHAT IT DELIVERED most websites look like this: -> Hero section -> Some text -> A few buttons -> Done Claude had other plans Here's what it built: -> Cinematic landing page with immersive animations -> Interactive particle effects -> Smooth scroll storytelling -> Premium UI inspired by Apple and luxury brands -> Responsive design without sacrificing performance → Production ready code in minutes the crazy part? there was no design agency no frontend team no weeks of back and forth revisions just one prompt and Claude Code while most developers are using AI to autocomplete code others are using it to build experiences that would've taken an entire team the gap isn't AI anymore it is imagination Bookmark this before every website starts looking like this
0:12

CLIENT ASKED 20 YEAR OLD TO BUILD A "SIMPLE" WEBSITE THIS IS WHAT IT DELIVERED most websites look like this: -> Hero section -> Some text -> A few buttons -> Done Claude had other plans Here's what it built: -> Cinematic landing page with immersive animations -> Interactive particle effects -> Smooth scroll storytelling -> Premium UI inspired by Apple and luxury brands -> Responsive design without sacrificing performance → Production ready code in minutes the crazy part? there was no design agency no frontend team no weeks of back and forth revisions just one prompt and Claude Code while most developers are using AI to autocomplete code others are using it to build experiences that would've taken an entire team the gap isn't AI anymore it is imagination Bookmark this before every website starts looking like this

0xSlyth

17,945 просмотров • 2 месяцев назад