Voltar aos vídeos

Figma

Figma Motion basics: Path trim

Lançamento
Plataforma
YouTube
Duração
2:16
Idioma falado
inglês
Visualizações
4,8 mil
Corte mediano
0.09s
Rosto em cena
0%
Quadros escuros
0%
Figma Figma Motion basics: Path trim at 0:00
FigmaFigma Motion basics: Path trim
0:00
Figma Figma Motion basics: Path trim at 0:01
FigmaFigma Motion basics: Path trim
0:01
Figma Figma Motion basics: Path trim at 0:02
FigmaFigma Motion basics: Path trim
0:02
Figma Figma Motion basics: Path trim at 0:02
FigmaFigma Motion basics: Path trim
0:02
Figma Figma Motion basics: Path trim at 0:04
FigmaFigma Motion basics: Path trim
0:04
Figma Figma Motion basics: Path trim at 0:10
FigmaFigma Motion basics: Path trim
0:10
Figma Figma Motion basics: Path trim at 0:10
FigmaFigma Motion basics: Path trim
0:10
Figma Figma Motion basics: Path trim at 0:12
FigmaFigma Motion basics: Path trim
0:12
Figma Figma Motion basics: Path trim at 0:15
FigmaFigma Motion basics: Path trim
0:15
Figma Figma Motion basics: Path trim at 0:18
FigmaFigma Motion basics: Path trim
0:18
Figma Figma Motion basics: Path trim at 0:21
FigmaFigma Motion basics: Path trim
0:21
Figma Figma Motion basics: Path trim at 0:21
FigmaFigma Motion basics: Path trim
0:21
Figma Figma Motion basics: Path trim at 0:21
FigmaFigma Motion basics: Path trim
0:21
Figma Figma Motion basics: Path trim at 0:21
FigmaFigma Motion basics: Path trim
0:21
Figma Figma Motion basics: Path trim at 0:22
FigmaFigma Motion basics: Path trim
0:22
Figma Figma Motion basics: Path trim at 0:22
FigmaFigma Motion basics: Path trim
0:22
Figma Figma Motion basics: Path trim at 0:22
FigmaFigma Motion basics: Path trim
0:22
Figma Figma Motion basics: Path trim at 0:22
FigmaFigma Motion basics: Path trim
0:22
Figma Figma Motion basics: Path trim at 0:23
FigmaFigma Motion basics: Path trim
0:23
Figma Figma Motion basics: Path trim at 0:24
FigmaFigma Motion basics: Path trim
0:24
Figma Figma Motion basics: Path trim at 0:28
FigmaFigma Motion basics: Path trim
0:28
Figma Figma Motion basics: Path trim at 0:29
FigmaFigma Motion basics: Path trim
0:29
Figma Figma Motion basics: Path trim at 0:37
FigmaFigma Motion basics: Path trim
0:37
Figma Figma Motion basics: Path trim at 0:37
FigmaFigma Motion basics: Path trim
0:37
Figma Figma Motion basics: Path trim at 0:37
FigmaFigma Motion basics: Path trim
0:37
Figma Figma Motion basics: Path trim at 0:37
FigmaFigma Motion basics: Path trim
0:37
Figma Figma Motion basics: Path trim at 0:38
FigmaFigma Motion basics: Path trim
0:38
Figma Figma Motion basics: Path trim at 0:38
FigmaFigma Motion basics: Path trim
0:38
Figma Figma Motion basics: Path trim at 0:38
FigmaFigma Motion basics: Path trim
0:38
Figma Figma Motion basics: Path trim at 0:38
FigmaFigma Motion basics: Path trim
0:38
Figma Figma Motion basics: Path trim at 0:45
FigmaFigma Motion basics: Path trim
0:45
Figma Figma Motion basics: Path trim at 0:46
FigmaFigma Motion basics: Path trim
0:46
Figma Figma Motion basics: Path trim at 0:51
FigmaFigma Motion basics: Path trim
0:51
Figma Figma Motion basics: Path trim at 0:51
FigmaFigma Motion basics: Path trim
0:51
Figma Figma Motion basics: Path trim at 0:51
FigmaFigma Motion basics: Path trim
0:51
Figma Figma Motion basics: Path trim at 0:52
FigmaFigma Motion basics: Path trim
0:52
Figma Figma Motion basics: Path trim at 0:52
FigmaFigma Motion basics: Path trim
0:52
Figma Figma Motion basics: Path trim at 0:52
FigmaFigma Motion basics: Path trim
0:52
Figma Figma Motion basics: Path trim at 0:53
FigmaFigma Motion basics: Path trim
0:53
Figma Figma Motion basics: Path trim at 0:54
FigmaFigma Motion basics: Path trim
0:54
Figma Figma Motion basics: Path trim at 0:55
FigmaFigma Motion basics: Path trim
0:55
Figma Figma Motion basics: Path trim at 0:56
FigmaFigma Motion basics: Path trim
0:56
Figma Figma Motion basics: Path trim at 1:06
FigmaFigma Motion basics: Path trim
1:06
Figma Figma Motion basics: Path trim at 1:15
FigmaFigma Motion basics: Path trim
1:15
Figma Figma Motion basics: Path trim at 1:16
FigmaFigma Motion basics: Path trim
1:16
Figma Figma Motion basics: Path trim at 1:16
FigmaFigma Motion basics: Path trim
1:16
Figma Figma Motion basics: Path trim at 1:16
FigmaFigma Motion basics: Path trim
1:16
Figma Figma Motion basics: Path trim at 1:22
FigmaFigma Motion basics: Path trim
1:22
Figma Figma Motion basics: Path trim at 1:30
FigmaFigma Motion basics: Path trim
1:30
Figma Figma Motion basics: Path trim at 1:34
FigmaFigma Motion basics: Path trim
1:34
Figma Figma Motion basics: Path trim at 1:38
FigmaFigma Motion basics: Path trim
1:38
Figma Figma Motion basics: Path trim at 1:46
FigmaFigma Motion basics: Path trim
1:46
Figma Figma Motion basics: Path trim at 1:50
FigmaFigma Motion basics: Path trim
1:50
Figma Figma Motion basics: Path trim at 1:58
FigmaFigma Motion basics: Path trim
1:58
Figma Figma Motion basics: Path trim at 2:02
FigmaFigma Motion basics: Path trim
2:02
Figma Figma Motion basics: Path trim at 2:03
FigmaFigma Motion basics: Path trim
2:03
Figma Figma Motion basics: Path trim at 2:06
FigmaFigma Motion basics: Path trim
2:06
Figma Figma Motion basics: Path trim at 2:07
FigmaFigma Motion basics: Path trim
2:07
Figma Figma Motion basics: Path trim at 2:14
FigmaFigma Motion basics: Path trim
2:14

