FARFETCH España
「ホワイトキューブ」スタイルのファッションギャラリー。壁、床、什器すべてが真っ白に漂白された、高級小売スペースを想像してみてください。そこでは、服とそれを着る人だけが、あらゆる色合い、質感、そして視覚的な表現を生み出すのです。
Farfetchは「ホワイトキューブ」のファッションギャラリーとして機能します。インターフェースはほぼ完全に色を排除し、編集写真がすべての視覚的な決定を左右します。タイポグラフィがすべての構造的な役割を担い、カスタムデザインの幾何学的なサンセリフフォント（Farfetch Basis）が400と700のウェイトで使用され、セクションの見出しとロゴはテキストを構成として扱うセリフフォントでレンダリングされます。レイアウトは建築的です。中央揃えの全幅コンテンツ、厳格な3列または4列の製品グリッド、セクション配置のための十分なスペース（48～72ピクセル）、そして装飾要素の完全な排除。コンポーネントは装飾を取り除かれ、検索用の控えめな下線、非表示のナビゲーションリンク、画像の下の大文字のカテゴリ名、影や境界線のないフラットな製品タイルなどです。システム内で唯一の色は写真そのものであり、インターフェースはフレームであって画像そのものではありません。
このページは、中央揃えの全幅構成で、最大コンテンツ幅は約 1280px です。ヘッダーは、細い 3 ゾーンのパネル (左側にカテゴリ ナビゲーション、中央揃えのテキスト サイン、右側に補助アイコン) で、その下に右側に検索フィールドがあります。最初のセクションは、全幅のカテゴリ タイル (MUJER、HOMBRE、INFANTIL) の 3 列グリッドで、それぞれにオーバーレイ ラベルが付いています。各カテゴリ セクションの下には、タイトルがすべて大文字の製品カテゴリ カード (NOVEDADES、ROPA、BOLSOS、ZAPATOS) の 4 列グリッドがあります。セクション タイトルは中央揃えで、上下に約 48px の垂直方向のインデントが付いたフォントで書かれています。背景のストライプは交互になく、ページ全体が単一の白いフィールドです。フッターは、#222222 の単一の暗いストライプに反転されています。ナビゲーションは、固定要素、メガ メニュー、サイド バーのないミニマルなトップ バーです。
ビジュアルシステムは、エディトリアルファッション写真が中心となっている。ページ全体を埋め尽くす高解像度の大型画像には、建築的なインテリアの中にモデルを配置した写真や、商品のクローズアップ写真が掲載されている。写真自体は、コンクリートの壁、天然石、ニュートラルなインテリア、柔らかく方向性のある自然光など、落ち着いた彩度の低い色調で撮影されている。モデルは、ECカタログのような厳格なポーズではなく、エディトリアル写真のようなポーズで、ミドルレングスや全身像で撮影されている。商品画像（バッグ、靴など）は、ライフスタイルの文脈を一切排除し、ニュートラルなグレーや石の背景に単独で配置されている。つまり、被写体そのものが主役なのだ。インターフェースには、アイコン、プロモーションステッカー、装飾的なフレームなど、視覚的な要素は一切ない。視覚的な豊かさはすべて、デザインシステムではなく、写真部門から生まれている。
パレット
中性
- Carbon
#222222— 本文、ページテキスト、ナビゲーションリンク、アイコン、ロゴ、フッター、そしてモノクロシステム全体にほぼ黒に近い色調を使用。 - Paper
#ffffff— ページキャンバス、カードの背景画像、製品タイル表面、入力フィールド、そして写真が唯一の色のアクセントとなるような支配的な背景。 - Ash Gray
#b6b6b6— 控えめなアイコンの線、余分な境界線、背景の検索下線、入力フィールドのゴーストテキストプレースホルダーなど、最も静かなオプションですが、テキストニュートラルではありません。 - Stone
#f5f5f5— ナビゲーションバーのホバー遷移効果、サブパネルと広告背景の二次的な表面トーン、スタックの中で最も滑らかな遷移効果。 - Graphite
#727272— 控えめなヘルプテキスト、非アクティブなフォームの境界線、無効化されたアイコンのアウトラインなど、読みやすさを損なうことなく強調度を下げたことを示す中間のグレーの色調。 - Smoke
#e6e6e6— 商品の列の間にあるさりげない仕切り、それ以外は継ぎ目のないレイアウトの中でほとんど目立たない構造線。
タイポグラフィ
13～30ピクセル・3ステップ
- Farfetch Basis — 交換： Söhne (paid) or Inter (free) — both share the geometric humanist proportions; Inter as the practical open-source fallback · 概要 400, 700 · ユーザーに表示されるすべての要素には、カスタムデザインの幾何学的なサンセリフフォントが使用されています。ナビゲーションリンクは13～15px/400、本文と製品説明は15px/400、セクション見出しは22～30px/400、そしてFARFETCHのロゴは700です。見出しのみに400を使用しているのは、太字を意図的に避けたためです。セクション見出しは、標準的でありながらも自信に満ちた、過度に太字ではない太さで、700はロゴと最も表現力豊かなカテゴリ名のために確保されています。この特別な形状により、ストロークのコントラストが均一になり、標準のHelveticaフォントでは実現できない、繊細で人間味のある温かみが生まれます。
音程と形式
| 目的 | 意味 |
|---|---|
| 密度 | 密集 |
| 基本的なステップ | 24px |
| ボタンの半径 | 0px |
| カード半径 | 0px |
| 影 | いいえ - 影の代わりに境界線 |
| セクション間 | 48-72px |
| ページ幅 | 1280px |
AI がFARFETCH Españaスタイルであなたのウェブサイトを構築し、
- リンクから商品や投稿を追加してください - Instagram 、 TikTok 、 Facebook 。
- 古いサイトからコンテンツを移行するには、アドレスを指定するだけです。
- 最高のエンジンであるReact （ Next.js ）上で動作するモダンなデザイン。サーバーレンダリングとSEO最適化が標準搭載されています。
- 検索結果のSEO最適化とニューラルネットワークによるレコメンデーションを完全に自動化。
類似のスタイル
- MAKR — 手作りの革製品を展示する博物館のショーケース。静かで真っ白な部屋には、温かみのある黒インクで書かれたラベルが、手に持った革製品や風景を背景にした革製品の大きな写真の下に浮かんでいる。唯一の色のコントラストは、落ち着いたセージグリーンのストライプだけだ。
- Franco Maria Ricci Editore — アールデコギャラリーカタログ - 真っ白な羊皮紙に磨き上げられた金色の線
- Laura Monin — 編集ギャラリーの壁、白い大理石、インクスタンプ
- OhDada — 編集ギャラリーウォール
- Cursor — くすぶる炭火に照らされた、居心地の良い羊皮紙工房
- Structured — 粘土のような紙に描かれたルネッサンスギャラリー
- MindMarket — クリーム色の紙に印刷された、居心地の良いおとぎ話の本。大きなInterの見出しと切り抜かれた紙のキャラクターが、太陽の光を浴びたような、ステッカーのように柔らかい表面に共存する、親しみやすい編集上のキャンバス。
- Airbnb — 静かな白いギャラリーの壁に、サンゴ色のしおりが1枚だけ飾られている。
- Apple (España) — 柔らかな自然光に照らされた美術館のギャラリーは、魅惑的で軽やかな白い空間で、それぞれの展示品は淡い色合いの壁にスポットライトで照らされている。
- Lamborghini — ショールームのスポットライトの下に展示された黒いボディカラーの車と、黄色い車が1台。
- Amplemarket — 紙吹雪が散りばめられた、陽光あふれる職場
- Getharvest — 夕暮れ時の机――温かみのあるクリーム色のキャンバス、キャンバスに掛けられた白いポストカード、そして一つの明るいオレンジ色の炎