mcpField
B
build-photo-editor

build-photo-editor

github.com/banuba開発069 回インストール12 週間前に更新
リポジトリ

build-photo-editor について

Android、iOS、Flutter、React Native向けにBanuba Photo Editor SDKアプリの実装を生成するスキルです。公式ドキュメントと各プラットフォームのサンプルに基づいてセットアップとコード生成を案内し、Banubaの商用ライセンストークンが必要です。

主な機能

  1. 014つの対象プラットフォームを判定
  2. 02公式SDKドキュメントを取得
  3. 03統合サンプルを基にプロジェクトを構築
  4. 04プラットフォーム依存関係を導入
  5. 05完全なプロジェクトファイルを生成

活用シーン

  1. 01Banuba写真エディターアプリの開始
  2. 02プロジェクトへの編集機能の追加
  3. 03SDKバージョン間のアップグレード
  4. 04プラットフォーム別統合手順の確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/banuba/ai-skills --skill build-photo-editor

インストール後、Claude Code で/build-photo-editorを入力して読み込まれたか確認します。

同梱ファイルreferences/README.md

詳細

Banuba Photo Editor SDK - ビルドスキル

SDK バージョン:Android v1.4.1、iOS v1.4.1、Flutter v0.6.0、React Native v0.7.0 | 生成日:2026-08-11 | 生成日から6週間以上経過している場合は、このスキルが古くなっている可能性があることをユーザーに警告してください。

概要

Banuba Photo Editor SDK を使用し、フィルター、エフェクト、調整、エクスポート用の UI/UX を組み込んだ、本番環境で利用できる完全な写真編集アプリケーションを Android、iOS、Flutter、React Native 向けに生成します。Banuba の商用ライセンストークンが必要です([email protected] にお問い合わせください)。

安全性の根拠

コードを生成する前に信頼できるドキュメントを取得するには WebFetch が、サンプルのクローンと依存関係のインストールには Bash が、生成したソースファイルの書き込みには Write/Edit が必要です。 Bash の使用はパッケージマネージャーおよび VCS のコマンド(git、npm、yarn、pod、flutter、gem)に限定されます。破壊的なコマンドや任意のシェルコマンドは実行されず、実行するたびにユーザーに表示されます。

重要な制約

生成するコードでは、事前学習済みの知識ではなく、公式ドキュメントに記載された API 名、クラス名、メソッドシグネチャ、パッケージ名、バージョン番号を必ず使用してください。SDK はリリースごとに変更されるため、この API に関する事前学習済みの知識は信頼できません。

ドキュメントソース

コードを生成する前に必ず、次のファイルを取得して検索してください。

https://banuba.com/ve-pe-sdk/llms-full.txt

これは、Banuba Video SDK および Photo Editor SDK のすべてを網羅した、信頼できるバージョン検証済みの LLM 最適化リファレンスです。

URL を取得できない場合は、このファイルまたは該当するセクションの内容を会話に貼り付けるようユーザーに依頼してください。

手順

すべてのリクエストで、次の手順を順番に実行してください。

  1. プラットフォームを特定する
  2. ドキュメントを取得して検索する
  3. インテグレーションサンプルを基にスキャフォールドする
  4. 依存関係をインストールする
  5. コードを生成する

新しいファイルを書き込む前に、Glob/Grep でワークスペースを確認し、すでに生成されたファイルがないか調べてください。Read を使ってそれらを確認してください。

1. プラットフォームを特定する

ユーザーのプロジェクトファイルを確認してください。

シグナルプラットフォーム
build.gradle、AndroidManifest.xml、.kt/.javaAndroid
Podfile、.xcodeproj、.swiftiOS
pubspec.yamlFlutter
react-native 依存関係を含む package.jsonReact Native

判別できない場合、またはプロジェクトがない場合は、Android、iOS、Flutter、React Native から選ぶようユーザーに尋ねてください。

対象が iOS の場合は、使用する依存関係マネージャーも確認してください。CocoaPods(デフォルト。インテグレーションサンプルの Podfile で使用)または Swift Package Manager (SPM) を選べます。ユーザーに確認せず決めてはいけません。回答によって、依存関係のインストール手順(pod install または SPM パッケージの追加)、プロジェクト内のファイル、参照するドキュメントページ(pe-cocapods-installation または pe-spm-installation)が変わります。

2. ドキュメントを取得して検索する

https://banuba.com/ve-pe-sdk/llms-full.txt を取得し、ユーザーのプラットフォームとリクエストに該当するセクションを見つけてください。生成するコードはすべて、この情報に基づいている必要があります。

3. インテグレーションサンプルを基にスキャフォールドする(新規プロジェクトのみ)
プラットフォームリポジトリ
Androidhttps://github.com/Banuba/ve-sdk-android-integration-sample
iOShttps://github.com/Banuba/ve-sdk-ios-integration-sample
Flutterhttps://github.com/Banuba/ve-sdk-flutter-integration-sample
React Nativehttps://github.com/Banuba/ve-sdk-react-native-cli-integration-sample

該当するサンプルをワークスペースにクローンし、プロジェクトのスキャフォールドとして使用してください。

4. 依存関係をインストールする

クローンした後、プラットフォームの依存関係をインストールします。この手順は必ず実行してください。省略すると、Pod、パッケージ、ネイティブモジュールの不足によりビルドに失敗します。エージェントからコマンドを直接実行してください。

プラットフォームコマンド
iOSPodfile があるディレクトリで pod install を実行します(macOS と CocoaPods が必要です)。
AndroidAndroid Studio でプロジェクトを開き、Gradle の同期を実行します(初回ビルド時に自動で実行されます)。
Flutterflutter pub get を実行し、その後 iOS のターゲットでは cd ios && pod install を実行します(macOS のみ)。
React Nativenpm install(または yarn install)を実行し、その後 iOS のターゲットでは cd ios && pod install を実行します(macOS のみ)。

