Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

💡design engineering tip: if you are using toasts, don't just create new toasts and stack every toast on each other. it confuses users, and creates a lot of visual noice. 📷 instead, use a cycling animation (a single animation won't work due to the browsers nature) with a slight...

n___vc's profile picture

nick

2,750 subscribers

37,298 Aufrufe • vor 9 Tagen •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

Yo! That new animation looks promising, I really hope you will like it. I learned a lot of new animation tools for this teaser, and it was a lot of fun to make. Also tried using Koikatsu to create the hair, and I'm really happy with how it looks now.
0:13

Yo! That new animation looks promising, I really hope you will like it. I learned a lot of new animation tools for this teaser, and it was a lot of fun to make. Also tried using Koikatsu to create the hair, and I'm really happy with how it looks now.

WarlockDesu

18,897 Aufrufe • vor 6 Monaten

Design Engineering Tip: Most UI animations are built for a single uninterrupted transition. Real users might reverse direction before the animation finishes. Use a spring transition that preserves the element’s current velocity instead of restarting from zero. This keeps rapid hover, press, and state changes smooth and responsive. transition={{ type: "spring", stiffness: 520, damping: 38, }}
0:11

Design Engineering Tip: Most UI animations are built for a single uninterrupted transition. Real users might reverse direction before the animation finishes. Use a spring transition that preserves the element’s current velocity instead of restarting from zero. This keeps rapid hover, press, and state changes smooth and responsive. transition={{ type: "spring", stiffness: 520, damping: 38, }}

Gabriel

64,022 Aufrufe • vor 17 Tagen

