コピーして使えるプロンプト付きAIモバイルアプリデザイン10選
実際のプロンプト付きの素晴らしいAIモバイルアプリデザイン例を10個ご紹介します。睡眠トラッカーからバンキングアプリまで、AIデザインツールで何が可能かをご覧ください。
そのままコピーして使える、実際のモバイルアプリデザインプロンプトを10個ご紹介します。それぞれ、そのプロンプトが実際に生み出したデザインも一緒に掲載しています。良いモバイルアプリデザインプロンプトは、6つの要素を明確に指定します。画面、その主要なUI要素、ビジュアルスタイル、カラーパレット、タイポグラフィ、そしてムードです。以下のプロンプトはすべてSleekで実行し、Xに投稿したものです。
これらは仮説的なモックアップやストックテンプレートではありません。各デザインは、当社のAIモバイルアプリデザインツールであるSleekで生成し、MattiaがXに投稿したものです。落ち着いた睡眠トラッカーから大胆なスニーカーマーケットプレイス、ブルータリストなカレンダーまで、すべてが1つのテキストプロンプトから生まれました。
- これら10個のモバイルアプリデザインプロンプトのどれでもコピーし、自分のアプリ向けに調整できる
- 良いプロンプトは6つの要素を指定する。画面、主要なUI要素、ビジュアルスタイル、カラーパレット、タイポグラフィ、ムード
- 各プロンプトには、ストックモックアップではなく、Sleekで実際に生み出されたデザインが添えられている
- 指定するスタイル次第で、同じ画面がグラスモーフィズムからブルータリスト、Y2Kまで大きく変化する
- より具体的なプロンプトはより個性的なデザインを生み、曖昧なプロンプトは平凡なデザインを生む
- ここにあるデザインはすべて、1つのテキストプロンプトから数分で生まれた
良いモバイルアプリデザインプロンプトとは
良いモバイルアプリデザインプロンプトは、6つの要素を具体的に示します。画面（ホーム、ダッシュボード、プロフィール）、その主要なUI要素（カード、チャート、ナビゲーション）、ビジュアルスタイル（グラスモーフィズム、ブルータリスト、スイス）、カラーパレット（名前、16進数コード、またはムードで）、タイポグラフィ、そしてムードです。これらを指定すれば、AIは平凡なテンプレートではなく、明確な視点を持ったデザインを生み出します。
以下のプロンプトはすべてこの形に沿っています。スタイルや雰囲気について具体的になるほど、出力はワイヤーフレームではなく、こだわりのある本物のアプリのように見えてきます。どれか1つをコピーし、自分のアプリの詳細に置き換えて、実行してみてください。
モバイルアプリデザインプロンプト10選（とそれが生み出したデザイン）
各例では、正確なプロンプトと、それが生み出したデザインをペアで紹介します。プロンプトをコピーし、詳細を変更して、出発点として使ってください。
1. 睡眠追跡アプリ（エーテル・グラスモーフィズム）
この睡眠ダッシュボードは、リラクゼーションとウェルネスに焦点を当てたアプリに最適な、エーテル・グラスモーフィズムを示しています。
Bad prompt vs good prompt
プロンプト: "Sleep dashboard home screen. Sleep quality score, sleep stages visualization (deep, light, REM with wave chart), smart alarm widget. Visual Style: Ethereal glassmorphism. Deep indigo to purple gradient background, frosted glass cards with soft blur effect, glowing breathing circle with subtle aurora shimmer, semi-transparent white text, iridescent accent colors (soft lavender, mint, pale gold), flowing organic shapes, soft shadows and glows. Mood: Transcendent and calming. Like floating in a peaceful cosmic space. Dreamlike, mystical, deeply relaxing. Premium meditation aesthetic that feels otherworldly yet grounded."
2. 金融ダッシュボードアプリ（ライトモード・フィンテック）
信頼性とプロフェッショナリズムを感じさせるクリーンな金融ダッシュボードで、バンキングや予算管理アプリに最適です。
Gemini 3.0 Flash vs Gemini 3.0 Pro Same prompt. Flash is much faster and quality is surprisingly close. Which one do you prefer?
プロンプト: "Finance dashboard home screen. Total balance card at top (compact), monthly spending breakdown with donut chart (compact card), savings goal progress bar below the chart, expense categories list at bottom with icons and amounts. Mobile app, single screen. Visual Style: Light mode with soft cream background, rounded cards with subtle shadows, deep teal as primary accent color, coral for charts and highlights. Clean sans-serif typography, modern card-based layout. Mood: Professional and trustworthy. Clean, organized, and confident. Modern fintech aesthetic that feels secure and premium."
3. ソーシャルメディアプロフィール（3つのスタイルバリエーション）
この例は、同じ画面コンセプトが3つの異なるビジュアルスタイル（パステル・フレンドリー、クリーン・ミニマル、ダークモード・スリーク）を通じてどのように変化するかを示しています。
AI designed the same app in 3 styles Which one's your favorite?
デザイン1 プロンプト（パステル・フレンドリー）: "Social media profile screen. Profile photo at top center, username below, bio text, follower/following/posts counts in a row, 'Follow' and 'Message' buttons, posts grid (3x3) below. Mobile app, single screen. Style: Light pastel friendly. Soft cream or white background, rounded elements, pastel accent colors (soft pink, lavender, mint), clean sans-serif typography, generous whitespace, approachable and warm aesthetic, modern and inviting."
デザイン2 プロンプト（クリーン・ミニマル）: "Social media profile screen. Profile photo at top center with edit icon, name below, bio text with emoji, follower/following/posts counts in a row, 'Follow' button and message icon, tab navigation (grid, saved, tagged), posts grid (2x3 or 3x3) with interior design photos. Liquid glass navigation bar at bottom with icons. Mobile app, single screen. Style: Clean minimal light mode. Soft white or off-white background, rounded pill-shaped liquid glass navigation bar at bottom (dark charcoal/black with white icons), semi-transparent blur effect, modern iOS aesthetic."
デザイン3 プロンプト（ダークモード）: "Social media profile screen. Profile photo at top center, username below, bio text, follower/following/posts counts in a row, 'Follow' and 'Message' buttons, posts grid (3x3) below. Mobile app, single screen. Style: Dark mode sleek. Deep charcoal background (#1a1a1a), subtle card surfaces, clean sans-serif typography, white text, soft purple or blue accent for buttons/highlights. Minimal and premium, modern social media aesthetic, generous spacing."
4. 音楽プレーヤーアプリ（3つのスタイルバリエーション）
この例は、同じ音楽プレーヤーのコンセプトを、ソフト・ネオ・ブルータリズム、モダン・メンフィス、レトロ90年代という3つの全く異なる美学で紹介しています。
AI is getting weirdly creative with design Which style is your favorite?
デザイン1 プロンプト（ソフト・ネオ・ブルータリズム）: "Music player. Widgets for now playing card with bold track title, album artwork with thick border, playback progress bar, volume slider with chunky handle, and playlist queue counter. Waveform visualizer and play streak tracker. Create also the other screens. Mobile UI, Soft Neo-Brutalism. Dark mode, deep charcoal background, rounded cards with vivid pastel accents (lime, periwinkle, yellow). Bold all-caps sans-serif typography, modular fintech SaaS aesthetic with high contrast."
デザイン2 プロンプト（モダン・メンフィス）: "Music player now playing screen. Large album art at top (square, rounded corners), song title below, artist name below that, progress bar with timestamps, playback controls (shuffle, previous, play/pause, next, repeat), volume slider at bottom. Mobile app, single screen. Style: Modern Memphis / Abstract Collage. Bold geometric shapes scattered in background (circles, triangles, squiggles, dots), clashing bright colors (yellow, pink, blue, red, teal), playful and chaotic but balanced, thick black outlines on some elements, abstract decorative shapes floating around UI elements, bold sans-serif typography, white or light background, 80s/90s inspired but modern, fun and energetic aesthetic."
デザイン3 プロンプト（レトロ90年代）: "Music player now playing screen. Large album art at top (square, rounded corners), song title below, artist name below that, progress bar with timestamps, playback controls (shuffle, previous, play/pause, next, repeat), volume slider at bottom. Mobile app, single screen. Style: Retro/90s. Pixelated elements, chunky beveled buttons, bright saturated colors (teal, magenta, yellow, lime green), gradient backgrounds, old-school drop shadows, bitmap-style icons, retro computer aesthetic, bold playful fonts, visible grid lines or scan lines optional, nostalgic and fun, Windows 95 meets arcade vibes."
5. フィットネスダッシュボードアプリ（モチベーショナル・ライトモード）
クリーンなデータ視覚化と励ましのあるデザインでユーザーを動機付ける、エネルギッシュなフィットネスダッシュボード。
GPT-5.2 vs Gemini 3.0 vs Opus 4.5 Same prompt. Which one do you prefer?
プロンプト: "Fitness dashboard home screen. Weekly activity summary at top (compact), calories burned tracker with circular ring progress (compact card), workout streak counter below the calories card, weekly workout bar chart at bottom. Mobile app, single screen. Visual Style: Light mode with soft cream background, rounded cards with subtle shadows, coral as primary accent color, electric blue for charts and highlights. Clean sans-serif typography, modern card-based layout. Mood: Motivational and energetic. Fresh, clean, and approachable. Modern wellness aesthetic that feels encouraging and uplifting."
6. バンキングアプリ（Y2Kノスタルジックスタイル）
適切に指示すればAIが大胆で型破りなデザインを作成できることを証明する、バンキングへの遊び心のあるアプローチ。
Can't believe AI designed this (prompt below)
プロンプト: "Banking app home screen. Account balance at top, credit/debit cards displayed (card carousel), quick actions buttons (transfer, pay, deposit), recent transactions list with icons and amounts. Bottom navigation bar. Mobile app, single screen. Style: Y2K/Early 2000s aesthetic. Glossy gradient buttons with metallic shine, skeuomorphic elements (beveled edges, embossed text, drop shadows), bright saturated colors (hot pink, electric blue, lime green, chrome silver). Bubbly rounded shapes, glassy reflections, gradients everywhere, nostalgic Windows XP/early smartphone vibes. Playful and nostalgic but overwhelming, borderline tacky."
7. ストップウォッチアプリ（スイス・インターナショナル・スタイル）
このスイススタイルのタイマーデザインでは、極端なミニマリズムが機能的な精密さと出会います。
Still can't believe AI designed this (prompt below)
プロンプト: "Mobile UI, Swiss International Style. Extreme minimalism, rigid grid system. Massive bold Helvetica typography as the main visual element. High whitespace, off-white background (#F5F5F5) with single primary accent color (International Red). Structural lines, no shadows, flat design. Stopwatch and timer. Elapsed time '00:45.32' dominates the screen in bold black text. Lap times listed below in a clean table without borders. 'Start' and 'Stop' controls are simple red and black geometric squares. Precision aesthetic."
8. フライトトラッカーアプリ（トラベル・レディ・エステティック）
明確で整理された情報を通じて旅行のストレスを軽減する、洗練されたフライト追跡インターフェース。
Designed this flight tracker app in one shot with AI (prompt below)
プロンプト: "Design a flight tracker app with clean, modern, travel-ready aesthetics. Visual style: Palette: Soft light mode, off-white base (#f5f5f7), pure white cards (#ffffff), vibrant blue primary (#007aff). Typography: Clean geometric sans-serif (SF Pro, Inter), bold flight codes, medium info text, light metadata. Cards: Rounded corners (16-20px), soft shadows for elevation, white on light gray background. Route timeline: Clean horizontal line with plane icon, progress indicator in blue. Airport codes: Extra large bold (JFK, LAX style). Status badges: Rounded pill shape with colored background and white text. Icons: Minimal line style, airline logos in brand colors. Spacing: Generous padding, clear section separation, breathable layout. Interactive elements: Blue accent for tappable items, subtle press states. Mood: Travel-ready confidence, organized, trustworthy, stress-reducing. Makes tracking flights feel effortless."
9. スニーカーマーケットプレイスアプリ（Gen-Z ハイプカルチャー）
ダークモードとエレクトリックなアクセントでGen-Zのエネルギーを捉えた、大胆なストリートウェアマーケットプレイスのデザイン。
Designed this sneaker app in one shot with AI (prompt below)
プロンプト: "Design a Gen-Z sneaker marketplace app. Dark mode, electric lime green primary, hype culture aesthetic with bold typography and streetwear energy."
10. カレンダーアプリ（ブルータリスト・カオス）
従来のすべてのデザインルールを破る、意図的に混沌としたブルータリストカレンダー。
Still can't believe AI designed this (prompt below)
プロンプト: "Calendar app month view. Grid showing dates for the current month, events/appointments as colored blocks, small event dots for busy days, today highlighted, mini month navigation, event list below. Mobile app, single screen. Brutalist Chaos style, asymmetric layout, overlapping elements, intentionally broken hierarchy, clashing fonts (mix of bold sans-serif and mono), raw and harsh aesthetic. Bold black outlines (2-3px), limited color palette (2-3 bold colors: black, white, and one bright accent like red or yellow), hard drop shadows, no alignment to standard grid, some rotated text elements. Unpolished, rebellious, anti-design, but more restrained with color."
より良いAIデザインプロンプトを書く方法
これらの例を見渡すと、最も優れたデザインを生み出したプロンプトは、いずれも同じ6つの要素を指定しています。
画面タイプ: 欲しい画面を明示します（ホーム画面、ダッシュボード、プロフィール）。
主要なUI要素: 含めるべきコンポーネントを列挙します（カード、チャート、ナビゲーション、ボタン）。
ビジュアルスタイル: 美学に名前を付けるか（グラスモーフィズム、ブルータリスト、スイススタイル）、具体的に詳しく説明します。
カラー: 名前、16進数コード、またはムードで色を指定します（落ち着いた青、エネルギッシュなコーラル）。
タイポグラフィ: フォントスタイル、階層、テキストの雰囲気に言及します。
ムード: 引き出したい感情的な反応を説明します。出力を平凡なテンプレートから一歩先へ押し出すのは、まさにこれだからです。
要点はシンプルです。曖昧なプロンプトは平凡な画面を生み、具体的なプロンプトは明確な視点を持ったデザインを生みます。1行だけのスニーカーのプロンプトでさえ、スタイル、カラー、エネルギーを指定しています。より大きな視点については、AIがアプリデザインをどう変えつつあるか、AIモバイルアプリデザインのガイド、そしてAIモックアップジェネレーターのガイドをご覧ください。
AIモバイルアプリデザインに適したプロンプトとは？
良いプロンプトは、画面、その主要なUI要素、ビジュアルスタイル、カラーパレット、タイポグラフィ、ムードを指定します。たとえば、残高カードとドーナツチャートを備えた金融ダッシュボード、クリーム色の背景とティールのアクセントを使ったライトモード、クリーンなサンセリフ書体、そして信頼感のあるプレミアムな雰囲気、といった具合です。この具体性こそが、AIに平凡なテンプレートではなく、明確な視点を持ったデザインを生み出させます。
モバイルアプリデザインのプロンプトはどう書けばいいですか？
まず画面とその構成要素から始め、そこにスタイルを重ねていきます。画面タイプとそのUI要素を示し、ビジュアルスタイルに名前を付け（グラスモーフィズム、ブルータリスト、スイス）、色を名前、16進数コード、またはムードで指定し、タイポグラフィを説明し、最後に欲しいムードで締めくくります。上記の10個のプロンプトはすべてこの順序に従っているので、どれか1つをコピーして自分の詳細に置き換えられます。
これらのプロンプトはコピーして使えますか？
はい。ここにあるプロンプトはすべて全文を掲載しているので、コピーして調整できます。アプリの種類を変えたり、カラーパレットを差し替えたり、ビジュアルスタイルを別のものに替えたりしてから、お使いのAIデザインツールで実行してください。これらは出発点であって、固定のレシピではありません。
これらのデザインを生成したAIツールは何ですか？
10個すべてSleekで生成しました。Sleekは、テキストプロンプトを数分で編集可能なiOSとAndroidの画面に変換し、その後Figmaへネイティブレイヤーとして、あるいはReactとTailwindのコードとしてエクスポートできるAIモバイルアプリデザインツールです。各デザインは、作成のたびにMattiaがXに投稿しました。
アプリデザインのプロンプトはどのくらい詳しく書くべきですか？
6つの要素を指定できる程度には詳しく、しかし矛盾が生じるほど長くならない程度に、というのが目安です。上記のプロンプトは1文（スニーカーマーケットプレイス）から段落まるごと（フライトトラッカー）まで幅があり、どちらも機能します。一般に、詳細が多いほど個性的な結果が生まれ、曖昧なプロンプトは平凡な結果を生みます。
AIはモバイルアプリ向けにどんなデザインスタイルを生成できますか？
スタイルに名前を付ければ、幅広い範囲に対応できます。上記の例は、グラスモーフィズム、ライトモードのフィンテック、パステル、ダークモード、ネオ・ブルータリズム、メンフィス、レトロ90年代、Y2K、スイス・インターナショナル、ブルータリスト・カオスをカバーしています。具体的な美学に名前を付けることが、個性のあるデザインとデフォルトのテンプレートとの分かれ目です。
プロンプトから始め、自分のものにする
好みのデザインに最も早くたどり着く方法は、すでに機能するものから始めることです。上記のどれかのプロンプトをコピーし、アプリの種類とスタイルを自分のアイデアに合わせて変え、実行してください。ローンチが目標なら、モバイルアプリデザイン向けベストAIツールとコーディングなしでモバイルアプリを作る方法のガイドが、デザインの次に何をすべきかをカバーしています。
自分で試す準備はできましたか？Sleekを開いて、プロンプトを貼り付ければ、数分で最初の画面が見られます。
最新の記事
