COOSY BLOG
  • HOMEホーム

  • SERVICEサービス

    • サービスTOP
    • Web制作
    • ブランディング
    • デジタルマーケティング
    • 戦略企画
    • DX推進・システム開発
    • グローバル展開
  • WORK制作実績

    • 制作実績TOP
    • コーポレートサイト
    • 採用サイト
    • ECサイト
    • プロモーション
    • サービスサイト・SaaS
    • システム開発
  • ABOUTクーシーについて

    • クーシーについて
    • 会社情報
    • 私たちが大切にしていくこと
    • お知らせ
    • クーシーラボ岩手
    • ロンドン支社
    • ミャンマー支店
  • BLOGブログ

  • RECRUITリクルート

  • Contactお問い合わせ

BLOG MENU

  • BLOGトップ
  • 目的別

    • 目的別TOP
    • コーポレートサイト
    • ECサイト
    • オウンドメディア
    • 採用サイト
    • プロモーション
    • Webサービス
    • LP
    • ブランディング・CI
  • Web制作ハウツー

    • Web制作ハウツーTOP
    • UIUX・サイト設計
    • WebデザインTips
    • PM/ディレクション
    • フロントエンド(HTML/CSS)
    • 撮影・動画編集
    • ライティング
    • CMS
    • Web制作ツール
    • イラスト
  • システム開発

    • システム開発TOP
    • プログラミング
    • EC構築
    • CMS開発・構築
    • サーバ構築
    • データベース構築
    • セキュリティー
  • Webサイト運用のコツ

    • Webサイト運用のコツTOP
    • サイト運用・管理・保守
    • コンテンツ運用
    • CRM(顧客管理)
  • Webマーケティング

    • WebマーケティングTOP
    • SEO対策・トレンド
    • コンテンツ制作・SEOライティング
    • アクセス解析
    • Web広告
    • Web集客ハウツー
  • 特集

    • 特集TOP
    • Web最新トレンド
    • カルチャー
    • ガジェット

Share on

  • Xでシェアする
  • Facebookでシェアする
  • このエントリーをはてなブックマークに追加

注目の画像生成AI!「Adobe Firefly」Web版の使い方をシンプルに解説

  • Web制作ハウツー
  • 特集
  • WebデザインTips
  • Web最新トレンド
注目の画像生成AI!「Adobe Firefly」Web版の使い方をシンプルに解説

2023年9月13日、Adobe社は画像生成AI「Adobe Firefly」のWeb版を発表しました。

これにより、PhotoshopなどのAdobe製品内だけでなく、誰もがWebブラウザ上で「Adobe Firefly」を使って画像を生成することができるようになります。

本記事では、Adobe社の画像生成AI「Firefly」について、できることと使い方を解説します。

Adobe FireflyのWeb版は誰でも無料で使えますが、とくに無料で使う場合には注意点がありますので、ぜひ最後までお読みください。

Adobe Fireflyの注目ポイント:商用利用可能

Stable Diffusion、Midjourneyなどの画像生成AIがすでに話題となっている中で、Adobe Fireflyがにわかに注目されています。
従来の画像生成AIと大きく違うのは、生成画像の商用利用が可能であるところです。

なぜ商用利用が可能なのか。理由はAIのトレーニングで使う画像にあります。

Fireflyの初代モデルが、トレーニングに用いたのは以下のコンテンツです。

  • Adobe Stockのオープンライセンスのコンテンツ
  • 著作権の切れた一般コンテンツ

Adobe Fireflyは、他のユーザーやブランドの知的財産をもとにしたコンテンツを生成しないので、商用利用ができるのです。
以下の公式サイトの記載からも、気軽に商用利用できるように配慮されていることが伺えます。

最初に搭載されるモデルは、Adobe Stockの画像や一般に公開されているライセンスコンテンツや著作権が失効しているパブリックドメインコンテンツを対象としており、画像やテキストエフェクトを中心に、商業利用として安全性を考慮したコンテンツを生成するように設計されています。

引用元

Adobe

Adobe Firefly Web版を使うには?

Adobe Firefly Web版を使ってみましょう。

Adobe Fireflyにログインします。

アカウントがない人は、アカウントを作成からどうぞ。Googleアカウントを利用したら、1クリックでできました。

