# ゼロからAI画像生成アプリの構築方法 > 著者：Steven Lynn. Difyのテクニカルライター 画像生成技術の発展に伴い、Dall-e、Flux、Stable Diffusionなどの優れた画像生成ツールが多数登場しています。 本記事では、Difyを使用してAI画像生成アプリを開発する方法について学びます。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-09c0cc3055eccab6899b069255ce8fdb50f36313%2Fbuild-ai-image-generation-app-12-en.png?alt=media) ## 今回の学ぶポイント * Difyを使用してエイジェントの作り方 * エイジェントの基本的なコンセプト * プロンプトエンジニアリングの基本 * ツールの使用方法 * 大規模モデルの幻覚の概念 ## 1. Stablility API キーの設定 [こちら](https://platform.stability.ai/account/keys) をクリックして、ステイビリティAPIキー管理ページに移動します。 まだ登録していない場合は、API管理ページに入る前に登録を求められます。 管理ページに入ったら、キーをコピーするために`コピー`をクリックします。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-93d98e27bad2f92251c64fbeff340fbbecd5d54e%2Fbuild-ai-image-generation-app-1.png?alt=media) 次に、[Dify - ツール - Stability](https://cloud.dify.ai/tools) にキーを入力する必要があります。以下の手順に従ってください： * Difyにログインする * ツールに入る * ステイビリティを選択する * 承認をクリック ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-4d98b75ca33889561e4a0f155b1cd08596f8a5e7%2Fbuild-ai-image-generation-app-2-en.png?alt=media) * キーを入力して保存 ## 2. モデルプロバイダの設定 インタラクションを最適化するために、ユーザーの指示を具体化するための大規模言語モデル（LLM）が必要です。つまり、画像生成のためのプロンプトを記述します。次に、Difyでモデルプロバイダを設定します。 Difyの無料版では、200回の無料のOpenAIメッセージクレジットが提供されます。 メッセージクレジットが不足している場合は、以下の手順に従って他のモデルプロバイダをカスタマイズできます： **あなたのアバター - 設定 - モデルプロバイダ**の順にクリックします。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-e1be9e76357809e47ca5f90d94f9f980becc78d6%2Fbuild-ai-image-generation-app-3-en.png?alt=media) 適切なモデルプロバイダが見つからない場合は、groqプラットフォームがLlamaなどのLLM用に無料のコールクレジットを提供しています。 [groq API管理ページ](https://console.groq.com/keys)にログインします。 **API Keyの作成**をクリックし、希望の名前を設定してAPIキーをコピーします。 **Dify - モデルプロバイダ**に戻り、**groqcloud**を選択し、**設定**をクリックします。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-6194ad0492dca5eeb3612553251ae919db08bed8%2Fbuild-ai-image-generation-app-4-en.png?alt=media) API Keyを貼り付けて保存します。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-86b53a58910c07768f2d0a27ac0d8ed933252bc6%2Fbuild-ai-image-generation-app-5-en.png?alt=media) ## 3. エイジェントを作る **Dify - スタジオ**に戻り、**最初から作成**を選択します。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-bb1a774867cd377d1efc4565e63aff3a63948e79%2Fbuild-ai-image-generation-app-6-ja.png?alt=media) この実験では、エージェントの基本的な使用方法を理解するだけで十分です。 {% hint style="info" %} **エージェントとは？** エージェントは、人間の行動と能力をシミュレートするAIシステムです。自然言語処理を通じて環境とやり取りし、入力情報を理解し、対応する出力を生成します。エージェントはまた「知覚」能力を持ち、さまざまな形式のデータを処理し・分析し、さまざまな外部ツールやAPIを呼び出して使用してタスクを完了することができます。この設計により、エージェントはより柔軟に複雑な状況を処理し、ある程度人間の思考や行動パターンをシミュレートできるようになります。 {% endhint %} **エージェント**を選択し、名前を入力します。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-2a43fab54c3d789d34ed2cbf629170c92ec5ee77%2Fbuild-ai-image-generation-app-7-en.png?alt=media) 以下のようにエージェントのオーケストレーションインターフェースに入ります。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-91d8d861c561e74f50886dbed4b92d1cd5618f57%2Fbuild-ai-image-generation-app-8-en.png?alt=media) LLMを選択します。このチュートリアルでは、groqが提供するLlama-3.1-70Bを例にします： ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-3604ea8988dd46954afbf255fd2f0ed9a94ff997%2Fbuild-ai-image-generation-app-9-en.png?alt=media) **ツール**でステイビリティを選択します： ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-4705781db9c1239f87329fffaa34e6efb535a5bc%2Fbuild-ai-image-generation-app-10-en.png?alt=media) ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-f20def73e2b9e3a727b96e994d344fc565980c30%2Fbuild-ai-image-generation-app-11-en.png?alt=media) ### プロンプトの書き方 プロンプトはエージェントの核心であり、出力結果に直接的な影響を与えます。一般的に、プロンプトが具体的であればあるほど、出力も向上しますが、過度に長いプロンプトは逆効果になることもあります。 プロンプトを調整する技術は「プロンプトエンジニアリング」と呼ばれています。 この実験では、プロンプトエンジニアリングを完全に習得していなくても心配する必要はありません。後で段階的に学ぶことができます。 まずは、最もシンプルなプロンプトから始めましょう： ``` ユーザーのプロンプトに従って、指定された内容を stability_text2image を使用して描画してください。 ``` ユーザーがコマンドを入力するたびに、エージェントはこのシステムレベルの指示を理解し、ユーザーの描画タスクを実行する際には、stabilityというツールを呼び出すことを認識します。 例：女の子が開いた本を持っているのを描く。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-09c0cc3055eccab6899b069255ce8fdb50f36313%2Fbuild-ai-image-generation-app-12-en.png?alt=media) ### プロンプトを書くのかしなくても可能ですか？もちろん可能です！ プロンプトの上部にある**自動**をクリックしてください。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-f60ebb64c1e0c666e067d3f2c5436fa5b316fd9d%2Fprompt-gen-1-jp.png?alt=media) **指示**に要件を入力し、**自動**をクリックします。右側に生成されたプロンプトがAIによって作成されます。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-ff3c88310f0a972d5eba62a92c62550b4c90d762%2Fprompt-gen-2-jp.png?alt=media) ただし、プロンプトについての理解を深めるためには、初期段階ではこの機能に頼るべきではありません。 ## 発表 右上の公開ボタンをクリックし、公開後に**Run**を選択して、オンラインで実行されるエージェント用のWebページを取得します。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-369d4c0d8c5382f9116260ef37787eda2e1a752b%2Fbuild-ai-image-generation-app-13-jp.png?alt=media) このWebページのURLをコピーして、友人と共有することができます。 ## 質問1：生成された画像のスタイルを指定する方法は？ ユーザーの入力コマンドにスタイル指示を追加することができます。例えば：「アニメスタイルで、女の子が開いた本を描いてください。」 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-b98920f731179173e65406f4df65cfcaed8b88a1%2Fbuild-ai-image-generation-app-14-en.png?alt=media) ただし、デフォルトのスタイルをアニメスタイルに設定したい場合は、システムプロンプトにその旨を追加することができます。なぜなら、システムプロンプトはユーザーコマンドが実行されるたびに認識され、優先されるからです。 ``` ユーザーのプロンプトに従って、指定された内容をstability_text2imageを使用して描画してください。画像はアニメスタイルです。 ``` ## 質問2：特定のユーザーからのリクエストを拒否する方法は？ 多くのビジネスシナリオでは、いくつかの不適切なコンテンツの出力を避ける必要がありますが、LLMはしばしば「無知」であり、出力コンテンツが間違っていてもユーザーの指示に従います。このように、モデルが間違ったコンテンツを作り出してユーザーに答えようとする現象を「モデルの幻覚」と呼びます。したがって、必要に応じてモデルがユーザーのリクエストを拒否できることが重要です。 さらに、ユーザーがビジネスに関係のないコンテンツを要求することもあり、エージェントがそのようなリクエストを拒否する必要があります。 異なるプロンプトをカテゴリ別に整理するために、マークダウン形式を使用して、エージェントに不適切なコンテンツを拒否する方法を教えるプロンプトを「制約」のセクションに記述します。もちろん、このフォーマットは標準化のためのものであり、独自のフォーマットを持つこともできます。 ``` ## タスク ユーザーのプロンプトに従って、指定された内容をstability_text2imageを使用して描画してください。画像はアニメスタイルです。 ## 制約 もしユーザーが描画に関係のないコンテンツを要求した場合、「申し訳ありませんが、その内容は理解できません。」と返答してください。 ``` 例えば、今夜の夕食は何ですか？と聞いてみましょう。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-7f52f86a20a3a772d8f2c0d3c9f610b784a4d6b9%2Fbuild-ai-image-generation-app-15-en.png?alt=media) よりフォーマルなビジネスシナリオでは、感情的な単語ライブラリを使用してユーザーのリクエストを拒否することができます。 **Add Feature - Content Moderation**にキーワード「dinner」を追加します。ユーザーがそのキーワードを入力すると、エージェントアプリは「申し訳ありませんが、その内容は理解できません。」と出力します。 ![](https://3244742310-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FBl3K6n12AeCkG3icHwfh%2Fuploads%2Fgit-blob-c6c8934973e3a13c9497901316dbf5ebf8b81e5f%2Fbuild-ai-image-generation-app-16-en.png?alt=media)