リベシティ 3D俯瞰・散策デモ v3.0
施設への接近案内・キーボード見回し・立ち話の吹き出し

■ 開くファイル
libecity-3d.html

ZIPを展開して、上記のHTMLをChromeまたはEdgeで開いてください。
チャットからHTML単体を保存した場合の名称は libecity-3d-v3.html です。
追加のインストールやサーバー起動は不要です。
添付のプレビューではなく、保存したHTMLをブラウザで開いてください。
街の描画や会話の表示には通信を使いません。公式ページを開くときは通信が必要です。

■ v3で変更したこと

1. 近づいた施設に案内が切り替わる
散策中に施設の入口へ近づくと、対応する施設の案内を表示します。
別の施設の紹介パネルが開いていても、近づいた施設の名称・説明・公式リンクに
自動で切り替わります。「この施設の入口」の表示が目印です。
紹介を閉じている場合は、小さな入口カードを表示します。
その「施設の紹介も読む」を押すと、説明のあるパネルに切り替わります。
同じ案内を二重表示せず、開いている状態に合わせてひとつのカードを使います。
パネルを閉じても、入口の近くなら小さなカードは引き続き使えます。

カメラの位置や向きは、案内の切り替えでは変更しません。
表示境界を少し前後しても点滅しにくいよう、入る距離と離れる距離を分けています。
壁の向こうの入口では反応しないようにしています。
その場で別の施設を手動選択したときは紹介を読めます。歩き出すと周囲の案内に戻ります。
ガイド・施設一覧を開いている間は、背後の接近案内や会話表示を止めます。

2. Shift＋方向キーで、その場で上下左右を見る
W・A・S・D／矢印キー：前後・左右への移動
Shift＋←／→、またはShift＋A／D：その場で左・右を向く
Shift＋↑／↓、またはShift＋W／S：その場で上・下を向く

Shiftを押している間は位置を固定し、移動せず視線だけを変えます。
この版ではShiftによる早歩きは行いません。通常の移動速度は同じです。
上下を向きすぎて視点が反転しないよう、角度に上限を設けています。
画面のドラッグによる見回しも、引き続き使えます。

3. 立ち止まっている2人に近づくと会話が始まる
9施設・スポットそれぞれの前に、2人で立ち話をするキャラクターを配置しました。
近づくと、その施設に関連するセリフを吹き出しで交互に表示します。
施設ごとに4つのセリフを用意しています。

話者に対応する線で、吹き出しと人物をつないでいます。
通常は数秒ごとに進み、Spaceキーまたは「次へ」でも次のセリフに進めます。
離れると閉じます。建物の壁越しには会話を始めません。
小さい画面では、読みやすさのため現在の話者の吹き出しをひとつずつ表示します。
人物が左右の画面外にいる場合は、その方向を表示することがあります。
人物が後ろにいる場合は、案内を参考に見回してください。
街の一時停止中は会話も自動で進まず、Spaceや「次へ」で読むことができます。
「？」内の「立ち話の演出」で表示を切り替えられます。
音声は流れません。

重要：セリフは、公式のサービス紹介を参考に作ったデモ用の架空の会話です。
実際の会員の発言・体験談・チャット履歴ではありません。
実在の会員のデータを取得する機能や、オンラインで会話する機能はありません。

■ 操作早見
俯瞰：ドラッグで回転、ホイールで拡大・縮小。
      右ドラッグ／Shift＋ドラッグで平行移動。
      タッチは1本指で回転、2本指で拡大・平行移動。
おまかせ：9つの場所を巡回します。
散策：W・A・S・D／矢印で移動。Shift＋方向キーまたはドラッグで見回します。
      スマホは左下のスティックで移動します。
E：現在の入口案内の公式紹介ページを、新しいタブで開きます。
Space：近くの立ち話の次のセリフへ。ボタンにキーボードフォーカスがある場合は
       通常のボタン操作が優先されます。3D画面にフォーカスを戻すと使用できます。