Transcrição de Figma Motion basics: Path trim

Transcrito por um modelo de fala a partir do áudio do próprio vídeo, não escrito pela marca. Clique em qualquer linha para ir até aquele momento.

  1. 0:00Let's learn about Path Trim.
  2. 0:02Path Trim lets you create animated lines by controlling how much of a path is visible at specific points in time.
  3. 0:09You can use Path Trim to create draw-on or erase effects,
  4. 0:14handwriting animations,
  5. 0:17and looping spinners.
  6. 0:21Path Trim animations can only be applied to center position strokes.
  7. 0:26There are two ways to create path trim animations in Figma Motion.
  8. 0:31The path animation style and path trim keyframes.
  9. 0:35Let's take a look at each option.
  10. 0:38The path animation style lets you quickly apply path trim animations without needing
  11. 0:42to set keyframes manually.
  12. 0:44Path animation styles can only be applied to open vector paths, and you can only apply
  13. 0:49one path animation per object.
  14. 0:52To apply a path animation style, click animations in the right sidebar and choose path from the list of options.
  15. 0:58If the path option is disabled, make sure you've selected an open vector path with a center position stroke.
  16. 1:04From there, configure the animation type and direction, along with its delay, duration, and easing curve.
  17. 1:16For more granular control, or to animate a closed vector path, you can use keyframes instead.
  18. 1:22Keyframes let you animate the start and end points of a path independently,
  19. 1:26giving you more precise control over the motion. For example, you can use keyframes to create a
  20. 1:32loading spinner with staggered start and end points for more fluid, organic movement.
  21. 1:37To apply Path Trim keyframes, click Add keyframe next to the Path Trim Start or Path Trim End settings in the Stroke section of the right sidebar.
  22. 1:46Then enter a value between 0 and 100% to configure where the path begins or ends.
  23. 1:53Move the playhead to where you want the animation to end, then adjust the value to add another keyframe that defines the final state of the path.