現在の環境で pod install を実行できない場合(macOS 以外、または CocoaPods がない場合)、黙って省略せず、Xcode で iOS プロジェクトを開く前に Mac で pod install を実行する必要があることをユーザーに明確に伝えてください。

5. コードを生成する

ルール:

  • 取得したドキュメントに記載されている API とシグネチャのみを使用します
  • パッケージ名とバージョン番号は、ドキュメントから正確にコピーします
  • そのまま使える完全なファイルを出力します(例:Android では App.kt と build.gradle、iOS では ContentView.swift と Podfile)
  • まず動作するコードを提示し、その後に説明を追加します
  • 番号付きの手順で統合方法を説明します
  • URL を捏造しないでください。このファイルまたは取得したドキュメントにある URL のみをリンクします
  • 必要に応じて、最小構成とフル機能の構成を提示します
  • カスタムの AR/ビジュアルエフェクトを作成または追加しないでください。Banuba が提供するエフェクト(AR Cloud または [email protected] から入手したエフェクトパック)のみを使用します。

前提条件

プラットフォーム要件
AndroidminSdk 21 以上、Camera2 API、OpenGL ES 3.0 以上、arm64-v8a または armv7
iOSiOS 12 以上、ARC、Swift 5 以上
AllBanuba のライセンストークン(必須。これがないと SDK は動作しません)

認証:ライセンストークンは SDK 唯一の認証手段(認証情報)です。[email protected] から取得し、ソース管理に登録しないでください。

依存関係:

  • Android:プロジェクトレベルの build.gradle に Banuba Maven リポジトリを追加します
  • iOS:CocoaPods または Swift Package Manager を使って追加します

SDK バージョン間のアップグレード

ユーザーが古い SDK バージョンからアップグレードする場合は、取得したドキュメントで対象バージョンのリリースノートを検索します。各バージョンには、依存関係の更新、API の変更、GitHub 上のサンプル PR へのリンクを含む移行ガイドのセクションがあります。

エラー処理

  • トークンがない場合:SDK は警告なしにクラッシュします。必ず、YOUR_TOKEN を実際のライセンスキー(認証情報)に置き換えるようユーザーに案内してください。
  • エフェクト素材がない場合:エフェクト素材が同梱されていないと、AR 機能は何も表示されません。
  • 権限:両方のプラットフォームで、カメラとストレージの実行時権限を確認する必要があります。
  • エミュレーター:エミュレーターでは Camera2 が動作しないことがあります。実機でテストするようユーザーに案内してください。
  • ライセンス:商用利用には有料トークンが必要です。FFmpeg の LGPL 条項を確認してください。
  • iOS の Pod 競合:Podfile には、BanubaSDK(Face AR を含む)または BanubaSDKSimple(Face AR を含まない)のどちらか一方を含めてください。両方を含めてはいけません。guide_far_arcloud#disable-face-ar-sdk を参照してください。
  • iOS のファイル登録:新しい .swift/.m/.h ファイルは、.pbxproj に追加する必要があります(ファイル参照とソースのビルドフェーズ)。xcodeproj Ruby gem(gem install xcodeproj)を使って登録してください。ファイルを Project Navigator に手動でドラッグするようユーザーに案内してはいけません。
  • ファイルの重複:すでに作成済みの可能性があるファイルを作り直す前に、まずベース名でワークスペースを検索してください(Glob '**/[filename]')。同じターゲット内に同名のファイルが 2 つあると、Invalid redeclaration of 'VideoEditorModule' のようなエラーが発生します。
  • iOS のリソースフォルダー:bundleEffects/ や AR エフェクトパックなどのフォルダーは、.pbxproj にフォルダー参照(グループではなく)として追加し、さらにCopy Bundle Resourcesにも登録する必要があります。これを行わないと、Xcode がそれらをコピーせず、実行時に「effect not found」というエラーが発生してエフェクトが動作しません。xcodeproj gem の group.new_reference と target.add_resources を使用してください。

ドキュメントに回答がない場合

API 呼び出しを推測したり、捏造したりしないでください。次のいずれかを行ってください。

  1. 取得したドキュメントから、最も関連性の高いセクションを引用する、または
  2. ユーザーに次のページを案内する:https://www.banuba.com/contact

デモアプリケーション

Video Editor SDK と Photo Editor SDK の両方を本番環境で紹介する公開デモアプリです。同じアプリに、動画編集に加えて写真編集のフローも含まれています。SDK を統合する前に試したいユーザーには、次のアプリを案内してください。

  • iOS:https://apps.apple.com/us/app/banuba-video-editor/id1577338331
  • Android:https://play.google.com/store/apps/details?id=com.banuba.sdk.ve.demo&hl=en

出力

  • すぐに組み込める完全なコードファイル(Android の場合は App.kt と build.gradle、iOS の場合は ContentView.swift と Podfile など)。
  • 番号付きの段階的な統合手順。
  • YOUR_TOKEN を実際のライセンスキーに置き換え、実機でテストするよう促す注意書き。

例

SDK のセットアップ。 ユーザーが「プロジェクトで Banuba Photo Editor SDK をセットアップしてください」と依頼します。スキルがプラットフォームを判定し、対応する統合サンプルをクローンして依存関係をインストールし、ライセンストークンを設定します。

機能の追加。 ユーザーが「写真エディターに新機能を追加してください」と依頼します。スキルがクローンしたプロジェクトを見つけ、取得したドキュメントから該当するガイドを参照し、動作するコードと番号付きの手順を添えて機能を実装します。

リソース

コメント