原稿登録〜ダウンロードフローモック

管理画面＞デザインテンプレート登録管理者

デザインテンプレート登録

テンプレート名（Bubble側で入力）

開催月

デザインテンプレート選択

未選択

テンプレートを選択してください

選択 ▼

サイズ別サムネイル（7サイズ）

—

ハガキ

—

A3ノビ

—

レター

管理画面＞デザインテンプレート登録管理者

デザインテンプレート登録

テンプレート名（Bubble側で入力）

開催月

デザインテンプレート選択選択済

dt_001

テンプレート dt_001

designTemplateId: dt_001

変更 ▼

サイズ別サムネイル（7サイズ） GET /design-templates/dt_001/source-images で取得

si_001

si_002

si_003

si_004

ハガキ

si_005

A3ノビ

si_006

レター

si_007

管理画面＞デザインテンプレート登録＞保存完了管理者

保存完了

以下の情報がBubble DBに保存されました

Bubble DB: デザインテンプレート（親）
designTemplateId = dt_001 / 名前 = 桜デザイン - 春季用 / 開催月 = 4月 / thumbnailUrl = https://cdn.../dt_001.png

Bubble DB: デザインテンプレート画像（子 × 3件）
[A3] sourceImageId=si_001, thumbnailUrl=https://cdn.../a3.png
[A4] sourceImageId=si_002, thumbnailUrl=https://cdn.../a4.png
[B4] sourceImageId=si_003, thumbnailUrl=https://cdn.../b4.png

管理画面＞行事テンプレート作成管理者

行事テンプレートを作成

Brother APIは呼ばない — STEP1で登録済みのデザインテンプレートをBubble DB内から選択

業界

サブ業種

行事名（デフォルト値）

開催月

開催期間（デフォルト値）

プログラム（デフォルト値）

デザインテンプレート紐付け（STEP1で登録済みから選択）

デザイン1（必須）

選択 ▼

デザイン2（任意）

選択 ▼

デザイン3（任意）

選択 ▼

ユーザー画面＞行事テンプレートを選択してくださいユーザー

行事テンプレートを選択してください

Brother APIは呼ばない — Bubble DBの行事テンプレートから選択

春季例大祭（神社）

dt_001

dt_002

dt_003

4月 / 神社 / 3デザイン

盆踊り大会（寺院）

dt_004

dt_005

—

8月 / 寺院 / 2デザイン

七五三（神社）

dt_006

—

11月 / 神社 / 1デザイン

テンプレなしで作成

ユーザー画面＞春季例大祭＞原稿生成ユーザー

≪ 春季例大祭

dt_001
サムネイル表示

デザイン1

★★★★★

dt_002
サムネイル表示

デザイン2

★★★★★

dt_003
サムネイル表示

デザイン3

★★★★★

デザインを評価してダウンロード

「生成」ボタンを押して原稿を作成してください

長尺縦

長尺横

ハガキ

封筒

A4便箋

ユーザー画面＞春季例大祭＞生成中... ユーザー

≪ 春季例大祭生成中

dt_001
サムネイル表示

デザイン1

★★★★★

dt_002
サムネイル表示

デザイン2

★★★★★

dt_003
サムネイル表示

デザイン3

★★★★★

サイズ別プレビュー

長尺縦

長尺横

ハガキ

封筒

A4便箋

ユーザー画面＞春季例大祭＞生成完了ユーザー

≪ 春季例大祭生成完了

dt_001
サムネイル表示

デザイン1

★★★★★

dt_002
サムネイル表示

デザイン2

★★★★★

dt_003
サムネイル表示

デザイン3

★★★★★

サイズ別プレビュー

長尺縦

長尺横

ハガキ

封筒

A4便箋

Bubble DBに保存済: 各デザイン × 各サイズの generatedImageId / fileKey / thumbnailUrl

ユーザー画面＞春季例大祭＞評価ユーザー

≪ 春季例大祭

dt_001
サムネイル表示

デザイン1

★★★★★

dt_002
サムネイル表示

デザイン2

★★★★★

dt_003
サムネイル表示

デザイン3

★★★★★

デザインを評価してダウンロード

3種類すべてを評価するとダウンロードできます。

Brother APIは呼ばない — 評価データはBubble DBに保存。thumbnailUrlで画像を直接表示

長尺縦

長尺横

ハガキ

封筒

A4便箋

ユーザー画面＞春季例大祭＞行事情報編集ユーザー

行事情報を編集

変更を保存して再生成ボタンを押下

行事名

開催期間 ← 変更

プログラム ← 変更

備考

ユーザー画面＞春季例大祭＞再生成中... ユーザー

≪ 春季例大祭再生成中

dt_001
サムネイル表示

デザイン1

★★★★★

dt_002
サムネイル表示

デザイン2

★★★★★

dt_003
サムネイル表示

デザイン3

★★★★★

