技法

Three column app layout

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

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

フレーム
26
動画
18
ブランド
15
カット間隔の中央値
10.4秒

最も多く撮っているのは

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

Linear 4フレームFigma 3フレームSuperhuman Mail 3フレームNanoleaf 2フレームMinerva 2フレームMobbin 2フレーム
Perplexity Today we’re launching Portable Computer on @NVIDIA DGX Spark. Portab... at 0:12
PerplexityToday we’re launching Portable Computer on @NVIDIA DGX Spark. Portab...
0:12
Linear Introducing Linear Agent. Built directly into Linear and accessible ... at 0:37
LinearIntroducing Linear Agent. Built directly into Linear and accessible ...
0:37
Linear Introducing Linear Agent. Built directly into Linear and accessible ... at 0:40
LinearIntroducing Linear Agent. Built directly into Linear and accessible ...
0:40
Figma Figma Motion basics: Animation styles at 0:10
FigmaFigma Motion basics: Animation styles
0:10
Nanoleaf How To Setup: Nanoleaf PC Screen Mirror Lightstrip | Tutorial at 1:04
NanoleafHow To Setup: Nanoleaf PC Screen Mirror Lightstrip | Tutorial
1:04
Nanoleaf How To Setup: Nanoleaf PC Screen Mirror Lightstrip | Tutorial at 1:07
NanoleafHow To Setup: Nanoleaf PC Screen Mirror Lightstrip | Tutorial
1:07
Opennote Introducing Papers on Opennote at 1:10
OpennoteIntroducing Papers on Opennote
1:10
Opennote Introducing Papers on Opennote at 1:14
OpennoteIntroducing Papers on Opennote
1:14
Limitless Rewind Demo at 0:22
LimitlessRewind Demo
0:22
Linear The Linear MCP server has been upgraded with new product management c... at 0:40
LinearThe Linear MCP server has been upgraded with new product management c...
0:40
Mobbin I Gave Claude 600,000 UI Screens… Then This Happened at 1:54corner inset
MobbinI Gave Claude 600,000 UI Screens… Then This Happened
1:54
Mobbin I Gave Claude 600,000 UI Screens… Then This Happened at 1:58corner inset
MobbinI Gave Claude 600,000 UI Screens… Then This Happened
1:58
Descript What's new in Descript (June 2026) | Telethon recap, tone tags, 11 new effects + DescriptMCP at 1:58
DescriptWhat's new in Descript (June 2026) | Telethon recap, tone tags, 11 new effects + DescriptMCP
1:58
Notion The data’s in…🥁 We looked across 300,000+ Custom Agents to find the ... at 0:30
NotionThe data’s in…🥁 We looked across 300,000+ Custom Agents to find the ...
0:30
Spline Deep Dive into Hana’s New Features: Figma Import, Pencil Tool, Frame as Fill & More at 0:46corner inset
SplineDeep Dive into Hana’s New Features: Figma Import, Pencil Tool, Frame as Fill & More
0:46
Linear Introducing Customer Requests › Capture customer feedback › Understa... at 2:02corner inset
LinearIntroducing Customer Requests › Capture customer feedback › Understa...
2:02
Superhuman Mail Connect Claude and ChatGPT to Superhuman Mail with MCP | Setup + First Prompt (2 Minutes) at 2:10
Superhuman MailConnect Claude and ChatGPT to Superhuman Mail with MCP | Setup + First Prompt (2 Minutes)
2:10
Superhuman Mail Connect Claude and ChatGPT to Superhuman Mail with MCP | Setup + First Prompt (2 Minutes) at 2:14
Superhuman MailConnect Claude and ChatGPT to Superhuman Mail with MCP | Setup + First Prompt (2 Minutes)
2:14
Superhuman Mail Connect Claude and ChatGPT to Superhuman Mail with MCP | Setup + First Prompt (2 Minutes) at 2:18
Superhuman MailConnect Claude and ChatGPT to Superhuman Mail with MCP | Setup + First Prompt (2 Minutes)
2:18
Lobe Introducing Lobe | Build your first machine learning model in ten minutes. at 1:32
LobeIntroducing Lobe | Build your first machine learning model in ten minutes.
1:32
Basedash Building an internal content moderation app with Basedash in 5 minutes at 0:26corner inset
BasedashBuilding an internal content moderation app with Basedash in 5 minutes
0:26
Minerva Not Quite One-Minute Tour at 0:37wide presenter
MinervaNot Quite One-Minute Tour
0:37
Minerva Not Quite One-Minute Tour at 0:40wide presenter
MinervaNot Quite One-Minute Tour
0:40
Midjourney We're testing two new features today: our image editor for uploaded i... at 2:34
MidjourneyWe're testing two new features today: our image editor for uploaded i...
2:34
Figma Publish and install skills from the Figma Community at 0:30corner inset
FigmaPublish and install skills from the Figma Community
0:30
Figma Publish and install skills from the Figma Community at 0:38corner inset
FigmaPublish and install skills from the Figma Community
0:38
これで全 26 枚です。

比較できる他の技法

Shallow depth of field 5,289Full bleed output no chrome 3,081Hard cut on beat 3,077Centred wordmark on black 2,355Cursor led reveal 2,333Ui float with drop shadow 2,091Long lens background compression 1,096Text plate left third 814Full bleed ui no chrome 741Long lens compression 601Hard cut to black 595Centred talking head 550Subject on right third 530Generous negative space 481Centred subject 465Full bleed no chrome 430Centred wordmark on white 412Full bleed screen recording 408Wide establishing shot 386Full bleed screen capture 377Medium close up 366Subject on left third 344Centred medium close up 342Presenter pip bottom right 336