FLUXで文字入り画像を作る方法！ロゴ・バナー・UIモックアップのプロンプト例

監修者_SD以外

監修者プロフィール

森下浩志

日本最大級のAI情報プラットフォーム「romptn ai」編集長。著書に「0からはじめるStable Diffusion」「0からはじめるStable Diffusion モデル・拡張機能集編」など、AmazonベストセラーのAI関連書籍を多数執筆。AIにおける情報の非対称性を解消するための社内研修や出張講義も行う。

まず基本プロンプトを作る

FLUXで文字入り画像を作る時は、最初から「おしゃれなロゴを作って」だけで始めない方が安定します。画像の中に入れたい文字、置く場所、書体の雰囲気、背景、色を分けて書くと、モデルが何を優先すべきかを読み取りやすくなります。

Create a clean [asset type] for [brand or use case].
Include the exact text "[TEXT]" in [position].
Use a [font style] typography style.
Set the background to [plain background or scene].
Use [main color] and [text color], with high contrast.
Keep the text short, centered, and easy to read.

たとえばロゴなら [asset type] を square logo、バナーなら wide web banner、UIなら mobile app screen mockup に置き換えます。画像内の文字は [TEXT] に入れ、必ず引用符で囲むのが基本です。

最初の1枚で完璧にするより、文字、配置、背景の順に直していく前提で作ると失敗を切り分けやすくなります。次のセクションでは、この型を崩さないためのルールを整理します。

文字を崩さない5つのルール

文字入り画像で失敗しやすい原因は、画質指定の不足よりも、文字に関する指示が曖昧なことです。FLUXでは「欲しい文字を肯定文で具体的に書く」方が扱いやすく、Stable Diffusion系の癖である長いネガティブプロンプトに頼るより、入力側を整理する方が実用的です。

特にロゴやバナーでは、長い文章を1行で入れようとすると崩れやすくなります。まずは短い英字、短い日本語、1つの見出しから試し、読める形になってから装飾を足す順番が無難です。

「高品質」「プロっぽい」だけでは文字の正確さは上がりません。読ませたい文字がある時ほど、文字列そのものと表示条件を先に固定しましょう。

用途別プロンプト例

ここからは、ロゴ、バナー、UIモックアップの3つに分けてプロンプト例を出します。どの例も英語で書いていますが、考え方は同じです。画像の目的、入れたい文字、配置、色、余白を分けて書くことで、生成結果のどこを直せばよいかが見えやすくなります。

使う時は、まず引用符の中だけを自分の文言に置き換えてください。次にブランド色、背景、縦横比を変えます。最初から背景小物や装飾を増やすと、文字の優先度が下がることがあるため、1回目はシンプルに出すのがおすすめです。

ロゴは短いブランド名、バナーは見出しとCTA、UIは画面内のボタン文言が主役です。目的ごとに「読ませたい文字」が違うので、同じテンプレートを無理に使い回さず、次の3パターンから近いものを選びましょう。

① ロゴを作る

ロゴでは、入れる文字を短くすることが最優先です。ブランド名、サービス名、2〜3語のスローガン程度に絞り、背景は白、黒、単色グラデーションなど単純なものから始めます。

Create a minimal square logo for a premium coffee brand.
Include the exact text "MORNING LAB" in the center.
Use bold geometric sans-serif typography with clean letter spacing.
Use a plain warm white background.
Use deep brown text with a small gold accent line.
Keep the logo flat, balanced, and easy to read.

ブランド名が崩れる場合は、まず文字数を減らします。MORNING LAB COFFEE ROASTERS のように長くせず、MORNING LAB だけで検証してから、必要なら後編集で細かい表記を足す方が安全です。

ロゴ風の画像では、文字の正確さとデザインの雰囲気が競合しやすくなります。読ませる文字が最重要なら、背景の装飾、立体感、複雑なシンボルは後回しにしましょう。

② バナーを作る

バナーでは、1枚の画像に入れる文字を「見出し」「補足」「CTA」に分けます。全部を同じ大きさで入れるのではなく、見出しを一番大きく、補足は短く、CTAはボタン内の短い言葉にすると読みやすくなります。

Create a wide 16:9 web banner for an AI design campaign.
Main headline: "CREATE FASTER" in large bold text at the left.
Small subcopy: "AI design tools for teams" under the headline.
Add a simple button with the exact text "START".
Use a clean white background with blue accent shapes.
Use high contrast black text and generous empty space.

バナーで長文を入れたい場合も、本文を画像内に全部入れる必要はありません。画像内ではクリックしたくなる短い言葉だけを見せ、詳しい説明は記事本文やLP側に置く方が、生成画像としても広告素材としても扱いやすくなります。

CTAの文字は START、TRY NOW、LEARN MORE のように短くします。日本語なら「無料で試す」「詳しく見る」程度に抑え、ボタン内に説明文を詰め込まないのがコツです。

③ UIモックアップを作る

UIモックアップでは、画面に何を置くかを文章だけでなく構造として伝えるのがポイントです。画面タイトル、カード、ボタン、タブ名を分けて書くと、単なる雰囲気画像ではなく、UIとして読める結果に近づきます。

Create a clean mobile app screen mockup for a task management app.
Screen title: "Today" at the top.
Show three task cards with short labels: "Plan", "Write", "Review".
Add one primary button at the bottom with the exact text "Add Task".
Use a white background, soft gray cards, and #2563EB as the accent color.
Use modern sans-serif UI typography and generous spacing.

UIでは、ボタンやカードの文言を長くしないことが大切です。実際のアプリ画面に近づけたいなら、各パーツの名前を短くし、ブランドカラーや余白を指定します。