ログインできたら、使いたい機能をクリックします。
2023年9月現在、Web版で利用できるのは以下の4つの機能です。

  1. テキストから画像生成

    内容を詳細に説明するテキストから画像を生成します。

  2. 生成塗りつぶし

    ブラシを使用して画像の一部を削除したり、テキスト入力で新しい画像を加えたりできます。

  3. テキスト効果

    テキストプロンプトによって、画像だけでなくテキストにも、スタイルやテクスチャなどの装飾ができます。

  4. 生成再配色

    イラストのSVGファイルを使って、テキスト説明によりカラーバリエーションを作成できます。

Adobe Firefly Web版

参考

https://firefly.adobe.com/#

Adobe Firefly Web版を使う際の注意点

Adobe Firefly Web版、とくに無料で使う際には、生成クレジットの残量に気をつけましょう。

生成クレジットとは、画像生成に必要なお金のようなものです。無料版の場合、1ヶ月で25のクレジットが与えられます。
使い切ったら、その月は終わり。月が変われば再度付与されます。

ちなみに25クレジットは、気をつけて使わないとあっという間になくなる量です。

クレジットは1処理に1クレジット消費します。ただしテキスト効果は、2023年10月31日まで0クレジット、つまりクレジットを消費しません。

生成クレジット残量の確認方法

生成クレジットの確認は、画面右上の個人のアイコンをクリックしてください。
以下のように、生成クレジットの残量が表示されます。

画面右上の個人のアイコンをクリック

有料プランの生成クレジット

有料プランだからといって、無制限で生成ができるわけではありません。
1ヶ月で使えるクレジットの量は以下の通りです。

プラン 月間の生成クレジット
Adobe Fireflyプレミアムプラン 100
Adobe Express プレミアムプラン 250
Creative Cloud 単体プラン(Illustratorの場合) 500
Creative Cloud すべてのアプリ 1000

Adobe Firefly Web版を使ってみた

Adobe Firefly Web版で使える4つの機能を使ってみました。
それぞれ使い方を解説します。

テキストから画像を作る

Fireflyのページで「テキストから画像生成」を選択します。

「テキストから画像生成」を選択

①生成したい画像のプロンプトを入れて、②「生成」ボタンをクリック。

ちなみに、表示されている画像にカーソルを当てると、プロンプトが見えるので参考になります。

「生成」ボタンをクリック

できた画像が今ひとつなら「更新」でもう一回。
調整を加えたい場合は、右側のメニューでオプションを選択し、再度生成します。

右側のメニューでオプションを選択

画像はダウンロードできます。
今回は4つの生成画像のうち、左上のロケットの画像を採用しました。

画像のダウンロード

画像の背景を変える

Fireflyのページで「生成塗りつぶし」を選択します。

画像をアップロードします。青いボタンから選択するか、もしくはファイルをドラッグ&ドロップしてください。
今回は、今作ったロケットの画像をアップします。

「生成塗りつぶし」を選択

地球と煙の部分を変えたかったので、「追加」のブラシで消します。
消したら、プロンプトを入力して「生成」をクリック。

プロンプト

地球をもっと青く。ロケット噴射の煙は雲のように広がっている。

生成されたロケットの画像

できたのがこちら。
3つ作ってくれますが、気に入らなければ「さらに生成」、OKなら該当の画像を選択した状態で「保持」をクリックします。
ダウンロードは右上のボタンからどうぞ。

右上のボタンからダウンロード

テキストに装飾を加える

Fireflyのページで「テキスト効果」を選択します。

装飾したいテキストと効果を入れればいいですが、はじめは何を入れたらいいかわからないかもしれません。
そんな時は「サンプルを表示」をクリック。

「テキスト効果」を選択

サンプルを参考に、右側の「サンプルプロンプト」から、適切なプロンプトを探します。 シェイプ、フォント、背景色なども変更可能です。
選んだら「生成」をクリック。

「生成」をクリック

できたら、ダウンロードしておきましょう。

画像をダウンロード

SVGイラストの配色を変える

Fireflyのページで「生成再配色」を選択します。

イラストのSVGファイルをアップロードしてください。

この操作をするにはSVGファイルが必要です。

SVGファイルをアップロード

SVGファイルをアップロードしたら、生成するカラーについて入力します。
今回は「レトロかつアバンギャルド」としました。
できたら「生成」をクリック。

「生成」をクリック

シンプルな図柄だったせいか、配色もシンプルなものができました。
こちらも右側のサンプルプロンプトなどを使って、調整が可能です。ダウンロードもできます。

