FLOW ANATOMY #10 — 1サイトを縦に解剖する
AURELIAは、
なぜ静けさでもてなせるのか。
技法は『点』、サイトは『線』。架空のラグジュアリーリゾート『AURELIA／月燿離宮』は、要素を足して盛り上げるのではなく、音を引くことでもてなします。SaaSのLPが論理で申込へ運ぶのに対し、ここでは各セクションが『余白・静寂・黄金の光』の設計そのもの。近黒とシャンパンゴールドだけに色を絞り、動きはどこまでも穏やかに保つ——"引き算のラグジュアリー"を章ごとに解剖します。解説をスクロールすると、実物のライブプレビューが同じ場所まで自動でついてきます。
BLUEPRINT流れの設計図 — 章の役割と緩急
ローダー→ヒーロー→思想→スイート→ダイニング→スパ→予約→締め。各章が、盛るのではなく"引く"ことで格を上げるよう設計されています。動きは常に穏やかに、色は近黒と金だけに。
- 00LOADER起 — ワードマークが静かに灯る動
- 01HERO主張 — 静けさに、黄金の時間を動
- 02持続レイヤー常 — カーソルと進捗が全篇を静かに縁取る常
- 03SUITES質感 — 二十五室を余白で見せる動
- 04DINING物語 — 皿の上に土地の記憶を動
- 05SPA解放 — 満ちて、ほどける動
- 06RESERVE誘い — 光暈のなかで予約へ動
- 07FOOTER結 — 余韻を残して静かに閉じる常
ワードマークが、静かに灯る
狙い近黒一色の画面に「AURELIA」のセリフ体ワードマークだけが浮かび、シャンパンゴールドのグラデーションがゆっくり明滅する。読み込みが終わると不透明度がなめらかに落ちて退場——ここには進捗バーもスピナーもない。何も足さない開幕そのものが「引き算のラグジュアリー」の宣言になっている。読み込みに失敗しても必ず消えるフェイルセーフ付きで、コンテンツを恒久的に隠さない。
つなぎ派手さではなく端正さで格を出す。この静かな一枚が、後続すべての「盛らないもてなし」の基調をあらかじめ決めている。
静けさに、黄金の時間を
狙い背景ではWebGLが「液状の金」のコースティクス（絹のような光の帯）をきわめてゆっくり揺らし、その上を暗いヴィネットのヴェールが覆って画面を静かに保つ。見出しは「静けさに、」「黄金の時間を。」の2行が時間差でひとつずつ立ち上がり、キャッチコピー・ボタン・座標メタも遅延を重ねて順に現れる。強い言葉で押さず、余白と光の質感だけで格を伝える一画面。
つなぎ最初の全画面で「これは静かな場所だ」と体で分からせる。動くのに騒がしくない、という矛盾の解き方が、以降の全章の設計思想になる。
皿の上に、土地の記憶を
狙い2カラムの左に、ヒーローと同じ液状金のシェーダーをさらに遅い速度で回した正方形のビジュアルを額縁付きで置き、右にダイニングの物語を綴る。「土地の記憶を、皿の上に。」の見出しでは"皿の上"だけが金のグラデーションで灯り、全13皿・自然派カーヴ・茶寮のリストが静かに並ぶ。写真ではなく光の抽象で料理の格を語る。
つなぎヒーローの背景をここで再演することで、リゾート全体が一枚の"光の質感"で貫かれる。反復が過剰にならないよう、速度を落として気配だけを残している。
光暈のなかで、予約へ
狙い中央上部から広がる金のソフトな光暈を背景に、「その滞在は、ここから始まる。」の見出し（"ここから"だけ金グラデーション）が現れ、中央寄せの予約フォームとアクセス情報が続く。フォームは送信すると「二十五室のうち空室をお調べしております…（デモ）」と静かに応える。急かすバナーもカウントダウンもなく、余白のまま予約へ誘う。
つなぎ売り込みの言葉ではなく、光暈と余白と「二十五室のみ」という希少性だけで背中を押す。全篇の静けさを崩さないまま、最後の一歩へ運ぶ設計。
TAKEAWAY"静けさ"でつくる流れの5原則
AURELIAから取り出せる、ラグジュアリー系や余白重視のサイト全般に持ち帰れる設計則。#02 説得 のような論理で押す作法と読み比べると、同じ技法が目的によって正反対の使われ方をすることが分かります。
足すより、引く
写真もコピーも要素も、増やすほど格は下がる。AURELIAは情報量を絞り、余白と光の抽象だけで上質さを想像させる。何を載せるかより、何を載せないかを先に決める。
余白そのものをもてなしにする
広い余白は「手を抜いた空き」ではなく、視線を休ませる設計。要素の間隔を大きく取るほど、一つひとつの言葉と光が丁寧に扱われている印象になる。
動きは"常に静か"に設計する
シェーダーは極端に遅く、カードの傾きは±5度、カーソルは緩く追う。動かすこと自体でなく、騒がしくないことに価値がある。速度と振れ幅を抑えるのが高級感の要。
色数を絞って一貫させる
近黒とシャンパンゴールド、クリームだけ。パレットを絞るほど画面は落ち着き、金の一点が効く。多色で飾るのではなく、限られた色を全篇で反復して品位を保つ。
急かさず、待たせない
カウントダウンで煽らず「二十五室のみ」の希少性だけで誘う一方、ローダーは失敗しても必ず消え、reduced-motionでは動きを止める。静けさは、来訪者を待たせない配慮とセットで初めて成立する。