また、UIモックアップは後からFigmaなどで作り直す前提のラフとして使うのも現実的です。文字を完全に確定させるより、レイアウト案やトーンを掴む用途に寄せると失敗が減ります。

文字が崩れる時の直し方

文字が崩れた時は、同じプロンプトに品質語を足すより、原因を1つずつ減らします。最初に見るべきなのは、文字が長すぎないか、場所が曖昧でないか、背景が複雑すぎないかの3点です。

一度に全部直そうとすると、どの指示が効いたのか分からなくなります。まず文字列だけを短くして再生成し、次に配置、最後に色や背景を調整する順番にすると、再現性のあるプロンプトに近づきます。

ここからは、よくある3つの失敗を具体的に直していきます。

① 抽象指示を具体化する

clear text や correct spelling は便利そうに見えますが、何をどこに、どんな形で出すのかが曖昧です。文字を読ませたい時は、抽象的な品質指示を具体的な表示条件に置き換えます。

Bad:
Make a stylish sale banner with clear text and correct spelling.

Better:
Create a clean sale banner.
Include the exact text "SUMMER SALE" in large bold letters at the center.
Use white text on a solid red background.
Keep the text horizontal, evenly spaced, and easy to read.

改善後のプロンプトでは、文字列、サイズ感、場所、色、背景が明確です。これなら失敗した時も「背景をもっと単純にする」「文字を中央に固定する」のように調整できます。

抽象語を完全に使ってはいけないわけではありません。ただし、文字の正確さを左右する部分は抽象語に任せず、読ませたい文字と表示条件を明示しましょう。

② 文字を短くする

画像内に長い文章を入れようとすると、文字の崩れや読みにくさが出やすくなります。1つの長いコピーをそのまま入れるより、見出し、サブコピー、CTAに分ける方が安定します。

Too long:
"Discover the easiest way to create beautiful marketing images with AI today"

Split version:
Headline: "CREATE WITH AI"
Subcopy: "Fast marketing visuals"
Button text: "TRY NOW"

日本語でも同じです。「AIでマーケティング画像をすばやく作成し、チームの制作時間を短縮する」より、「AIで作る」「制作時間を短縮」「試してみる」のように役割ごとに分けた方が画像内では読みやすくなります。

どうしても長い説明を見せたい場合は、画像生成で作るのは背景やレイアウトまでにし、正確な本文テキストはデザインツール側で重ねる選択肢もあります。生成AIに全部任せるより、使う場面に合わせて分担した方が完成度は上がります。

③ 背景と余白を整える

文字そのものを短くしても読みにくい場合は、背景と余白を疑います。派手な写真、細かい柄、強い光、複数の被写体があると、文字の輪郭が埋もれやすくなります。

Create a square promotional image.
Include the exact text "NEW MENU" in the center.
Use large bold black letters.
Use a plain cream background with no pattern.
Leave generous empty space around the text.
Keep the composition minimal and high contrast.

背景を残したい場合でも、文字の周りだけは余白を作ります。generous empty space around the text、solid color panel behind the text、high contrast typography のように、文字を読むためのスペースを指定してください。

色は感覚語だけでなく、必要に応じてHEX色で指定します。ブランドカラーを使う時は、背景色と文字色の組み合わせまで書くと、雰囲気だけでなく読みやすさも制御しやすくなります。

日本語と長文の注意点

FLUXへの指示文自体は日本語で書き始めても構いません。ただし、画像内に正確に表示したい文字まで長い日本語にすると、文字数や字形の複雑さで崩れやすくなることがあります。

実務で使うなら、まず短い英字や短い日本語でレイアウトを固めるのがおすすめです。たとえばロゴなら英字ブランド名、バナーなら短い見出し、UIなら短いボタン文言に絞ります。

日本語を入れる場合は、次のように短くします。

Include the exact Japanese text "新発売" in the center.
Use large bold typography.
Use a plain white background and high contrast black text.

長い説明文、細かい利用規約、価格表のように正確さが重要な文字は、生成後にCanva、Figma、Photoshopなどで重ねる方が安全です。FLUXは画像の雰囲気作りと大きな短文、デザインツールは最終的な文字精度、という分担で考えると失敗しにくくなります。

既存記事との使い分け

この記事は、FLUX全体のプロンプト例を広く並べる記事ではありません。写真、イラスト、ロゴ、UIをまとめて見たい場合は総合プロンプト集が向いていますが、ここでは「画像内の文字をどう読ませるか」に絞っています。

使い分けの目安はシンプルです。FLUXでどんな絵が作れるかを知りたいなら総合記事、ロゴ名やバナー文言が崩れる原因を直したいなら本記事を使ってください。

また、実務でロゴや広告素材を使う場合は、商用利用条件やモデル選びも別で確認が必要です。ローカル運用、API利用、参照画像を使った素材制作では注意点が変わるため、必要に応じて関連テーマも確認しておくと安心です。

本記事の役割は、FLUXを選ぶ理由を広く語ることではなく、読める文字入り画像を作るためのプロンプト設計を手元で使える形にすることです。

まとめ

FLUXで文字入り画像を作る時は、魔法の品質語を足すより、読ませたい文字を短くし、引用符で囲み、場所、書体、背景、色を分けて指定することが重要です。

まずは次の順番で試してください。

ロゴは短いブランド名、バナーは見出しとCTA、UIモックアップは短いラベルに分けると、生成結果を直しやすくなります。長文や正確な日本語が必要な場合は、生成後にデザインツールで文字を重ねる判断も現実的です。

文字入り画像は、プロンプトだけで完結させるより、FLUXでレイアウトと雰囲気を作り、必要な文字精度は後編集で仕上げると実務に乗せやすくなります。まずはこの記事のテンプレートを1つ選び、自分のロゴ名やバナー文言に置き換えて試してみてください。