Esc：散策・おまかせから俯瞰へ。ガイド・施設一覧が開いている場合は先に閉じます。
右上の地図アイコン：施設一覧を開きます。
昼・夕・夜：右上の時間帯ボタンで切り替えます。
一時停止：下部のボタンで街の演出を止めます。カメラは引き続き操作できます。

■ 公式の名称・リンク
v2の9つの公式名称と紹介ページへのリンクを引き継いでいます。
一覧は official-content-links.json に収録しています。
公式紹介ページとサービス本体のページは異なります。
本体の利用には、公式ページから移動したりログインしたりする必要がある場合があります。
ページを開くのはリンクのクリック、または入口案内が表示中のEキーによる明示操作のみです。
歩いたり、会話を読んだりするだけでは外部サイトへ移動しません。

■ 収録内容
libecity-3d.html                  操作できる単体HTML
libecity-town-v3.glb              新しい人物配置を含む静止3Dモデル
source/app.js                    3Dの形状・動き・操作・施設情報・会話データ
source/shell.html                操作画面・スタイル
source/build.py                  単体HTMLの再生成
conversation-scripts.json        会話の確認用一覧と参照元
                                    ※編集はapp.js内のCHAT_DEFINITIONSが正本です。
official-content-links.json      施設名と公式紹介ページの一覧
verification/test-report-v3.json 状態・機能の検査結果
verification/live-report-v3.json 実際に描画しながら操作した検査結果
verification/test_v3.py          状態・機能テスト用コード
verification/live_checks.py      実操作・画面確認用コード

ソースを編集した場合は「python source/build.py」でHTMLを再生成できます。
通常の閲覧にPythonは必要ありません。
検査用コードは開発用です。PlaywrightとChromiumを用意した検査環境で使用しています。
GLBは静止モデルであり、操作UI・吹き出し・アニメーション・ページ遷移を含みません。
動かして使うときは必ずHTMLを開いてください。

■ 検証結果
状態・機能テスト99項目、実際のブラウザ操作20項目を通過しました。
主な確認は、別施設の紹介を開いたまま歩いてオフィスへ近づくケース、
9施設の入口案内、名称・リンクの一致、Shiftの上下左右と位置固定、
Shiftを離した後の移動、Eキー、会話の接近・自動送り・手動送り・一時停止、
モーダル中の制御、離れたときの非表示、俯瞰・巡回の維持です。
画面幅1440・390・360・320pxと844×390pxの横長表示を確認しました。
今回の検査ではJavaScript例外・自動的な外部リクエストはともに0件でした。

状態・機能の検査は、テスト用ブラウザのコピーに限って描画ループを止め、
同じイベント処理・状態更新処理を一定時間刻みで呼び出しています。
配布するHTMLにはこのテスト用の操作口を含めていません。
別途、変更していない配布用HTMLを実際に描画し、キーボード操作と画面表示を確認しました。

検査環境の制限：
・ブラウザの管理ポリシーでfile:による移動が禁止されているため、HTMLの内容を
  ブラウザへ直接読み込んで検査しています。保存HTMLのfile:起動はこの環境では未検証です。
・検査ブラウザはCanvas 3D互換表示を使用しています。
  実機PC・実機スマホのGPU表示と動作速度は未検証です。
・公式リンク先の表示完了までは、この版の操作検査では確認していません。
  リンク先URL、安全な新規タブ指定、明示操作でのリンク発火を検査しています。

■ 位置づけと参照
公式のコンテンツを街に見立てた非公式のコンセプトデモです。
実際の施設や地理配置、会員の活動状況を再現したものではありません。
室内には入れません。形状・人物・配置は独自の表現です。
外部公開、会員データ取得、予約・申し込み・購入は行っていません。

今回の会話作成時に参照した公式ページ（2026年9月7日）：
https://site.libecity.com/content-list
https://site.libecity.com/content/school-list
https://site.libecity.com/content/office
https://site.libecity.com/content/library
各施設とセリフの対応はconversation-scripts.jsonに記載しています。
サイトの内容が変わった場合は公式ページの最新の案内を優先してください。
