1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Amazon Nova Reel × GradioでGIFバナーを自動生成する社内ツールを作ってみた

Last updated at Posted at 2025-05-01

生成AIまわりではBedrockやClaudeなどいろいろ触ってきたのですが、画像生成や動画生成については前から気になっていたものの、あまり手を出せていませんでした。

そんなときに今年3月のAWS Innovateへ参加したところ、電通デジタルのAmazon Nova Reel導入事例を知りました。Nova Reelで生成した背景動画とバナー画像を合成して動くGIFバナーを自動生成するというもので、社内ツールとしても普通に使えそうだな...と思い、勉強がてら自分でも作ってみることにしました。

※ 元記事

Nova Reelとは

Nova Reelは、Amazon Bedrockに搭載された動画生成AIモデルです。プロンプトから最大6秒の動画を生成でき、商用利用も可能な設計になっています。

例えば、以下のようなプロンプトを与えると...

A seamless loop of glowing neon lights forming a tunnel in a futuristic cyberpunk city, vivid pinks, blues, and purples, flying particles, digital haze, sci-fi ambiance

このような近未来的なアニメーション背景が生成されます(※下のGIFはバナー合成済みの例です)。

animated_banner_generated_video (1).gif

システム構成

以下が今回作成した処理の流れです。

  1. バナー画像(背景透過済)をアップロード
  2. Nova Reelで背景動画を生成
  3. moviepyで動画からフレームを抽出
  4. 各フレームにバナー画像を合成
  5. 合成済みフレームをGIFに変換
  6. 完成したGIFをS3にアップロード

ソースコードはこちらです。

GradioによるUI構築

誰でも簡単にGIFを生成できるように、Gradioで以下のUIを構築しました。

  • 透過PNG画像のアップロード
  • Nova Reel用プロンプトの入力欄
  • 「手動透過画像を使うか」のチェックボックス
  • GIF生成の実行ボタン
  • 実行ログ+生成されたGIF+S3リンクの表示
  • GIFのダウンロードボタン

スクリーンショット 2025-04-16 21.43.46.png

このUIはそのままHugging Face Spacesにデプロイし、Organizationのメンバーだけが使えるように制限をかけています。

AWSとの接続

Gradioアプリからは、以下のAWSサービスと連携しています。

  • S3:バナー・動画・生成されたGIFの保存先
  • Bedrock:Nova Reelによる動画生成

セキュリティ上、AWSキーはHugging Face SpacesのSecretsに保存し、boto3から環境変数経由で読み込んでいます。

s3 = boto3.client("s3", region_name=os.environ["AWS_REGION"])
s3_bucket = os.environ["S3_BUCKET"]

実際に生成したGIF例

1. ゴールド光背景 × セールバナー

「ラグジュアリー」「限定感」「きらびやかさ」を演出したいときのセールバナーを想定しました。

使用画像

Big-sale-banner-design-template-on-transparent-background-PNG.png

プロンプト

A radiant golden light background, with shimmering beams of light radiating outward from the center, glowing and elegant, soft gradients, luxurious and ethereal atmosphere, seamless and loopable

生成されたGIF

gradio_generated_banner.gif

2. サイバーパンクなネオン背景 × 高級車

先進的なブランドやプロダクトのイメージ訴求を想定しました。

使用画像

luxury_car_banner_500.png

プロンプト

A seamless loop of glowing neon lights forming a tunnel in a futuristic cyberpunk city, vivid pinks, blues, and purples, flying particles, digital haze, sci-fi ambiance

生成されたGIF

animated_banner_generated_video (1).gif

3. データセンター風背景 × ペンギン

テクノロジー感満載の背景にペンギンを重ねて親しみやすさを加えてみました。

使用画像

penguin_running_box_500.png

プロンプト

A high-tech data center corridor with glowing blue server racks, animated fast-scrolling binary code and data streams flying through the aisles, motion blur, futuristic cyberpunk lighting, ultra detailed

生成されたGIF

animated_banner_generated_video.gif

まとめ

生成には1回あたり5分ほどかかりますが、SNS広告やLP素材として活用できそうな動画バナーが手軽に作れるのはかなり魅力的だと思います。

Nova Reelはまだ知名度の低いモデルかもしれませんが、アイデア次第でかなり使いようがありそうだと思いました。

おまけ

ワッパーの後ろでハンバーガーの王様が走っているバナーです。

gradio_generated_banner (1).gif

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?