琴平デジタル町民
← デモ入口
🗺 機能別 画面遷移ガイド（社内向け）

琴平デジタル町民 — 全機能フロー

各機能で「どの画面→どのAPIを経由→何が起きるか」を開発チーム向けにまとめています。
URL付きの画面名は実際のページへリンクしています。

町民登録（オンボーディング）

KOTO_3

観光パンフのQR・LINE公式アカウント経由で新規登録。全4ステップ、完了で100pt付与。

一般ユーザー（新規）
  1. 1
    観光パンフ / ポスター（QRコード）印刷物・画面掲示

    パンフレットや店頭ポスターのQRをLINEで読み取る

  2. 2
    LINE 友だち追加画面

    「琴平デジタル町民」公式アカウントを友だち追加

    webhook: follow event → ウェルカムFlex自動配信

  3. 3
    LINE チャット（ウェルカムFlex）同意ページ

    ウェルカムメッセージの「町民になる」ボタン → 利用規約・プライバシーに同意

    POST /api/c/kotohira/consent

  4. 4
    町民登録フォーム

    氏名・住所・生年月日（全必須）を入力して送信

    POST /api/c/kotohira/onboarding/complete

  5. 5
    ウェルカム完了画面マイページ（会員証）

    登録完了 → 町民証発行 + 100pt 自動付与

関連:実際のオンボーディング同意画面 →登録フォーム →2スマホ並列デモで体験 →

マイページ（会員証・残高・履歴）

KOTO_4

町民証QR、ポイント残高、取引履歴、プロフィール設定を1ページで確認。

町民プレミアム会員
  1. 1
    LINEリッチメニュー「マイページ」タブ

    リッチメニュー下部の「マイページ」ボタンをタップ

  2. 2
    マイページ

    会員証QR・ポイント残高・最近の取引一覧が表示される

    GET /api/c/kotohira/viewer

  3. 3
    取引詳細/c/kotohira/mypage/history/[id]通知設定

    各取引の詳細や通知設定にアクセス可能

関連:マイページ（本番） →デモ版マイページ →

イベント参加・チェックイン

KOTO_5

イベント一覧の閲覧から申込み、当日のQRチェックインとポイント付与まで。

町民プレミアム会員
  1. 1
    LINEリッチメニュー「イベント」タブイベント一覧

    リッチメニューまたはURLからイベント一覧を開く（本番DBの実データ）

  2. 2
    イベント詳細/c/kotohira/events/[id]

    詳細ページで日時・場所・参加条件を確認

  3. 3
    参加登録ページ/events/[id]/register

    「参加する」ボタンから参加申込み（アンケートがある場合は回答）

    POST /api/events/[id]/register

  4. 4
    チェックイン画面/events/[id]/checkin

    当日QRを受付スタッフにスキャンしてもらうか、URL直接アクセスでチェックイン

    POST /api/events/[id]/checkin

  5. 5
    ポイント付与完了通知（LINE）

    チェックイン完了後、設定ポイントが自動付与されLINEで通知

関連:イベント一覧（本番） →チェックインデモ →2スマホ並列デモ →

加盟店・クーポン利用

KOTO_7

お店一覧から加盟店を探し、クーポンを取得・提示して使う。マップ表示対応。

町民プレミアム会員ゲスト（閲覧のみ）
  1. 1
    LINEリッチメニュー「お店・イベント」タブ加盟店一覧

    リッチメニューまたはURLから加盟店一覧を開く

  2. 2
    加盟店詳細/c/kotohira/places/[id]

    店舗詳細ページで営業情報・クーポン・地図を確認

  3. 3
    クーポン表示（加盟店詳細内）

    「クーポンを使う」ボタンでバーコード/QRが表示されレジで提示

    POST /api/c/kotohira/coupon/use

  4. 4
    利用完了通知（LINE）

    クーポン利用済みマーク + 次回用メッセージが届く

関連:加盟店一覧（本番） →加盟店マップ →デモ版ショップ →

P2P ポイント送金

KOTO_10

町民どうしでポイントを送り合う。相手のマイページQRを読み取って4ステップで完了。

町民プレミアム会員
  1. 1
    LINEリッチメニュー「特典・町民証」タブ

    リッチメニューの「ポイントを送る」からアクセス

  2. 2
    P2P送金ページ

    受取人QRをカメラでスキャン（または手動ID入力）

  3. 3
    送金確認画面（/c/kotohira/send）

    送金額・相手を確認して送信

    POST /api/points/transfer

  4. 4
    送金完了画面受取人に LINE 通知

    双方にポイント増減が即時反映、LINEで通知

関連:P2P送金ページ（本番） →2スマホ並列デモ →

プレミアム会員購入

KOTO_11

Stripe決済でプレミアム会員になる。Webhook経由でリッチメニューが即時切替わる。

町民
  1. 1
    プレミアム紹介ページ

    プレミアム特典一覧を確認

  2. 2
    プレミアム購入（Stripe）

    Stripe Checkout でカード決済

    POST /api/stripe/checkout

  3. 3
    購入完了画面

    Stripe webhook → 会員ステータス更新

    POST /api/webhooks/stripe → User.kotohiraMetadata.tier = 'premium'

  4. 4
    LINEリッチメニュー 👑 premium 切替

    LINE リッチメニューがプレミアム用9面に自動切替

    LINE Messaging API: richmenu link

