Apple はコンシューマーエレクトロニクス分野の代表ブランドで、そのデザイン言語は「Less is more」で知られています。UI は深い黒（#000000）とライトグレー（#f5f5f7）を交互に配置するセクションのリズムで構成され、単一のブルー系（#0071e3）がすべてのアクションとリンクの意味を担います。見出しには SF Pro Display の詰まったトラッキングを使い、全体として抑制の効いた映画的な質感を演出します。製品の質感と映像表現を際立たせたいハイエンド UI に適しています。
Appleメディアと消費
プロンプトテンプレート
基本テンプレート
Design a Apple-inspired interface. - Binary section rhythm: deep black scenes (#000000) alternating with pale neutral fields (#f5f5f7); - Single blue accent family for action and link semantics (#0071e3, #0066cc, #2997ff); - Dual operating modes in one system: cinematic showcase modules and dense commerce configurators; - Heavy reliance on imagery and material finishes; UI chrome remains visually thin; - Tight headline metrics (SF Pro Display, semibold) paired with compact body/link typography (SF Pro Text). Colors: #000000, #f5f5f7, #1d1d1f, #0071e3 with #0071e3 accent. Typography: #0071e3.
バリエーションプロンプト
📱 モバイル
Design a mobile app with Apple aesthetics. Use Apple color identity with #0071e3 accents. Clean, touch-friendly, native feel.
💻 Web
Design a web application with Apple style. Use Apple color identity with #0071e3 accents. Professional, responsive layout.
📊 ダッシュボード
Design a dashboard with Apple design language. Use Apple color identity with #0071e3 accents. Data-rich, organized, clear hierarchy.
📄 ランディングページ
Design a landing page with Apple visual identity. Use Apple color identity with #0071e3 accents. Compelling, conversion-focused.
使用例
Apple アプリ
WebBuild a web app with Apple design language and #0071e3 color system.
Apple ダッシュボード
ダッシュボードCreate a dashboard using Apple style with data visualization and #0071e3 typography.
✅ 適した用途
- コンシューマー製品
- ハイエンド製品のローンチページ
- 映像主体のブランド公式サイト
❌ 適さない用途
- 情報密度の高いツール UI
- カラフルなプロモーション企画ページ
DESIGN.md ファイル
design.md オープン形式に準拠したデザインシステム記述。コピーまたはダウンロードして AI コーディングツールに渡せます。