このテンプレートについて

Kresna Footerはフッターの仕様書として読める。値はページを組む前に書き出されていた。カラースキームは白 #FFFFFFの下地、深いのブルー #111827の文字で、ページはDM Sansで組む。納品形式は自己完結したHTMLファイル1つなので、フッター全体をデザインの引き継ぎなしにプロジェクトへ持ち込める。動きは0.2sのトランジションだけで完結する。主題ではなく構造を借りる。フッターとその数値は、そのまま自社ブランドに移せる。収録したプロンプトは800x586で記録したので、このページで引用する値はすべてそこにたどれる。以下に引用する値はすべてこのブリーフのもので、800x586の枠から最小の余白ステップまで含む。

対象

• モデルに指示を出すなら、フッターから始めて自己完結したHTMLファイル1つをプロンプトに保持させろ。
• 工数を見積もるプロダクトマネージャーは、560pxのブレイクポイントを作業範囲として読む。
• このフッターは、自己完結したHTMLファイル1つの実装をエンジニアへ渡し、モーションを文章で残したいデザイナーに応える。

含まれる内容

• ページのグリッドに乗るバー. 短いリンク列と1つの操作がフッターの上に載り、寸法は28px刻みの余白、0.2sのトランジションで抑えてある。背後の構図と競合しないためだ。560px以下では、リンクは2行目に折り返さず折りたたむ。
• タイポグラフィとして扱う数値. 数値の行が根拠になります。1行に3〜4つの数字、その下に小さなラベル、インターフェースと同じDM Sansで組むため、装飾ではなくデータとして読めます。数字は文字なので、独自に拡縮せずページのレスポンシブ挙動を引き継ぐ。
• フッターも1つの構図. リンクは列にまとめ、ワードマークは独立したブロックに置きます。長いフッターが単なる一覧にならず、読める状態に保たれます。ワードマークは独立したブロックに置き、長いリンク一覧でも読めるようにします。リンクはまとめてください。並べるだけにしないでください。この参考は800x586で収録しました。
• 刻みを名指しするブリーフ. レイアウトに勘で決める部分はない。ブリーフが28px刻みの余白、0.2sのトランジション、560pxのブレイクポイントを明記し、実装はその値に合わせる。画幅の比率も寸法と一緒に記録してあり、再現時に縦横比も合う。

モーションとインタラクション

よくある質問（FAQ）