関連:プレミアム紹介（本番） →プレミアム購入デモ →特典一覧 →

ポイントギフト受領（未会員 → 登録）

既会員がギフトURLを発行 → 未会員がリンクを踏むと登録しながらポイントを受け取れる。旧サービスからの移行案内にも使用。

既会員（贈り主）未会員（受取人）
  1. 1
    ギフト発行ページ

    贈り主：金額を入力して発行 → URL/QR/LINEシェア

    POST /api/c/kotohira/gift/issue

  2. 2
    ギフト受領ページ（公開）/c/kotohira/gift/[code]

    受取人：リンクを踏むと「○○さんから XXpt が届いています」表示

  3. 3
    LINE OAuth 認可画面

    「LINEで登録して受け取る」→ LINE ログイン開始

    GET /api/auth/gift-signin?code=... → pendingClaimCode cookie

  4. 4
    同意ページ

    町民登録の同意（TOS/成人確認/DID/LINE）

    POST /api/c/kotohira/onboarding/complete（Phase1: 同意）

  5. 5
    ギフト受領完了/c/kotohira/gift/[code]/done

    ポイント受取完了 + 町民登録完了

    POST /api/c/kotohira/onboarding/complete（Phase2: claim）

関連:ギフト受領デモ →forcommunity救済ページ →

加盟店オーナー管理画面

KOTO_14

オーナーが店舗情報・クーポン・売上を管理する画面。チェックイン記録・スキャン履歴も確認可能。

加盟店オーナー
  1. 1
    LINEリッチメニュー「お店オーナー」

    オーナー専用リッチメニューからアクセス

  2. 2
    加盟店管理画面

    店舗情報・クーポン管理・日次売上・スキャン履歴を確認

  3. 3
    クーポン発行フロー（管理画面内）

    新規クーポン作成 → 有効期限・割引率設定 → 公開

    POST /api/c/kotohira/coupons

  4. 4
    チェックインスキャン画面

    イベント当日に来場者QRをスキャン（スタッフ操作）

    POST /api/events/[id]/checkin

関連:加盟店管理デモ →2スマホ並列デモ（クーポン） →

町長選挙・投票

KOTO_13

候補者一覧から1名を選んで投票。町民のみ参加可能。1アカウント1票。

町民プレミアム会員
  1. 1
    LINEリッチメニュー「体験・アクセス」タブ

    リッチメニューの「選挙」からアクセス

  2. 2
    選挙ページ

    候補者一覧・公約・現在の投票数を確認

  3. 3
    投票確認ダイアログ（選挙ページ内）

    候補者を選択して「投票する」→ 確認ダイアログ

    POST /api/c/kotohira/election/vote

  4. 4
    投票完了（選挙ページ）

    投票済みバッジ表示 + リアルタイム得票数更新

関連:選挙ページ（本番） →選挙デモ →

LINEリッチメニュー（自動切替）

KOTO_2

会員状態（ゲスト／町民／プレミアム）に応じて9面リッチメニューが自動で切り替わる仕組み。

全ユーザー
  1. 1
    友だち追加 or LINEログイン

    友だち追加 / ログイン時にサーバーが会員状態を評価

    webhook: follow / LINE OAuth callback

  2. 2
    ゲスト用リッチメニュー（3面）ホーム・お店・マイページ

    非登録ユーザーにはゲスト用メニューを適用

    LINE Messaging API: richmenu link（guest_benefit）

  3. 3
    町民用リッチメニュー（9面）特典・町民証 / お店・イベント / 体験・アクセス

    町民登録完了時に自動切替

    LINE Messaging API: richmenu link（citizen）

  4. 4
    プレミアム用リッチメニュー（9面）プレミアム特典強調

    Stripe購入完了後に自動切替

    LINE Messaging API: richmenu link（premium）

関連:リッチメニュー9面を確認 →会員ステータス Matrix →

スポットワーク（地域版タイミー）

KOTO_15

地域内の単発仕事をマッチング。応募→採用通知→就業確認まで。決済は当事者間。

町民（求職）お店オーナー（求人）
  1. 1
    LINEリッチメニュー「体験・アクセス」

    「スポットワーク」ボタンからアクセス

  2. 2
    スポットワーク一覧（デモ）

    募集中の仕事一覧を確認（日時・時給・場所）

  3. 3
    応募確認画面

    「応募する」ボタンで即時応募 → オーナーに通知

    POST /api/c/kotohira/spotwork/apply

  4. 4
    採用通知（LINE）

    オーナーが承認するとLINEで採用通知が届く

関連:スポットワークデモ →

町内移動（mobi配車・バス・タクシー）

KOTO_9

mobi配車・路線バス・タクシーの3モードを統合した移動ハブ。APIスコープ確認中。

町民プレミアム会員ゲスト
  1. 1
    LINEリッチメニュー「体験・アクセス」

    「移動」タブからアクセス

  2. 2
    モビリティ選択画面

    mobi配車 / バス / タクシー / 自転車から選択

  3. 3
    外部サービスへ遷移（mobi等）

    各移動手段の外部アプリ・サービスへ誘導

    mobi API 連携（確認中）

関連:モビリティデモ →

関連ページ

📺 2スマホ並列デモ📋 WBS・進捗ダッシュボード🔀 流入8パターン総覧🪪 会員ステータス Matrix🛡 ロール・権限体系🎯 デモ入口