I'm seeing a lot of people saying it is just a bad upscaling instead of Gen AI, but it is indeed Gen AI animation. There are things going on in it that just don't make any sense for puppet animation. Here are some parts that make it clear, I slowed down the video so it's easier to notice the chunky parts. I checked the past ADs and it's possible to notice details (from an animator's POV) that are common and make sense for human work, so it was definitely a choice to use AI on this new AD
0:16

I'm seeing a lot of people saying it is just a bad upscaling instead of Gen AI, but it is indeed Gen AI animation. There are things going on in it that just don't make any sense for puppet animation. Here are some parts that make it clear, I slowed down the video so it's easier to notice the chunky parts. I checked the past ADs and it's possible to notice details (from an animator's POV) that are common and make sense for human work, so it was definitely a choice to use AI on this new AD

mei ✨ live2d animator

1,114,561 Aufrufe • vor 7 Monaten

Design Engineering Tip Consider letting textareas grow with the content instead of introducing nested scrolling. It often creates a smoother writing experience and keeps forms easier to scan. CSS: textarea { field-sizing: content; }
0:14

Design Engineering Tip Consider letting textareas grow with the content instead of introducing nested scrolling. It often creates a smoother writing experience and keeps forms easier to scan. CSS: textarea { field-sizing: content; }

Gabriel

85,400 Aufrufe • vor 2 Monaten

lando: one of the people that i work most closely with is oscar. you have to help each other out, support each other. you learn a lot from one another and oscar’s just been a great guy, who’s just as quick and i’ve been able to learn a lot from him and share the journey together.
0:17

lando: one of the people that i work most closely with is oscar. you have to help each other out, support each other. you learn a lot from one another and oscar’s just been a great guy, who’s just as quick and i’ve been able to learn a lot from him and share the journey together.

ray

73,974 Aufrufe • vor 6 Monaten

Alright, now that we know *what* an agent is, how does it actually work? When you ask for help on a task, the agent plans a series of steps and executes them directly in the application on your behalf, using the tools it has access to. Say you are booking a local service or trying to organize your inbox (which typically takes multiple steps): the AI model first plans how to achieve the task using its existing knowledge and then interacts with your inbox to execute the task. The agent will continue until it is confident the task has been successfully completed.
0:15

Alright, now that we know *what* an agent is, how does it actually work? When you ask for help on a task, the agent plans a series of steps and executes them directly in the application on your behalf, using the tools it has access to. Say you are booking a local service or trying to organize your inbox (which typically takes multiple steps): the AI model first plans how to achieve the task using its existing knowledge and then interacts with your inbox to execute the task. The agent will continue until it is confident the task has been successfully completed.

Google AI

22,487 Aufrufe • vor 8 Monaten

Design Engineering Tip: Add friction at the end of a scroll interaction. When users reach the edge of a scrollable area, the movement should not just stop instantly. A subtle resistance, bounce, or slowdown can make the interface feel more physical and less mechanical. It helps users understand that they reached a boundary without needing extra labels or visual indicators. Used carefully, this can make scrolling feel more natural and closer to how objects behave in the real world.
0:12

Design Engineering Tip: Add friction at the end of a scroll interaction. When users reach the edge of a scrollable area, the movement should not just stop instantly. A subtle resistance, bounce, or slowdown can make the interface feel more physical and less mechanical. It helps users understand that they reached a boundary without needing extra labels or visual indicators. Used carefully, this can make scrolling feel more natural and closer to how objects behave in the real world.

Gabriel

24,503 Aufrufe • vor 24 Tagen

I've seen a lot of animatics lately that are super detailed, essentially viewport previews of the final shot. But an animatic at it's core doesn't need to be anything fancy. Its main purpose is to plan and test the timing, camera angles, movement, and overall composition. With animatics you have to keep in mind the following: Pre-visualization: It allows to see a basic version of the animation or scene before committing to detailed work. Timing and pacing: An animatic helps identify how long each scene or shot should last, ensuring that the timing feels right. Planning: It helps with layout, camera angles, and transitions. By visualizing the shots, the team can ensure that the framing and overall design of the scenes work well in 3D space. Efficiency: It allows the team to test and fix any potential issues early on, like awkward movements or awkward pacing, before spending time on high-quality rendering or complex animation. In short, an animatic helps in conceptualizing the final animation by giving a low-res, rough version of the scenes, which guides the entire production process in terms of visual design, timing, and storytelling.
0:12

I've seen a lot of animatics lately that are super detailed, essentially viewport previews of the final shot. But an animatic at it's core doesn't need to be anything fancy. Its main purpose is to plan and test the timing, camera angles, movement, and overall composition. With animatics you have to keep in mind the following: Pre-visualization: It allows to see a basic version of the animation or scene before committing to detailed work. Timing and pacing: An animatic helps identify how long each scene or shot should last, ensuring that the timing feels right. Planning: It helps with layout, camera angles, and transitions. By visualizing the shots, the team can ensure that the framing and overall design of the scenes work well in 3D space. Efficiency: It allows the team to test and fix any potential issues early on, like awkward movements or awkward pacing, before spending time on high-quality rendering or complex animation. In short, an animatic helps in conceptualizing the final animation by giving a low-res, rough version of the scenes, which guides the entire production process in terms of visual design, timing, and storytelling.

Voxyde

22,244 Aufrufe • vor 1 Jahr

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)
0:15

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)

Stitch by Google

219,087 Aufrufe • vor 4 Monaten

SOMEONE TURNED THEIR TEAM'S TASK TRACKER INTO A 3D ISLAND instead of a boring list of tasks, your teams work is a little island that grows as you get stuff done > you assign tasks right in slack, just type who its for, the points, and the due date > finish a task and you get to place a building on the island > get your work rejected and the building collapses into rubble > the rubble stays there forever, so everyone can see it > each new sprint starts a fresh island so over time the island fills up with buildings for all the work your team actually finished, and the rubble is a reminder of what got rejected. its open source, so any team can set it up. way more fun than staring at a to do list all day
0:13

SOMEONE TURNED THEIR TEAM'S TASK TRACKER INTO A 3D ISLAND instead of a boring list of tasks, your teams work is a little island that grows as you get stuff done > you assign tasks right in slack, just type who its for, the points, and the due date > finish a task and you get to place a building on the island > get your work rejected and the building collapses into rubble > the rubble stays there forever, so everyone can see it > each new sprint starts a fresh island so over time the island fills up with buildings for all the work your team actually finished, and the rubble is a reminder of what got rejected. its open source, so any team can set it up. way more fun than staring at a to do list all day

Om Patel

12,526 Aufrufe • vor 20 Tagen

At Uber a big problem for design teams and engineering teams was design source of truth. No one knew what the app truly looked like, so weekly a bunch of designers would get into a meeting room and check that the engineers correctly implemented the figma designs that they made Now with coding agents throughput of changes has increased an order of magnitude and it has become impossible to manually keep up. Here we used the Revyl CLI to create a flow of every state in the Uber design, by navigating our mobile use agent on an cloud iOS simulator. This is something that would have taken a team of designers tens of hours to recreate manually; All done in less than an hour asynchronously with a simple prompt. Enable your team to know what your users are actually seeing and empower coding agents to give your users a delightful experience without any blindspots Get started with our new free trial and create a map for your own app 🗺️
0:19

At Uber a big problem for design teams and engineering teams was design source of truth. No one knew what the app truly looked like, so weekly a bunch of designers would get into a meeting room and check that the engineers correctly implemented the figma designs that they made Now with coding agents throughput of changes has increased an order of magnitude and it has become impossible to manually keep up. Here we used the Revyl CLI to create a flow of every state in the Uber design, by navigating our mobile use agent on an cloud iOS simulator. This is something that would have taken a team of designers tens of hours to recreate manually; All done in less than an hour asynchronously with a simple prompt. Enable your team to know what your users are actually seeing and empower coding agents to give your users a delightful experience without any blindspots Get started with our new free trial and create a map for your own app 🗺️

Anam Hira

96,453 Aufrufe • vor 3 Monaten

HE DESCRIBED A SITE TO CLAUDE CODE AND WALKED AWAY FOR 8 MINUTES What came back looked like a studio spent weeks on it. The setup that made it work: > Two design skills installed - Claude stops using safe boring defaults. > Visual references instead of text descriptions. > One detailed prompt with the concept, Claude asks clarifying questions before building. First version already solid -> review pass, one batch of fixes, done. What used to take a designer and a developer and several weeks of handoffs now takes a single session and no coding experience. Full walkthrough in the article below ↓
0:16

HE DESCRIBED A SITE TO CLAUDE CODE AND WALKED AWAY FOR 8 MINUTES What came back looked like a studio spent weeks on it. The setup that made it work: > Two design skills installed - Claude stops using safe boring defaults. > Visual references instead of text descriptions. > One detailed prompt with the concept, Claude asks clarifying questions before building. First version already solid -> review pass, one batch of fixes, done. What used to take a designer and a developer and several weeks of handoffs now takes a single session and no coding experience. Full walkthrough in the article below ↓

slash1s

52,870 Aufrufe • vor 1 Monat

Let's take a look at the beautiful vivo OriginOS 6 ultrasonic fingerprint animation. The feature of this advanced animation is that it can have a relationship with the background and distort the background instead of floating on the surface like Samsung.
0:12

Let's take a look at the beautiful vivo OriginOS 6 ultrasonic fingerprint animation. The feature of this advanced animation is that it can have a relationship with the background and distort the background instead of floating on the surface like Samsung.

Ice Universe

50,648 Aufrufe • vor 8 Monaten

The MC customization screen is being fully redone with a lot of new features. Here's the first preview of it! You'll be able to choose any color you want for each layer (even using specific hex codes), give it a name, and save it for future use.
0:17

The MC customization screen is being fully redone with a lot of new features. Here's the first preview of it! You'll be able to choose any color you want for each layer (even using specific hex codes), give it a name, and save it for future use.

GB Patch Games 🦋

37,622 Aufrufe • vor 1 Jahr

