鈴木さん向け設計図
🐾 コヌシと一緒に、素敵なサービスを作りましょう 🚪
鈴木さま
お世話になっております、中嶋です。
Tobiraアプリの完全版設計図をお送りいたします。
すべてを一度に完璧に作る必要はありません。
以下の3段階で進めていただければと思います。
基本機能の実装。ARはシンプルな画像切り替えでOK。
まずはローンチを目指します。
アニメーションの滑らかさ向上、細かい演出の追加。
受信コード機能なども追加します。
ARKit/ARCoreを使った本格AR。
紙の上にコヌシが立体的に表示されます。
まずはPhase 1で動くものを作りましょう。
前回までのやり取りから、以下の点を変更しました。
鈴木さんが「あれ、ここ変わってた?」と混乱しないよう、
すべての変更点をBefore/Afterで明示します。
・ライトプラン(3ページセット)
・3ページセット、5ページセット等
・複数のパッケージプラン
・Standardプラン1択
・1ページ単位で1〜10ページ自由選択
・¥500/ページ
理由: 「3ページセット」などは一般のお客様に分かりにくいため、1ページ単位のシンプルな価格体系に統一しました。
・全プラン同時実装予定
・アプリ上では「Coming Soon」表示
・タップでLINE登録案内モーダル
・ローンチはStandardのみ
理由: アルバム仕様未確定のため、まずはStandardのみでローンチします。
・透過PNG
・iOS起動時に青色になる問題発生
・白背景(透過なし)
・1024 × 1024 ピクセル
・PNG形式
理由: iOSが透過部分を青色化するため、白背景に変更します。
・細めのサンセリフ体
・クラシックなセリフ体
(Cormorant Garamond Bold等)
・重みと品のある書体
理由: よりブランドらしい上品な印象に変更します。
・アプリ内に搭載予定
・今回のアプリには非搭載
・HPやBASE等で別途展開
理由: アプリの方向性を統一するため、3Dは別チャネルで展開します。
・ZIPファイル方式
・共有URL方式(LINEで送信用)
・共有QRコード方式(印刷物用)
・両方対応
・Phase 2で受信コード(ABCD-1234)追加
理由: 一般のお客様にとって「ZIP」が分かりにくいため、URL/QR方式に変更しました。
・クラウド前提
・お客様のスマホ内(ローカル)が基本
・共有時のみ一時的にクラウド保管
・ダウンロード完了で自動削除
理由: お客様のプライバシー優先、サーバーコスト最小化のため。
・概念のみ存在
・キャラデザイン確定
・全ポーズ画像準備済み
・アニメーション動作指示書あり
・効果音準備済み
理由: ブランドキャラクターとして確立しました。
Tobiraは、紙のフォトアルバムに動画と写真を紐付け、
スマホでかざすと動画が再生される「魔法のアルバム」サービスです。
| ページ数 | 価格 | 配送オプション |
|---|---|---|
| 1ページ | ¥500 | データのみ無料 / 印刷+¥800 |
| 3ページ | ¥1,500 | データのみ無料 / 印刷+¥800 |
| 5ページ | ¥2,500 | ★印刷&発送 無料 |
| 10ページ | ¥5,000 | ★印刷&発送 無料 |
| オプション | 説明 |
|---|---|
| データのみ | 無料・即時配信(PDFダウンロード) |
| 印刷&発送 | 1〜3ページ +¥800 / 5ページ以上無料 |
これらはアプリ内で「Coming Soon」として表示し、タップでLINE登録誘導します。
| カテゴリ | 機能 | 優先度 |
|---|---|---|
| 認証 | 不要(Stripeで住所自動取得) | Phase 1 |
| アルバム作成 | テンプレート選択、写真・動画選択、メッセージ | Phase 1 |
| 決済 | Stripe Checkout(3パターン) | Phase 1 |
| マイアルバム | 一覧、編集、削除 | Phase 1 |
| AR再生 | QR読み取り、コヌシ表示(2D)、動画再生 | Phase 1 |
| 共有機能 | URL/QRで友達に動画を渡す | Phase 1 |
| 動画差し替え | アプリ内でいつでも変更可能 | Phase 1 |
| ヘルプ | ?ボタン、LINE問い合わせ | Phase 1 |
| Coming Soon | Premium等を「準備中」表示 | Phase 1 |
| 受信コード | 8文字コードで受け取り | Phase 2 |
| 多言語 | 5言語完全対応 | Phase 2 |
| 完全AR | ARKit/ARCore実装 | Phase 3 |
Tobiraアプリは全20画面で構成されます。
画面イメージは別途お送りする画像ファイルをご参照ください。
| # | 画面名 | 機能 |
|---|---|---|
| 01 | ホーム画面 | マイアルバム一覧 + 新規作成ボタン |
| 02 | どちらから始めますか? | 自分のスマホ / 共有受信の分岐 |
| 03 | 写真選択画面 | スマホから写真を選ぶ |
| 04 | 動画選択画面 | スマホから動画を選ぶ(最大5分) |
| 05 | メッセージ入力 | タイトル・メッセージ(任意) |
| 06 | テンプレート選択 | 8種類から選ぶ |
| 07 | プレビュー画面 | 完成イメージの確認 |
| 08 | 料金確認・配送選択 | データのみ / 印刷&発送の選択 |
| 09 | 決済画面 | Stripe Checkoutへ遷移 |
| 10 | 注文完了画面 | 注文番号表示、コヌシ初登場 |
| 11 | 共有受信画面 | URL / QR の選択 |
| 12 | 共有QRスキャン | 共有QRをカメラで読む |
| 13 | アルバムQRスキャン | 紙のアルバムQRを読む |
| 14 | ダウンロード中 | コヌシが待ってくれる |
| 15 | 紐付け完了 | 「今すぐ見る」CTA |
| 16 | アルバム詳細 | AR再生、共有、編集 |
| 17 | AR再生画面 | コヌシ登場、動画再生 |
| 18 | 共有方法選択 | URL生成 / QR生成の選択 |
| 19 | 設定画面 | 言語、音声、ヘルプ等 |
| 20 | ヘルプ画面 | ?ボタン、コヌシ解説 |
主要画面の詳細設計を記載します。
全画面の詳細は、別添の画面イメージ画像と合わせてご確認ください。
目的: アプリ起動後のメイン画面。マイアルバム一覧と新規作成ボタン。
レイアウト:
機能:
目的: 2つの入口を提示(自分用 / 共有受信)。
レイアウト:
機能:
目的: アルバムにかざしたQR/写真を認識し、コヌシのアニメーションと動画再生を行う。
レイアウト:
動作の流れ:
※詳細は 「11. アニメーション動作指示」 参照
※ 他17画面の詳細は、別添画像ファイルと同じテンプレートで記述します。
本ドキュメントでは紙幅の都合上、主要画面のみ記載しています。
全画面の細かい仕様は、添付の画面イメージ画像と各セクション(8-15)をあわせて確認してください。
| 項目 | 仕様 |
|---|---|
| 最大長さ | 5分(300秒) |
| 最大ファイルサイズ | 100MB |
| 形式 | MP4 |
| 向き | 縦・横どちらもOK |
| 必須 | 動画なしでは作成不可 |
| 項目 | 仕様 |
|---|---|
| 最大サイズ | 20MB |
| 形式 | JPG / PNG |
| 枚数 | 1ページに1枚 |
| 必須 | 写真なしでは作成不可 |
Tobiraの世界の番人。小さくてふわふわの白い猫風の生物。
ちょっとめんどくさそうな性格が魅力。
| 項目 | 仕様 |
|---|---|
| 体型 | 小さく、ふわふわの白い毛 |
| 目 | 眠そうな半目 |
| 鼻 | ピンクの小さな鼻 |
| 足元 | グレーのブーツ |
| 洋服 | なし(自然な毛並みのみ) |
| ネックレス | なし(鍵は首にかけない) |
| 鍵の扱い | 引きずる or 足元に転がす |
| 性格 | めんどくさそう、眠そう |
※詳細は別添 tobira_animation_spec.txt をご参照ください。
| シーン | 時間 | 内容 | 効果音 |
|---|---|---|---|
| 1 | 0-2秒 | 待機・QR認識 | ピン |
| 2 | 2-5秒 | コヌシ登場・歩く | ぺたぺた |
| 3 | 5-8秒 | ドア前であくび | ふぁ〜 |
| 4 | 8-10秒 | 鍵を拾う | シャラン |
| 5 | 10-12秒 | 鍵を回す | カチャッ |
| 6 | 12-15秒 | ドアが開く | キィー |
| 7 | 15-17秒 | 動画拡大 | シャラララ |
| 8 | 17秒〜 | 動画再生中 | 動画音 |
| 9 | END | 動画終了 | - |
| 10 | END+1秒 | コヌシ立ち上がり | ふぁ〜 |
| 11 | END+3秒 | ドアを閉める | ガチャッ |
| 12 | END+5秒 | コヌシ退場 | ぺたぺた |
| ファイル名 | 用途 |
|---|---|
| konushi_footsteps.mp3 | 歩く足音(ループ) |
| konushi_yawn.mp3 | あくび |
| key_pickup.mp3 | 鍵を拾う |
| key_insert.mp3 | 鍵を差し込む |
| key_turn.mp3 | 鍵を回す |
| door_open.mp3 | ドアを開ける |
| door_close.mp3 | ドアを閉める |
| magical_glow.mp3 | 魔法的な光 |
※詳細は tobira_stripe_spec_v3_final.txt をご参照ください。
Stripe Checkout(ホスト型)
| パターン | 金額 | 送料 |
|---|---|---|
| データのみ | ¥500/ページ | 無料 |
| 印刷&発送(1-3P) | ¥500/ページ + ¥800 | +¥800 |
| 印刷&発送(5-10P) | ¥500/ページ | 無料 |
TOBIRA ALBUM
| # | 名前 | テーマ |
|---|---|---|
| 01 | Signature Pink | 桜・ピンク |
| 02 | Memory Light | 朝の光・ベージュ |
| 03 | Night Memory | 夜空・ネイビー |
| 04 | Ocean Dream | 海・水彩 |
| 05 | Botanical | 植物・セージ |
| 06 | Classic Frame | ゴールド額縁 |
| 07 | Minimal Arch | モダン |
| 08 | Pet Warm | ペット・クリーム |
Premium / Bridal / Pet プランをタップした時
┌──────────────────────────────┐ │ [✕] │ │ │ │ [konushi_yawning画像] │ │ │ │ コヌシ「準備中だよ...」 │ │ │ │ Premium Plan は │ │ 現在準備中 │ │ │ │ リリース時にLINEで │ │ お知らせします │ │ │ │ [LINEで通知を受け取る] │ │ [また今度] │ └──────────────────────────────┘
konushi_yawning_standing.png
https://lin.ee/RciJwfc
LINEに飛ばす: @258adwsx
| 名前 | HEX | 用途 |
|---|---|---|
| ネイビー | #1A2B4A | メインカラー・文字 |
| ウォームゴールド | #C9A66B | アクセント・装飾 |
| ライトゴールド | #E8B86F | 暗背景での文字 |
| クリーム | #FBF8F0 | 背景 |
| ダークブラウン | #5C4A3A | サブテキスト |
| ピュアホワイト | #FFFFFF | カード背景 |
| 用途 | フォント |
|---|---|
| 日本語UI | Hiragino Sans, Yu Gothic |
| 英語UI | SF Pro, Helvetica Neue |
| Tobiraロゴ | Cormorant Garamond Bold(クラシックセリフ) |
| 用途 | 使うロゴ |
|---|---|
| アプリアイコン | 白背景・1024×1024・透過なし |
| アプリ内ヘッダー | マスターロゴ(透過・横長) |
| テンプレート上部 | 「Tobira」文字のみ(イタリック) |
| HP・LINE | マスターロゴ |
📁 logo/ ├ tobira_master_logo.png(マスター) ├ tobira_app_icon.png(アプリアイコン用・白背景) └ tobira_header_logo.png(アプリ内ヘッダー用・透過) 📁 templates/(8枚・透過処理済み) ├ template_01_signature_pink.png ├ template_02_memory_light.png ├ template_03_night_memory.png ├ template_04_ocean_dream.png ├ template_05_botanical.png ├ template_06_classic_frame.png ├ template_07_minimal_arch.png └ template_08_pet_warm.png 📁 konushi/(マスコット・全ポーズ) ├ konushi_walking_left.png ├ konushi_walking_right.png ├ konushi_yawning_standing.png ├ konushi_sitting_watching.png ├ konushi_picking_key.png ├ konushi_turning_key.png └ konushi_stretching.png 📁 doors/(ドア4状態) ├ door_01_closed.png ├ door_02_key_inserted.png ├ door_03_slightly_open.png └ door_04_fully_open.png 📁 effects/(エフェクト) ├ sparkles.png └ glow_halo.png 📁 sounds/(効果音・全種類) 📁 screens/(画面イメージ・全20枚) └ app_screen_01_home.png 〜 app_screen_20_help.png
目標: 動くものをまず作る
※詳細は tobira_roadmap.txt をご参照ください。
中嶋(Tobira運営)
長くなりましたが、よろしくお願いいたします。
コヌシと一緒に、素敵なTobiraを作りましょう 🚪🐾
中嶋
2026年5月26日