23 linhas · 302 palavras

More from Figma

All of Figma →

The rest of their work we have taken apart.

Oh wait there’s more: we’re building 3D Transforms, here’s a preview ...39M views
Figma
Oh wait there’s more: we’re building 3D Transforms, here’s a preview ...
1:0423 frames4.0s cut78% face
Made in Figma (2025) Like this ❤️ we designed it for you36M views
Figma
Made in Figma (2025) Like this ❤️ we designed it for you
0:3872 frames0.5s cut7% face
Like a post with ‘Made in Figma’ You’ll get a surprise29M views
Figma
Like a post with ‘Made in Figma’ You’ll get a surprise
1 frames0% face
Now you can use AI agents to design directly on the Figma canvas, wit...18M views
Figma
Now you can use AI agents to design directly on the Figma canvas, wit...
0:3719 frames1.5s cut0% face
What’s your favorite scary movie?8.2M views
Figma
What’s your favorite scary movie?
2:32216 frames3.3s cut80% face

Cut at the same speed

Films whose median shot runs closest to 0.09s.

Iran War Expert: “I Worry They Will Attack Us On Home Soil!” | Robert Pape6.9M views
The Diary Of A CEO
Iran War Expert: “I Worry They Will Attack Us On Home Soil!” | Robert Pape
101:13191 frames0.1s cut48% face
New Anthropic research: A global workspace in language models. Of ev...11M views
Anthropic
New Anthropic research: A global workspace in language models. Of ev...
5:27387 frames0.1s cut0% face
New Anthropic research: Emotion concepts and their function in a larg...3.9M views
Anthropic
New Anthropic research: Emotion concepts and their function in a larg...
4:53435 frames0.1s cut1% face
Marcos Rico Peng - today we're launching @Palmier_io, a video editor Claude can edit. ...Launch2.8M views
Marcos Rico Peng
Marcos Rico Peng - today we're launching @Palmier_io, a video editor Claude can edit. ...
0:3949 frames0.1s cut20% face
We won the race to criticality, but the most important race is the ra...148K views
Jordan Bramble
We won the race to criticality, but the most important race is the ra...
0:2054 frames0.1s cut0% face
You made billions of searches on Perplexity in 2024. Which topics tr...102K views
Perplexity
You made billions of searches on Perplexity in 2024. Which topics tr...
0:1912 frames0.1s cut0% face
Introducing `Agent-1`: a breakthrough foundation model that can opera...Launch252K views
Matt Shumer
Introducing `Agent-1`: a breakthrough foundation model that can opera...
0:5341 frames0.1s cut0% face
Flux 3 on the Pika API ClubLaunch94 views
Pika Labs
Flux 3 on the Pika API Club
0:1617 frames0.1s cut18% face
Uni-1 is here! A new kind of model that thinks and generates pixels s...Launch6.5M views
Luma
Uni-1 is here! A new kind of model that thinks and generates pixels s...
1:0048 frames0.1s cut4% face
Turn your article into a cover image with AI215 views
HeadshotPro
Turn your article into a cover image with AI
0:127 frames0.1s cut0% face
Suspect YEETS Skydio R10 Indoor Drone Out a Window... It Still Got the Job Done.1.8M views
Skydio
Suspect YEETS Skydio R10 Indoor Drone Out a Window... It Still Got the Job Done.
2:02116 frames0.1s cut1% face
this is Krea 2. our first foundation model, built completely from sc...2.4M views
Krea
this is Krea 2. our first foundation model, built completely from sc...
1:0737 frames0.1s cut16% face

Lit and framed like this

Closest on how much of the running time has a face in it and how dark the frames are.

