READY GO：見出しそのものがショーリールになったエージェンシーのサイト

「私たちはデジタルエージェンシーです。お客様が私たちに求めるのは」と続き、最後の単語が切り替わります。どのバリエーションもフォントで組むのではなく、オリジナルのディスプレイレタリングとして描いているので、文のどの状態もそれぞれがひとつのタイポグラフィ作品です。

一行目で何の会社かという問いに答え、二行目で表現の幅を示します。自己紹介の文章はひとつもありません。

ディスプレイの単語は書体ではなく、ベクターのアートワークです。だからこそ切り替わるたびに固有の太さと歪みを持ち、見出しはテキストにかけたアニメーション効果ではなく、デザインされたオブジェクトとして読まれます。

これは意図したトレードオフで、はっきり書いておく価値があります。単語はアウトラインなので、選択できるテキストではなく画像です。そのため、ページをプログラムで読み取るものに対しては、周囲の文章が意味を伝えます。

事例の画像は、大きさも角度もさまざまに見出しの縁に浮かび、文が変わるたびに入れ替わります。一般的なグリッドなら「エージェンシーのテンプレート」に見えたでしょう。散りばめたレイアウトは、このコンテンツのためにつくられたことを伝えます。

ナビゲーションは3つのシンプルなリンクだけです。ヒーロー動画も、スクロールを促す表示も、見出しと張り合う大げさなCookie同意の演出もありません。サイトが使えるものは、すべて一か所に注ぎ込んでいます。

nginxの背後で動くNext.jsです。切り替わる見出しは次の単語のアートワークを先読みするので、入れ替わりの瞬間に空白のフレームが表示されることはありません。