厳選・オープン・無料

Virtual Plus Ex

大胆なタイポグラフィとシンプルで制御されたナビゲーションを重視した、スタイリッシュでハイコントラストなインタラクティブ体験。

01

デザイン DNA

ユーザーの制御と大胆なタイポグラフィに焦点を当てた、ミニマルなインタラクティブギャラリーまたはショールーム。

02

カラー

強調のための1つの鮮やかなアクセント色を除き、厳格なハイコントラストなモノクローム。

03

タイポグラフィ

grotesque-sans · monospaced

• display60px · 500
• subheading16px · 500
• body12px · 500
• label10px · 500

テキストはすべて大文字。 · 見出しにはタイトなネガティブ文字间距を適用。 · 本文テキストは技術的な印象のために、一貫して等幅フォントを使用。

04

余白

インタラクティブ要素の周囲に十分な余白を確保。通常は25～36px。

05

サーフェス (角丸 / 影 / 罫線)

ボタンには2px solid white、装飾的な要素には微細な1px線。

06

レイアウト

初期のモード選択には中央揃えの縦並び、フルスクリーンのスクロールベースレイアウトへと移行。

07

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

ホバー状態のすべてのプロパティにトランジションを適用。 · 指示に基づき、滑らかなスクロールまたはスワイプを想定。

インタラクティブ要素にカーソルポインタとトランジションを想定。 · モードの開始と選択のためのプライマリインタラクション方法。

08

コンポーネント

• button 角丸の大きな長方形アウトライン付きボタン、すべて大文字のテキスト、十分な内部パディング。
• card 提供されたスクリーンショットでは見えませんが、メインコンテンツコンテナとして想定。
• chip 見えません。
• input 見えません。
• hero 大きな中央揃えのタイポグラフィと最小限の装飾線要素を持つ、フルスクリーンの黒いキャンバス。

09

文体と禁止事項

• トーン 直接的、ミニマル、指示的。
• 見出し 大胆、すべて大文字、タイトな文字间距。
• CTA 目立つボタン内の明確で大きな大文字テキスト。

• セリフ体や手書きフォントを使用しない — スクリーンショットにはグロテスクサンズと等幅フォントのみ使用。
• 背景画像やグラデーションを追加しない — スクリーンショットには純黒の背景。
• 低コントラストのテキストを使用しない — スクリーンショットには黒地に白のハイコントラストテキスト。
• 複雑なシャドウや奥行き効果を使用しない — スクリーンショットにはフラットでボーダーのみのコンポーネント。
• 複数のアクセントカラーを使用しない — スクリーンショットには1つのアクセントカラー（オレンジ）のみ。
• UI要素に小文字テキストを使用しない — スクリーンショットにはすべてのテキストが大文字。
• 避ける: 柔らかくまたは遊び心のある言葉遣い。
• 避ける: 雑然としたレイアウトや競合する複数の要素。
• 避ける: セリフ体または装飾的なタイポグラフィ。

10

パック内の実スクリーンショット

実ページから取得 · 実 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko