markfulton/NanoBananaEditor

何を解決するか

Nano Banana AI Image Editor は、テキストから画像を生成し、既存の画像に対して正確で会話形式の編集を行うためのプロフェッショナルなインターフェースを提供します。ユーザーが自然言語で変更を記述し、マスクツールで特定の領域を指定することで、複雑な手動編集の必要を排除します。

動作方法

React と TypeScript で構築されたこのアプリケーションは、Google の Gemini 2.5 Flash Image モデルを Google Generative AI SDK を通じて統合しています。ユーザーはプロンプトから画像を生成するか、編集モードに入り、画像の特定領域にマスクを描画し、テキストによる変更指示を入力できます。アプリは Konva.js を使用してインタラクティブなキャンバスを実装し、IndexedDB を使ってアセットをオフラインでキャッシュします。

対象ユーザー

このツールは、フロントエンドインフラをゼロから構築しなくても、本番環境対応の AI 画像生成および領域認識編集が可能なツールを必要とするクリエイターおよび開発者向けに設計されています。

主な特徴

• 会話形式の編集: 自然言語による指示で画像を編集できます。
• 領域認識選択: ブラシツールを使ってマスクを描画し、ターゲット編集を実現します。
• リファレンス画像対応: 最大2つのリファレンス画像を使って、生成と編集のスタイルをガイドできます。
• 非破壊ワークフロー: 元の画像を保持しつつ、編集履歴とバリエーションの分岐構造を維持します。
• エンタープライズ対応機能: AI の出典を確認できる SynthID による非表示ウォーターマークと、完全な TypeScript の型安全性を備えています。