diff --git a/IDEAS.md b/IDEAS.md index fe08e62..b19f8aa 100644 --- a/IDEAS.md +++ b/IDEAS.md @@ -22,15 +22,74 @@ - 古代: 赤い火の光 + 相対正規化 / 過渡期 / 近現代: 電気光 - 歴史都市データ(Reba et al. 1,577都市、BC3700〜AD1975) -### 移民フローシナリオ (Issue #3 closed) +### 移民フローシナリオ (Issue #3 closed) — ⚠️ 現在は非公表 - 重力モデル + 言語ボーナスによる移民流動 +- **2026-07: UI から非公表化**。世界人口崩壊の NaN バグは修正済みだが、 + フローモデルが不十分——送出条件が「自然増の余剰がある国」のみのため、 + linear シナリオでは 2030-2050 年でアーク0本、以降もほぼウズベキスタン + 1国発に collapse する。エンジンコードは残置、`#migration-btn` を + `display:none` で隠すのみ(`display:none` を外せば復活) +- 再公表するなら「相対的人口圧・経済格差」で送出国を広げる改良が必要 ### i18n - EN/JA 自動切替 - ドキュメントも日英両方 +### 物語モード(8章 + 終章の寓話) +- ✦ボタン / `S`キーで開始。最初の火 → 最初の都市 → 帝国 → 黒死病 → 産業革命 → 大加速 → 波の頂 → 開かれた結末 → 終章「凍った光」 +- 各章でカメラがその舞台(肥沃な三日月地帯、メソポタミア、欧州、英国…)へ飛び、日英ナレーションを表示 +- 第8章は選択中のシナリオに連動。終章は不老シナリオ+機械の光を自動で有効化 +- ← → / Space で章送り、Esc で終了、スライダー操作で自動解除 + +### 不老シナリオ (Ageless) +- 2030年以降、老化が年4%減速 → 死亡率が事故のみの床(0.05%/年 ≈ 実効寿命2000年)へ指数減衰 +- モデル上 出生∝死亡 なので、死が消えると出生も消える → 人口は爆発せず高い場所で凍結 +- 演出: 未来でドットの揺らぎ(uWobble)が2070年までにゼロへ →「凍った光」 +- 年齢色レイヤーも連動し、全球が青紫へ沈む + +### 機械の光レイヤー +- 1ドット = 1GW(想像)。2025年約60GW から12年倍増で2100年約4,500GW +- 配置は人口ではなくエネルギー+冷却: アイスランド、北欧、ケベック、サハラ、アタカマ、ゴビ、ピルバラ等33サイト +- 乱数シードをサイト固定にして、年を進めると光が「増える」(再配置されない) +- 人間の光(暖色・揺らぐ)と機械の光(シアン・揺らがない)の対比 + +### シネマティック描画(美麗化 Phase 1) +- HDR ブルーム(UnrealBloomPass)+ ACES トーンマッピング + OutputPass の正規パイプライン +- 大気の縁光シェーダー「薄い青い線」: 視線の衝突径数 b でシアンのナイフエッジ → 青 → 菫の減衰を計算 +- プロシージャル星空: 一様星 3,200 + 天の川バンド 5,200 + 拡散ヘイズ 700、微細な瞬き付き +- 物語モード最終章「ペイル・ブルー・ドット」: altitude 58 まで6秒のプルバック、終了時に自動帰還 +- 外部CDN依存(jsdelivr の夜空テクスチャ)を排除 + +### 昼と夜モード(美麗化 Phase 2) +- 固定太陽 + 衝突径数ではなく法線内積による昼夜ブレンド。昼 = `blue_marble_day.jpg`、夜 = 夜景ベース +- ターミネーターに暖色帯(夜明け/黄昏) +- 人の灯・機械の光は昼面でフェードアウト——「人の灯は影の中でしか見えない」 +- `C` キー / 表示トグル。デフォルトはオフ(データ可読性優先) + +### 衛星レイヤー(1957〜・史実) +- 1957年スプートニク2基 → 2025年約1.1万基(実数近似)→ 2100年6万基(外挿) +- 低軌道殻(高度6〜12%、傾斜65度以内)に固定シードで事前配置、年はdrawRangeのみ→光が「増える」 +- 殻全体がゆっくり周回(約3.5分/周)。凡例は「● = 衛星n基」で自動スケール + ## 未実装アイデア +### 美麗化 Phase 3(構想 2026-07) +- **都市光の色の歴史**: ナトリウム灯オレンジ(20世紀)→ LED 白青(2010年代〜)の実データ遷移 +- **夜雲の都市グロー**: 大都市上空の雲が下から照らされる ISS 写真の質感 +- **火星の最初の火**: 2080年以降、遠景の赤い球体に3粒の光。第1章の再演を別の惑星で + +### 物語の拡張 +- **「あなたの人生」モード**: 誕生年を入れると、生まれた年→現在→平均余命までをタイムライン上にハイライト。「あなたが生まれたとき世界は◯◯億人、いまは◯◯億人」 +- **章の追加**: 大航海時代とコロンブス交換、アフリカの世紀(21世紀後半の人口重心移動) +- **サウンドスケープ**: 焚き火の爆ぜる音 → 街の喧騒 → 静寂へ、WebAudio で年代に応じて変化 + +### シナリオの拡張(fable5 ブレスト 2026-07) +- **機械の光・継承型**: 人間の光が減衰しながら機械の光が増え、総光量は保たれる——光の意味だけが入れ替わる +- **融合(アップロード)**: 光が消えるのではなく、オレンジ→シアンへ一粒ずつ相転移 +- **気候大移動**: 移民重力モデルに居住可能性の項を追加、光が極へ向かう潮汐 +- **超都市収縮**: 同じ人口で田園が暗転し数百のメガシティだけが燃える +- **軌道への拡散**: 地球儀の外に初めてドットが出る(Globe.GL のカスタムレイヤー) + ### 追加レイヤー - **出生数ドット**: 赤ちゃんが生まれてる場所をドットで打つ。「どこで生命が始まっているか」が直感でわかる - **死亡数との対比**: 出生ドット vs 死亡ドットの色分け diff --git a/README.md b/README.md index 2520306..c1a49c4 100644 --- a/README.md +++ b/README.md @@ -7,9 +7,13 @@ Each dot of light represents 50,000 people. Watch civilizations rise as flickeri ## Features - **12,000-year timeline** — Slide from 10,000 BC to 2100 AD -- **3 future scenarios** — Linear TFR decline / Stable TFR / Soft landing (floor at 0.8) +- **Cinematic rendering** — HDR bloom + ACES tonemapping, a physically-inspired atmospheric limb (the "thin blue line"), and a procedural starfield with the Milky Way +- **Day/Night mode** — a fixed sun paints a terminator across the globe: Blue Marble by day, human light only in shadow, a warm band at dawn and dusk (`Day/Night` toggle or `C` key) +- **Satellite layer (1957–)** — with Sputnik, a light leaves the ground for the first time: a slowly orbiting LEO shell that swells in the megaconstellation era (approximate real counts, extrapolated beyond 2025) +- **Story mode** — a guided fable from the first fires to 2100, with camera flights to each chapter's stage (✦ button or `S` key). Chapter 8 changes with the scenario you choose; the epilogue "The Frozen Light" switches on the Ageless scenario and the machine light; the finale pulls back until Earth is a pale dot among the stars +- **4 future scenarios** — Linear TFR decline / Stable TFR / Soft landing (floor at 0.8) / Ageless (after 2030 death fades toward accidents-only — and births, tied to deaths in this model, fade with it; the lights stop flickering and freeze) +- **Machine light layer** — a speculative second layer of cold cyan dots (1 dot = 1 GW) growing where energy and cooling are cheap — Iceland, the Sahara, the Gobi, Atacama — instead of along the rivers and coasts that human light has followed for millennia - **Age structure coloring** — Toggle to see aging populations shift from orange to blue-purple -- **Migration flow arcs** — Gravity model with GDP attraction and language bonuses (2024+) - **Bilingual** — English / Japanese (auto-detected, switchable) ## Live Demo @@ -71,9 +75,13 @@ Full references: [`docs/methodology/data-sources.md`](docs/methodology/data-sour ## 機能 - **1万2千年のタイムライン** — 紀元前1万年〜西暦2100年をスライダーで操作 -- **3つの未来シナリオ** — 出生率の線形低下 / 固定 / 緩やかな着地(下限0.8) +- **シネマティック描画** — HDRブルーム + ACESトーンマッピング、物理着想の大気の縁光「薄い青い線」、天の川入りプロシージャル星空 +- **昼と夜モード** — 固定太陽がターミネーター(昼夜境界)を描く。昼はブルーマーブル、人の灯は影の中でのみ点り、夜明けと黄昏には暖色の帯(`昼と夜`トグル / `C`キー) +- **衛星レイヤー(1957〜)** — スプートニクとともに、人類の光がはじめて地面を離れる。ゆっくり周回する低軌道の殻が、メガコンステレーション時代に膨れ上がる(実数の近似、2025年以降は外挿) +- **物語モード** — 最初の焚き火から2100年までのガイド付き寓話。各章の舞台へカメラが移動(✦ボタン / `S`キー)。第8章は選択中のシナリオで結末が変わり、終章「凍った光」では不老シナリオと機械の光が灯り、最終章では地球が星々のあいだの一粒の光になるまでカメラが引く +- **4つの未来シナリオ** — 出生率の線形低下 / 固定 / 緩やかな着地(下限0.8)/ 不老(2030年以降、死が事故のみに近づく。このモデルでは出生は死亡に比例するため、出生もともに薄れ、光は揺らぎを止めて凍る) +- **機械の光レイヤー** — 冷たいシアンの第2レイヤー(1ドット = 1GW・想像)。人類の光が数千年寄り添ってきた川と海岸ではなく、エネルギーと冷却の安い場所——アイスランド、サハラ、ゴビ、アタカマ——に育つ - **年齢構成の色分け** — 高齢化する社会がオレンジ→青紫に変化 -- **移民フロー** — GDP引力+言語ボーナスの重力モデル(2024年以降) - **日英対応** — ブラウザ言語で自動切替、手動切替も可能 ## ローカル実行 diff --git a/index.html b/index.html index 405ad84..84bb403 100644 --- a/index.html +++ b/index.html @@ -71,6 +71,37 @@ .settings-group { display: flex; align-items: center; gap: 8px; } .settings-label { font-size: 0.65rem; opacity: 0.4; min-width: 55px; text-align: right; } + .story-card { + position: fixed; bottom: 96px; left: 50%; transform: translateX(-50%); + z-index: 20; width: min(560px, calc(100vw - 32px)); + background: rgba(0,0,0,0.55); backdrop-filter: blur(12px); + border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; + padding: 18px 22px 14px; box-sizing: border-box; + opacity: 0; pointer-events: none; transition: opacity 0.5s; + } + .story-card.visible { opacity: 1; pointer-events: auto; } + .story-inner { transition: opacity 0.35s; } + .story-chapter { font-size: 0.6rem; letter-spacing: 0.25em; text-transform: uppercase; opacity: 0.35; } + .story-title { font-size: 1.05rem; font-weight: 300; letter-spacing: 0.12em; margin: 6px 0 8px; } + .story-text { font-size: 0.82rem; font-weight: 300; line-height: 1.75; opacity: 0.85; } + .story-nav { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; } + .story-nav-btn { + background: none; border: 1px solid rgba(255,255,255,0.25); color: #fff; + border-radius: 16px; padding: 4px 16px; font-size: 0.72rem; cursor: pointer; + } + .story-nav-btn:hover { border-color: rgba(255,255,255,0.7); } + .story-nav-btn:disabled { opacity: 0.25; cursor: default; } + .story-progress { display: flex; gap: 6px; } + .story-progress span { + width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,0.25); + } + .story-progress span.active { background: rgba(255,255,255,0.9); } + .story-close { + position: absolute; top: 6px; right: 10px; background: none; border: none; + color: rgba(255,255,255,0.4); font-size: 1rem; cursor: pointer; padding: 4px; + } + .story-close:hover { color: #fff; } + .loading { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: #000; z-index: 100; transition: opacity 0.5s; @@ -98,6 +129,10 @@ } .scenario-btn::after { display: none; } + + .story-card { bottom: 84px; padding: 14px 16px 12px; } + .story-title { font-size: 0.95rem; } + .story-text { font-size: 0.78rem; line-height: 1.65; } } /* ── Small mobile (<400px) ── */ @@ -126,6 +161,7 @@