画像のダウンロード

Adobe Firefly Web版を使った感想

Adobe Fireflyを使ってみて感じたのは、Web版単独というよりは、Adobe製品とのコラボで真価を発揮しそうだということです。

他の生成AIがそうであるように、Adobe Fireflyも使える素材を一発で出してくれるわけではありません。いかにプロンプトをうまく使うかが重要であり、試行錯誤と気にせず使える生成クレジットが必要です。

記事には書きませんでしたが、Adobe Expressでの編集も少しやってみました。Fireflyからの連携はスムーズだったので、他のAdobe製品でもおそらく同様でしょう。
AIでざっと作ったものを元に、人の手で細かい修正を加えるという使い方で、制作がより効率的になるのではないでしょうか。

IllustratorやPhotoshopをすでにお使いの方は、はっきり言って使わない手はありません! ぜひ試してみてください。

まとめ

以上、Adobe Fireflyの簡単な使い方をご紹介しました。
なお、今回ご紹介した機能がすべてではなく、今後も機能の追加が予定されているようです。
ページを見る限りでも、「スケッチからの画像作成」「3Dからの画像生成」などが開発中となっています。

まずは無料版からお試しください。きっと使いたくなる画像ができますよ。

クーシーブログ編集部

この記事を書いた人

クーシーブログ編集部

1999年に設立したweb制作会社。「ラクスル」「SUUMO」「スタディサプリ」など様々なサービスの立ち上げを支援。10,000ページ以上の大規模サイトの制作・運用や、年間約600件以上のプロジェクトに従事。クーシーブログ編集部では、数々のプロジェクトを成功に導いたメンバーが、Web制作・Webサービスに関するノウハウやハウツーを発信中。

お問い合わせはこちらから

Web制作デザイン、丸ごとお任せ

お問い合わせする

2023/10/16

テキスト:加藤久佳 デザイン:大坂間琴美

Share on

  • Xでシェアする
  • Facebookでシェアする
  • このエントリーをはてなブックマークに追加
お問い合わせはこちら

WebデザインTips・Web最新トレンドの関連記事はこちら

  • 【2月版】知っておきたい2025年Webデザインニュース!海外から最新情報をご紹介!

    2025年Webデザインの最新トレンドを海外からいち早くピックアップ!Photoshopのライブ共同編集機能、新作デザインツールTOP3、AI動画生成の最前線など、気になる情報をギュッとまとめました。Web制作者、デザイナー、マーケター必見の内容です。

    • Web最新トレンド
  • 求職者に刺さる! 採用サイト「数字で見る」コンテンツ設計と効果を出すポイント

    企業の魅力を最大化し求職者に訴求できる「数字で見る採用サイト」。豊富な実績と知見のあるWeb制作会社クーシーが採用サイトに入れるべき数値や実装のコツ、成功事例などをご紹介します。

    • 採用サイト
    • WebデザインTips
  • 【Webデザイン最新アイデア】プロも絶賛! 超参考になる「ギャラリー・まとめサイト」32選

    今回は、最新のWebデザインアイデアをチェックできるおすすめのWebギャラリーサイトを、デザインに強みを持つWeb制作会社クーシーが厳選してご紹介します。ぜひ活用して、デザインのヒントを見つけてみてください。

    • WebデザインTips
    • Web最新トレンド
  • 【Web担当者必見】2025年春、今押さえるべきWeb業界ニュースまとめ

    2025年の春(3〜4月)に話題となった最新のWeb業界ニュースを厳選してまとめました。Webマーケティング、SEO、トレンド、テクノロジーまで、Web担当者なら必ずチェックしておきたい情報が満載です。

    • Web最新トレンド
  • 【2025年4月最新】Webデザインニュース!海外の最旬情報をご紹介!

    Webデザイン最新情報の第2弾。ChatGPTを使った画像生成プロンプトの最新活用法と、Photoshop、Illustrator、Figmaの新機能を、未来のデザイン業界を切り拓く鍵と共にご紹介します。

    • Web最新トレンド
  • 【4月版】知っておきたい2025年Webデザインニュース!海外から最新情報をご紹介!

    デザイン業界は今月も話題が盛りだくさん。AIの進化やツールのアップデート、インスピレーションを刺激する海外サイトまで、日々変化するトレンドをキャッチアップすることがますます重要になっています。 今回は、デザイン力に強みを持つWeb制作会社クーシーが、注目のAIモデル「o3」「o4-mini」か

    • Web最新トレンド
  • 参考になる! おしゃれなコーポレートサイト16選:金融、学校、エンタメなど業種別にご紹介

    業界別に厳選したおしゃれなコーポレートサイト16選をプロが徹底解説! 「おしゃれ」と評価されるデザイン要素と秘訣を業種ごとに分析しています。金融、学校、ITなど各分野の印象的な事例から、制作プロジェクトに活かせるヒントが満載です。

    • コーポレートサイト
    • WebデザインTips
  • 【5月版】今知るべき2025年Webデザインニュース!海外から最新情報をご紹介!

    最新Webデザインニュースをお届けします。今月は、UI/UXワークフローの効率化に役立つAIツールや、Microsoftが導入した新機能を紹介。さらに、インパクトある海外サイトのファーストビュー3選をピックアップし、実務で活用できるアイデアをお伝えします。

    • Web最新トレンド

