Design tokens

ライブラリのうち23フレームがDesign tokensに一致し、4ブランドの動画9本にまたがっています。どれも動画そのものから計測したもので、説明文から読み取ったものではありません。つまりこれは、スタイルガイドが説くあるべき姿ではなく、実際にどう使われているかです。

このページにレンダリング画像も機材リストもありません。下にあるのはどれも実際に見に行ける動画の本物の1秒であり、どの数値もサンプルからの推定ではなく実フレームを数えたものです。

フレーム: 23
動画: 9
ブランド: 4
カット間隔の中央値: 6.8秒

最も多く撮っているのは

各ブランドがこの切り口にどれだけフレームを出しているかの順です。

Figma 18フレーム Webflow 3フレーム Cursor 1フレーム Dylan Field 1フレーム

Figma Do more with Glass → Add it to any object, shape, or text → Round in... at 0:09

FigmaDo more with Glass → Add it to any object, shape, or text → Round in...

0:09

Cursor Cursor can now create new components and frontends in Figma using you... at 0:16

CursorCursor can now create new components and frontends in Figma using you...

0:16

Figma No detaches. Just Slots. at 0:25

FigmaNo detaches. Just Slots.

0:25

Figma Babe wake up you can now capture colors anywhere with the eyedropper ... at 0:07

FigmaBabe wake up you can now capture colors anywhere with the eyedropper ...

0:07

Figma Babe wake up you can now capture colors anywhere with the eyedropper ... at 0:10

FigmaBabe wake up you can now capture colors anywhere with the eyedropper ...

0:10

Figma Babe wake up you can now capture colors anywhere with the eyedropper ... at 0:13

FigmaBabe wake up you can now capture colors anywhere with the eyedropper ...

0:13

Figma Babe wake up you can now capture colors anywhere with the eyedropper ... at 0:16

FigmaBabe wake up you can now capture colors anywhere with the eyedropper ...

0:16

Figma Learn how to go from Claude Code to Figma and back again Livestream... at 0:10

FigmaLearn how to go from Claude Code to Figma and back again Livestream...

0:10

Figma Learn how to go from Claude Code to Figma and back again Livestream... at 0:13

FigmaLearn how to go from Claude Code to Figma and back again Livestream...

0:13

Figma Learn how to go from Claude Code to Figma and back again Livestream... at 0:22

FigmaLearn how to go from Claude Code to Figma and back again Livestream...

0:22

Figma Learn how to go from Claude Code to Figma and back again Livestream... at 0:25

FigmaLearn how to go from Claude Code to Figma and back again Livestream...

0:25

Figma Happy Schema by Figma day. A recap of our announcements (roll out dat... at 0:58

FigmaHappy Schema by Figma day. A recap of our announcements (roll out dat...

0:58

Figma Happy Schema by Figma day. A recap of our announcements (roll out dat... at 1:13

FigmaHappy Schema by Figma day. A recap of our announcements (roll out dat...

1:13

Figma Check Designs: Keep every file synced to your design system with → V... at 0:16

FigmaCheck Designs: Keep every file synced to your design system with → V...

0:16

Figma Check Designs: Keep every file synced to your design system with → V... at 0:19

FigmaCheck Designs: Keep every file synced to your design system with → V...

0:19

Figma Check Designs: Keep every file synced to your design system with → V... at 0:22

FigmaCheck Designs: Keep every file synced to your design system with → V...

0:22

Figma Check Designs: Keep every file synced to your design system with → V... at 0:25

FigmaCheck Designs: Keep every file synced to your design system with → V...

0:25

Figma Check Designs: Keep every file synced to your design system with → V... at 0:28

FigmaCheck Designs: Keep every file synced to your design system with → V...

0:28

Figma Check Designs: Keep every file synced to your design system with → V... at 0:34

FigmaCheck Designs: Keep every file synced to your design system with → V...

0:34

Dylan Field (and now... a design systems moment you've all been waiting for...) at 0:13

Dylan Field(and now... a design systems moment you've all been waiting for...)

0:13

Webflow Create & manage Agent Instructions — Webflow Lesson at 3:14

WebflowCreate & manage Agent Instructions — Webflow Lesson

3:14

Webflow Create & manage Agent Instructions — Webflow Lesson at 3:18

WebflowCreate & manage Agent Instructions — Webflow Lesson

3:18

Webflow Create & manage Agent Instructions — Webflow Lesson at 4:26

WebflowCreate & manage Agent Instructions — Webflow Lesson

4:26

これで全 23 枚です。