GPT-5.6 Sol is unbelievably good at creating and editing videos. It can do motion design, product demos, and animations like this one I made by simply giving it a screen recording. GPT 5.6 has the best design taste and significantly outperforms Fable, which relies heavily on repetitive design patterns. To help you experiment with video editing on it, we just launched a collection of 100 ready-to-use skills that show what’s possible and help you get started with video editing using GPT-5.6. These skills can create anything from motion graphics launch videos for your product to a 3B1B-style science explainer video. You can also use them to edit existing videos: add captions, generate motion graphics, create voiceovers, redesign visual styles, translate into new languages, and much more. If you want access to the full library, comment “VIDEO SKILLS” and I’ll share it with you. (You'll have to follow me so I can DM you.)
0:11

GPT-5.6 Sol is unbelievably good at creating and editing videos. It can do motion design, product demos, and animations like this one I made by simply giving it a screen recording. GPT 5.6 has the best design taste and significantly outperforms Fable, which relies heavily on repetitive design patterns. To help you experiment with video editing on it, we just launched a collection of 100 ready-to-use skills that show what’s possible and help you get started with video editing using GPT-5.6. These skills can create anything from motion graphics launch videos for your product to a 3B1B-style science explainer video. You can also use them to edit existing videos: add captions, generate motion graphics, create voiceovers, redesign visual styles, translate into new languages, and much more. If you want access to the full library, comment “VIDEO SKILLS” and I’ll share it with you. (You'll have to follow me so I can DM you.)

Akash Anand

511,175 Aufrufe • vor 22 Tagen

Linux tip of the day 💡 Don't like to see the omnipresent hidden directories . and ..? You can use the option -A to hide them when you are displaying all files including the hidden ones. $ ls -lA
0:14

Linux tip of the day 💡 Don't like to see the omnipresent hidden directories . and ..? You can use the option -A to hide them when you are displaying all files including the hidden ones. $ ls -lA

Linux Handbook

12,768 Aufrufe • vor 11 Monaten

Complex UI: New web APIs in disguise 🥸 These balance sliders are basic input [type=range] with labels and some extra elements The magic comes from using a scroll animation on the range thumb and using it to drive a custom property that updates styles on the visuals ✨
0:17

Complex UI: New web APIs in disguise 🥸 These balance sliders are basic input [type=range] with labels and some extra elements The magic comes from using a scroll animation on the range thumb and using it to drive a custom property that updates styles on the visuals ✨

jhey ʕ•ᴥ•ʔ

113,073 Aufrufe • vor 2 Jahren

Gather - work in progress what if your notes app felt more like a physical notebook? you can have pages with your notes, your tasks, your thoughts, your inspiration and organize them in a way that is meaningful to you. each page is a little canvas. it might look a little bit like a gimmick, but once you try it, you might feel differently. when designing Gather, Ajay Sabs and i draw our inspiration more than anything from physical things. we’ve always wanted to try and re-create some of the feelings and romanticism we associate with physical notebooks, books and magazines. we’ve always felt there was something special about how pages have an order and how you’re mind creates visual and spatial connections depending on how things are organized - particularly things that you’ve written, revisit often or have a significance to you. the notebook view is an idea we’ve played with for a very long time. and its a lot more than just swiping between pages. this is just a little peek. we are also working on other views that are optimized for different use-cases and different modes of thinking. we’re excited to share some of those soon.
0:14

Gather - work in progress what if your notes app felt more like a physical notebook? you can have pages with your notes, your tasks, your thoughts, your inspiration and organize them in a way that is meaningful to you. each page is a little canvas. it might look a little bit like a gimmick, but once you try it, you might feel differently. when designing Gather, Ajay Sabs and i draw our inspiration more than anything from physical things. we’ve always wanted to try and re-create some of the feelings and romanticism we associate with physical notebooks, books and magazines. we’ve always felt there was something special about how pages have an order and how you’re mind creates visual and spatial connections depending on how things are organized - particularly things that you’ve written, revisit often or have a significance to you. the notebook view is an idea we’ve played with for a very long time. and its a lot more than just swiping between pages. this is just a little peek. we are also working on other views that are optimized for different use-cases and different modes of thinking. we’re excited to share some of those soon.

Steven Yuen

103,091 Aufrufe • vor 2 Jahren