Telegram、 WhatsApp+380637610482
ヴァレリー・ダニュク
ヴァレリー・ダニュク開発者企業向けAIツールの開発。高品質で、お手頃価格。Telegramで連絡
Zellerfeld — このスタイルのサイトのプレビュー

Zellerfeld

白い大理石の彫刻家の工房――台座の一枚岩のような表面、一筋のコバルトの光、床から天井まで続く小文字のささやき

Zellerfeldは、白い大理石の上にデジタル彫刻家たちが作品を展示するギャラリーのような雰囲気だ。3Dプリントシューズのマーケットプレイスでありながら、モノクロームの表面、豊富な余白、そして大きな小文字のフォントによって、それぞれの製品がまるで美術館の展示品のように際立っている。インターフェースは極めて抑制的で、無彩色のキャンバスに、アイコン、アクティブな「ショップ」ナビゲーション、現在のスライドステータスといった重要な情報のみに、鮮やかなコバルトブルー(#000aff)が使われている。カードは純白ではなく、温かみのあるパールグレーの背景に浮かぶように配置され、グリッドに石膏像のような質感を与えている。フォントは、文字間隔が狭いカスタムサンセリフ体(Roobert)のみで、価格、製品リスト、技術的なメタデータにはSpace Monoが使用されている。その結果、製品ページは小売店のレジというより、デザイン系のプレスサイトのような印象を与える。商品は販売されるのではなく、写真に撮られているのだ。

このページはページ全体の幅にまたがり、1440pxのコンテンツストリップが特徴です。メイン要素は、フローティングUIオーバーレイ付きのフルスクリーン写真バナーです。製品セクションは4列グリッドを使用し、タブレットでは2列、モバイルデバイスでは1列に縮小されます。セクションのリズムは、大きな製品説明 → 編集者評価グリッド → 新製品グリッド → プレス連絡先情報パネルです。各製品セクションは、ストリップ内の中央にコンテンツを配置し、セクション間に80pxの垂直方向のスペースを使用します。ナビゲーションは、1行に固定されたトップバーで、その上に細い広告ストリップがあります。製品カードは厳密なグリッドに配置され、画像領域は常に靴のシルエットの中央に配置され、カード内に40pxの上下パディングがあり、メタデータクラスターは40x40のブランドロゴとともに左下隅に固定されています。

商品写真が主要な視覚要素であり、各靴は純白または石膏の表面上で3/4の角度で撮影され、文脈、モデル、周囲の環境を一切排除してカード全体を埋め尽くします。メイン要素は本格的なライフスタイル写真です。砂またはコンクリートの上で足と靴をトリミングしたショットで、常に人間のスケールで、完璧なスタジオ品質ではありません。「被写体が主要な要素」の原則が適用され、靴は主要な編集要素であっても、フレームの可視領域の40%を占めます。装飾的なグラフィック要素、抽象的なパターン、イラストは使用されていません。アイコンは線で、黒で輪郭が描かれており、塗りつぶされたり、色付けされたりすることはありません。

パレット

ブランド

  • Electric Cobalt #000aff — 新しいアイコン、アクティブなナビゲーションバー、現在のスライドインジケーター、アクティベーションの瞬間――システム内で唯一の色彩による合図であり、装飾ではなくアクティベーションとして認識されるように控えめに使用されている。

中性

  • Pale Iris #e5e7ff — バッジ用の新しいカラーフィル、柔らかなハイライト、そしてラベルオプション用の着色表面――モノクロームのパレットを損なうことなく色味をほのかに感じさせる、落ち着いたコバルトブルーの色合い。
  • Ink Black #111111 — 本文、デフォルトの枠線、アイコンのアウトライン、細い区切り線、見出し、リスト、リンクの主要な構造色。
  • Pure White #ffffff — 色味を控えめに抑えるため、ニュートラルなフォームの状態、アイコンテキスト、控えめなUIフィードバックを使用してください。行動喚起のメインカラーとして色を使用することは避けてください。
  • Plaster #ecedee — 商品カード、ナビゲーションバーの背景、キャンバス上部の滑らかな隆起面など、二次的な表面。
  • Slate #a1a4aa — カードの枠の色合い、ニュートラルなボタンの塗りつぶし、そして控えめなボタンの縁取りは、カードの端を暗くすることなく際立たせるグレーの色調です。
  • Fog #d7d7d7 — 薄いカードフレーム、区切り線、非活性面の着色。

タイポグラフィ

13ピクセルから128ピクセルまで · 7段階

  • Roobert — 交換: Inter · 概要 400, 500, 600, 700 · メインブランドのフォントは、本文から見出しまであらゆる箇所で使用されています。行間隔はすべてのサイズで統一されており、ロゴの小文字が立体感のある、重厚な印象を与えます。フォントの太さは、文脈に応じて変化します。本文とUIには400、強調表示された見出しには500、商品名には600、大きなタイトルには700が使用されています。
  • Space Mono — 交換: JetBrains Mono · 概要 400, 600 · 技術的なメタデータ(価格(189.00ユーロ)、上位10位の数値、ティッカーシンボル、店舗名など)は、そのページが宣伝文ではなく技術仕様として認識されるべき箇所に追加されています。
  • Arial — 交換: Inter · 概要 400 · Arial - 抽出されたデータには含まれているが、AIによって説明されていない。

音程と形式

目的意味
密度平均
基本的なステップ16px
ボタンの半径10px
カード半径10px
ミニマル
セクション間80px
ページ幅1440px

AI がZellerfeldスタイルであなたのウェブサイトを構築し、

  • リンクから商品や投稿を追加してください - Instagram 、 TikTok 、 Facebook 。
  • 古いサイトからコンテンツを移行するには、アドレスを指定するだけです。
  • 最高のエンジンであるReact ( Next.js )上で動作するモダンなデザイン。サーバーレンダリングとSEO最適化が標準搭載されています。
  • 検索結果のSEO最適化とニューラルネットワークによるレコメンデーションを完全に自動化。

類似のスタイル

  • Airbnb — 静かな白いギャラリーの壁に、サンゴ色のしおりが1枚だけ飾られている。
  • Apple (España) — 白いギャラリー用ディスプレイケース
  • Silencio — 白い部屋に、浮かぶようなオブジェが点在する。温かみのある紙で作られたギャラリー展示では、それぞれの要素が余白を背景にそれぞれの場所を占め、静寂は意図的なデザイン上の決定である。
  • Oakâme — 陽光が降り注ぐ、温かみのある石を彫り出したプロヴァンス風の工房
  • Nike — スポーツの偉業を収めたモノクロームのギャラリー――白い壁、芸術作品としての製品、背景に溶け込むクロム。
  • Arc — 真夜中の水面に浮かぶ工業用ホワイトギャラリー
  • Rivian — ギャラリーのコンクリート壁にそびえ立つ、電気を帯びた巨大なモノリス。リビアンは、広大な白い空間を背景に、それぞれの車両を彫刻作品として展示している。巨大な文字は建築要素となり、単調な雰囲気を打ち破る温かみのある黄色が、まるでマットな表面に降り注ぐ太陽の光のようだ。
  • Analogue — 黒いギャラリーのディスプレイケース – 商品が虚空に浮かぶ
  • ddna — 未加工のリネンの上に置かれた、温かみのある博物館の展示ケース
  • UY Studio — 修道院の石造りの回廊は、コンクリートの壁に囲まれた静かな空間で、白い台座の上に香水瓶が並べられ、400ワットのランプ1つと温かみのある灰色の電球4つで照らされている。
  • Basic.Space — 白い大理石のキュレーターギャラリー
  • COS — 白い壁のおしゃれなギャラリー