Everything we launched at Make with Notion27M views
Notion
Everything we launched at Make with Notion
1:0326 frames11.5s cut0% face
Introducing Sakana Fugu: A full multi-agent orchestration system acce...Launch26M views
Sakana AI
Introducing Sakana Fugu: A full multi-agent orchestration system acce...
5 frames0% face
What is ClickUp?22M views
ClickUp
What is ClickUp?
1:2835 frames23.3s cut0% face
Introducing ChatGPT Images 2.0 A state-of-the-art image model that c...Launch13M views
OpenAI
Introducing ChatGPT Images 2.0 A state-of-the-art image model that c...
1:0062 frames0.8s cut0% face
Your Base44 Superagent is waiting13M views
Base44
Your Base44 Superagent is waiting
0:4321 frames1.4s cut0% face
Oikos Blended - Forkable Peach10M views
OIKOS Protein
Oikos Blended - Forkable Peach
0:158 frames4.0s cut0% face
Computer now connects with Plaid to link bank accounts, credit cards,...6.2M views
Perplexity
Computer now connects with Plaid to link bank accounts, credit cards,...
1:0321 frames0% face
Imagine every pixel on your screen, streamed live directly from a mod...6.0M views
Zain Shah
Imagine every pixel on your screen, streamed live directly from a mod...
0:146 frames0% face
Many drugs work by binding to a specific target in the body and block...4.1M views
Anthropic
Many drugs work by binding to a specific target in the body and block...
0:114 frames0% face
Introducing workspace agents in ChatGPTLaunch3.5M views
OpenAI
Introducing workspace agents in ChatGPT
1:1027 frames3.5s cut0% face
We’re expanding Claude for Financial Services, with an Excel add-in, ...3.3M views
Anthropic
We’re expanding Claude for Financial Services, with an Excel add-in, ...
1:4337 frames33.1s cut0% face
New Anthropic research: Project Deal. We created a marketplace for e...2.9M views
Anthropic
New Anthropic research: Project Deal. We created a marketplace for e...
0:052 frames0% face

More launch

Same category, other makers, most watched first.

Introducing Base44’s Big Game Ad “It’s App to You”Launch140M views
Base44
Introducing Base44’s Big Game Ad “It’s App to You”
0:3024 frames1.9s cut79% face
Introducing Base44’s Big Game Ad Teaser “It’s App to You”Launch138M views
Base44
Introducing Base44’s Big Game Ad Teaser “It’s App to You”
0:1515 frames1.5s cut67% face
Introducing Perplexity Computer. Computer unifies every current AI c...Launch38M views
Perplexity
Introducing Perplexity Computer. Computer unifies every current AI c...
1:3432 frames3% face
Today we're excited to introduce Devin, the first AI software enginee...Launch31M views
Cognition
Today we're excited to introduce Devin, the first AI software enginee...
1:4937 frames11% face
introducing friend. not imaginary. order now atLaunch27M views
Avi
introducing friend. not imaginary. order now at
1:4450 frames2.9s cut50% face
Introducing Gemini Omni: Create Anything from AnythingLaunch26M views
Google
Introducing Gemini Omni: Create Anything from Anything
0:5462 frames0.8s cut8% face
It's no secret how we feel about typing at Wispr Flow. The truth is,...Launch19M views
Tanay Kothari
It's no secret how we feel about typing at Wispr Flow. The truth is,...
2:00110 frames5.1s cut52% face
Announcing a new division of Midjourney called "Midjourney Medical"Launch19M views
Midjourney
Announcing a new division of Midjourney called "Midjourney Medical"
2:23199 frames5.6s cut0% face
Introducing AI Key, a small device that lets AI control your entire p...Launch15M views
Adam
Introducing AI Key, a small device that lets AI control your entire p...
1:1936 frames6.6s cut53% face
Announcing Personal Computer. Personal Computer is an always on, loc...Launch14M views
Perplexity
Announcing Personal Computer. Personal Computer is an always on, loc...
1:2834 frames1.7s cut0% face
Introducing SubQ - a major breakthrough in LLM intelligence. It is t...Launch13M views
Alexander Whedon
Introducing SubQ - a major breakthrough in LLM intelligence. It is t...
1:2545 frames1.1s cut60% face
Vercel Ship is back. Join us on June 25 (NYC and online) to hear upd...Launch11M views
Vercel
Vercel Ship is back. Join us on June 25 (NYC and online) to hear upd...
0:083 frames0% face
Browse every frame in the library