デザイン方向性集
「どんな見た目にするか」を最初に決めるための13テイスト。 各テイストにはカラー・タイポグラフィ・レイアウト・UIコンポーネント・装飾・アニメーションのルールと、 動くサンプルUIを収録。プロダクト情報を入力すれば、AIにデザイン方針を設計させるプロンプトを生成できます。
AIプロンプトを生成する
プロダクト情報を入力し、テイストを選ぶ(最大3つ・未選択ならAIに選定を任せる)と、 「別のAIやデザイナーが読んでも同じ方向のデザインを作れる」レベルのデザイン方針を設計させるプロンプトができます。 入力内容はこのブラウザに保存されます。
ミニマル
Minimal要素を削ぎ落とし、余白とタイポグラフィで語るデザイン。情報の優先順位が明確で、ツールやポートフォリオ、ドキュメント系に向きます。
モダン・クリーン
Modern / CleanSaaSやWebアプリの標準形。白基調に1つのブランドカラー、8pxグリッド、控えめな影で整った信頼感を出します。迷ったらこれ。
プレミアム・高級感
Premium / Luxuryダークトーンとセリフ体、たっぷりの余白で「格」を演出。ホテル・ジュエリー・ハイエンドブランド・会員制サービスに。
カジュアル・ポップ
Casual / Pop明るい多色、太い書体、大きな角丸で楽しさを前面に。コンシューマー向けアプリ、若年層向けサービス、イベントに。
ナチュラル・温かみ
Natural / Warmアースカラーと生成りの背景、柔らかい角丸で安心感を作る。食・暮らし・ウェルネス・地域・子育て系サービスに。
レトロ
Retro / Vintage褪せた色、セリフやタイプライター書体、紙の質感で懐かしさを演出。カフェ・雑貨・出版・クラフト系ブランドに。
Y2K
Y2K / Cyber Nostalgia2000年前後のデジタル文化を現代的に再解釈。メタリックなグラデーション、ピクセルフォント、ネオン色で若年層に刺さる強い個性を出します。
テック・フューチャリスティック
Tech / Futuristicダーク背景にモノスペース、グリッド線、発光するアクセント。開発者ツール・AI・セキュリティ・フィンテックなど「先端」を伝えたいプロダクトに。
グラスモーフィズム
Glassmorphism半透明のパネルと背景ブラー、鮮やかなグラデーション背景で奥行きを作る。ヒーロー・ダッシュボード・モバイルアプリのオーバーレイに。
ニューモーフィズム
Neumorphism / Soft UI背景と同色の要素を、明暗2方向の影で押し出したり凹ませたりして立体感を作る。スマート家電・オーディオ・設定画面など「物理的な操作感」を出したいUIに。
ブルータリズム
Brutalism / Neo-Brutalism太い黒の輪郭、原色のベタ塗り、ずらしたハードシャドウ、生のHTML感。個性と主張を最優先するポートフォリオ・クリエイティブ系・スタートアップに。
エディトリアル
Editorial / Magazine雑誌や新聞の組版をWebに持ち込む。大きなセリフの見出し、多段組、写真とテキストの緊張感。メディア・ブログ・ブランドストーリーに。
和風・和モダン
Japanese Modern余白・縦書き・和色・明朝体で「間」を作る。旅館・和食・工芸・伝統文化のサイトや、日本発ブランドの世界観に。