サイズ別プレビュー

長尺縦

長尺横

ハガキ

封筒

A4便箋

ユーザー画面＞春季例大祭＞再生成完了ユーザー

≪ 春季例大祭再生成完了

dt_001
サムネイル表示

デザイン1

★★★★★

dt_002
サムネイル表示

デザイン2

★★★★★

dt_003
サムネイル表示

デザイン3

★★★★★

サイズ別プレビュー

〜4/23

長尺縦

〜4/23

長尺横

〜4/23

ハガキ

〜4/23

封筒

〜4/23

A4便箋

〜4/23

Bubble DB 更新済: 各デザイン × 各サイズの generatedImageId / fileKey / thumbnailUrl を新しい値で上書き

API呼び出し

1テンプレート一覧取得

GET/design-templates

レスポンス

designTemplateId thumbnailUrl

Response { "designTemplates": [ { "designTemplateId": "dt_001", // Design Template DB.designTemplateId "thumbnailUrl": "https://cdn.../dt_001.png" // Design Template DB.thumbnailUrl }, { "designTemplateId": "dt_002", "thumbnailUrl": "https://cdn.../dt_002.png" }, ... ] }

API呼び出し

2サイズ別画像一覧取得

GET/design-templates/{designTemplateId}/source-images

パスパラメータ

designTemplateId

レスポンス

sourceImageId size thumbnailUrl status

Response { "sourceImages": [ { "sourceImageId": "si_001", // Source Image DB.sourceImageId "size": "A3", // Source Image DB.size "thumbnailUrl": "https://cdn.../dt_001_a3.png", // Source Image DB.thumbnailUrl "status": "active" }, { "sourceImageId": "si_002", "size": "A4", "thumbnailUrl": "https://cdn.../dt_001_a4.png", "status": "active" }, // ... 全7サイズ分 ] }

DB読み取り（Brother側）

Brother Design Template DB

フィールド	用途
designTemplateId	テンプレ識別キー
thumbnailUrl	一覧表示用サムネイル

DB読み取り（Brother側）

Brother Source Image DB

フィールド	用途
sourceImageId	サイズ別画像の識別
size	A3, A4 等のサイズ
thumbnailUrl	サイズ別サムネイル
status	有効/無効フィルタ

Bubble DB書き込み

Bubble デザインテンプレート

フィールド	値の出処
designTemplateId	API: GET /design-templates
thumbnailUrl	API: GET /design-templates
名前	管理者が手入力
開催月	管理者が手入力

Bubble デザインテンプレート画像

フィールド	値の出処
sourceImageId	API: GET /{id}/source-images
size	API: GET /{id}/source-images
thumbnailUrl	API: GET /{id}/source-images

API呼び出しなし

Brother APIは呼び出しません
Bubble DB内で完結します

Bubble DB読み取り（ポップアップ表示用）

Bubble デザインテンプレート

フィールド	用途
designTemplateId	テンプレ識別キー
thumbnailUrl	ポップアップのサムネイル表示

STEP1でBubble DBに保存済みのデザインテンプレート一覧を読み取って、選択ポップアップに表示

Bubble DB書き込み

Bubble 行事テンプレート

フィールド	値の出処
名前	管理者が手入力
業界	管理者が選択
デザインテンプレ × 3	STEP1で登録済みから選択
行事名（デフォルト値）	管理者が手入力
期間（デフォルト値）	管理者が手入力
プログラム（デフォルト値）	管理者が手入力
初期表示フラグ	管理者が設定

API呼び出しなし

Brother APIは呼び出しません

Bubble DB読み取り（テンプレ一覧表示用）

Bubble 行事テンプレート

フィールド	用途
行事名	カード表示
開催月	カード表示
業界 / サブ業種	カード表示
デザインテンプレ × 3	サムネイル表示（thumbnailUrl）

Bubble DB書き込み

Bubble 行事データ

フィールド	値の出処
行事テンプレートID	選択したテンプレート
行事名	テンプレ値 or ユーザー入力
期間	テンプレ値 or ユーザー入力
プログラム	テンプレ値 or ユーザー入力
詳細 / 備考	テンプレ値 or ユーザー入力

API呼び出し ①: 生成リクエスト

17サイズ × 並列にPOST

POST/generated-images

リクエストボディ

sourceImageId eventName period details program notes

レスポンス

generatedImageId sourceImageId status fileKey thumbnailUrl

Request（× 7回並列送信） { "sourceImageId": "si_001", // Bubble DB.デザインテンプレート画像 "eventName": "春季例大祭", // Bubble DB.行事データ "period": "2026年4月20日〜22日", "details": "境内にて...", "program": "10:00 神事...", "notes": "雨天時は..." }

Response（即座に返る / 非同期） { "generatedImageId": "gi_001", // Generated Image DB.generatedImageId "sourceImageId": "si_001", "status": "PENDING", // Generated Image DB.status "fileKey": null, "thumbnailUrl": null }

API呼び出し ②: ポーリング

2完了まで繰り返しGET

GET/generated-images/{generatedImageId}

パスパラメータ

generatedImageId

レスポンス

generatedImageId sourceImageId status fileKey thumbnailUrl

Response（COMPLETED時） { "generatedImageId": "gi_001", "sourceImageId": "si_001", "status": "COMPLETED", "fileKey": "generated/gi_001.png", // → Bubble DBに保存 "thumbnailUrl": "https://cdn.../gi_001_thumb.png" // → Bubble DBに保存 }

Webhook方式の場合はこのポーリングAPIは不要。ブラザーに要確認。

DB読み取り（リクエスト構築用）

Bubble デザインテンプレート画像

sourceImageId

→ リクエストに含める

Bubble 行事データ

行事名	→ eventName
期間	→ period
詳細	→ details
プログラム	→ program
備考	→ notes

Brother DB書き込み

Brother Generated Image DB

generatedImageId	新規発行
sourceImageId	リクエストで直接指定
status	PENDING→RUNNING→COMPLETED
fileKey	生成完了後にセット
thumbnailUrl	生成完了後にセット

Bubble DB書き込み（完了後）

Bubble 生成画像

フィールド	値の出処
generatedImageId	POSTレスポンス
fileKey	GETポーリング完了時
thumbnailUrl	GETポーリング完了時
行事ID	Bubble DB.行事データ
designTemplateId	Bubble DB.デザインテンプレート
designIndex	1, 2, 3（何番目のデザインか）
size	A3, A4 等
status	COMPLETED

API呼び出しなし

Brother APIは呼び出しません

Bubble DB読み取り（画像表示用）

Bubble 生成画像

フィールド	用途
thumbnailUrl	→ img srcに直接セット（公開URL）
generatedImageId	→ 各デザインの識別

Bubble DB書き込み

Bubble 生成画像

フィールド	値の出処
評価	ユーザーの五段階評価

API呼び出し: DL用URL取得

1Bubble DBのfileKeyでURL取得

GET/files/{fileKey}/url

パスパラメータ

fileKey

レスポンス

url expiresAt

Response { "url": "https://storage.example.com/...?token=xxx", // 署名付き一時URL（期限付き） "expiresAt": "2026-04-22T12:00:00Z" } // → この一時URLでブラウザDLを実行

DB読み取り

Bubble 生成画像

fileKey

→ APIパスパラメータに使用

fileKeyは永続識別子。URLは期限付き一時URL。期限切れたら再度 GET /files/{fileKey}/url するだけ

API呼び出し ①: 再生成リクエスト

17サイズ × 並列にPOST

POST/generated-images/{generatedImageId}/regenerate

パスパラメータ

generatedImageId

リクエストボディ

eventName period details program notes

レスポンス

generatedImageId parentGeneratedImageId sourceImageId status fileKey thumbnailUrl

Request（変更後の行事情報） // テンプレ・サイズは元の生成結果から引き継ぐ { "eventName": "春季例大祭", "period": "2026年4月20日〜4月23日", "details": "境内にて...", "program": "10:00 神事.../ 15:00 閉会", "notes": "雨天時は..." }

Response { "generatedImageId": "gi_004", // 新規発行 "parentGeneratedImageId": "gi_001", // 元のID（履歴追跡用） "sourceImageId": "si_001", "status": "PENDING", "fileKey": null, "thumbnailUrl": null }

API呼び出し ②: ポーリング

2STEP4と同じAPIで完了を待つ

GET/generated-images/{generatedImageId}

パスパラメータ

generatedImageId

レスポンス

generatedImageId status fileKey thumbnailUrl

Response（COMPLETED時） { "generatedImageId": "gi_004", "status": "COMPLETED", "fileKey": "generated/gi_004.png", // → Bubble DBを上書き "thumbnailUrl": "https://cdn.../gi_004_thumb.png" // → Bubble DBを上書き }

Webhook方式の場合はこのポーリングAPIは不要。

DB読み取り（リクエスト構築用）

Bubble 生成画像

generatedImageId

→ パスパラメータに使用

Bubble 行事データ

行事名	→ eventName
期間（変更後）	→ period
プログラム（変更後）	→ program
詳細	→ details
備考	→ notes

Bubble DB上書き更新（完了後）

Bubble 生成画像

フィールド	変更内容
generatedImageId	gi_001 → gi_004 に上書き
fileKey	→ 新しい fileKey に上書き
thumbnailUrl	→ 新しい thumbnailUrl に上書き
status	COMPLETED
評価	リセット？要確認

Brother側: Generated Image DBに新レコード（gi_004）が作られ、parentGeneratedImageId=gi_001 で履歴追跡

原稿登録〜ダウンロード フローモック

原稿登録〜ダウンロードフローモック