COOSYの
制作実績

UIUXと美しさを両立させた、クーシーが誇る成功事例一覧。
課題解決のアイデア満載です。

制作実績を見る

Web制作の課題はクーシーが解決します

  • AI導入支援

    生成AI導入でWebサイトを進化。チャットボットやRAG構築でDXを支援し、パーソナライズされた顧客体験を実現します。

  • Webデザイン

    UIUXと美しさを両立し、ブランドを「カタチ」に。SEO・AIOも考慮した戦略的ビジュアルで目標達成を支援します。

  • Webプロモーション

    LP制作で商品の魅力を伝え、広告運用で集客を最大化。SEO・AIOとデザインを連携し、宣伝効果を高めます。

CATEGORY LIST

  • すべての記事一覧

  • 目的別

    • 目的別TOP
    • コーポレートサイト
    • ECサイト
    • オウンドメディア
    • 採用サイト
    • プロモーション
    • Webサービス
    • LP
    • ブランディング・CI
  • Web制作ハウツー

    • Web制作ハウツーTOP
    • UIUX・サイト設計
    • WebデザインTips
    • PM/ディレクション
    • フロントエンド(HTML/CSS)
    • 撮影・動画編集
    • ライティング
    • CMS
    • Web制作ツール
    • イラスト
  • システム開発

    • システム開発TOP
    • プログラミング
    • EC構築
    • CMS開発・構築
    • サーバ構築
    • データベース構築
    • セキュリティー
  • Webサイト運用のコツ

    • Webサイト運用のコツTOP
    • サイト運用・管理・保守
    • コンテンツ運用
    • CRM(顧客管理)
  • Webマーケティング

    • WebマーケティングTOP
    • SEO対策・トレンド
    • コンテンツ制作・SEOライティング
    • アクセス解析
    • Web広告
    • Web集客ハウツー
  • 特集

    • 特集TOP
    • Web最新トレンド
    • カルチャー
    • ガジェット
  • WORKS

    Webサイト・アプリなどの
    様々な実例・制作実績のご紹介

    WORKS
  • CONTACT CONTACT

    Webサイトのご相談、お見積もりはこちらから

    Webサイトのご相談、お見積もりなど
    お気軽にお問い合わせください

ホーム

  • TOP
  • COOSY BLOG
  • 注目の画像生成AI!「Adobe Firefly」Web版の使い方をシンプルに解説
ページトップへ
  • TOP
  • SERVICE

    • ブランディング
    • デジタルマーケティング
    • 戦略企画
    • DX推進・システム開発
    • グローバル展開
    • Web制作
  • WORKS

    • コーポレートサイト
    • 採用サイト
    • ECサイト
    • プロモーションサイト
    • サービスサイト
    • システム開発
  • ABOUT

    • 会社情報
    • 私たちが大切にしていくこと
    • お知らせ
    • クーシーラボ 岩手
    • ロンドン支社
    • ミャンマー支店
  • RECRUIT

    • ディレクション部
    • デザイン部
    • システム開発部
    • アカウント・プランニング部
    • Webマーケティング事業部
    • 人事・総務部
    • オフショア
    • グローバル事業部
  • BLOG

    • 目的別
    • Web制作ハウツー
    • システム開発
    • Webサイト運用のコツ
    • Webマーケティング
    • 特集

COOSY SNS

  • facebook
  • X
  • お問い合わせ
  • Privacy policy
  • Site Policy
  • Security Policy
© COOSY All Rights Reserved.