センスラボ - 視力・色覚・聴力セルフチェックツール

【目的・ターゲット】スマホやPC作業で目や耳を酷使する全世代向けに、病院に行く前の“気づき”を与えるセルフチェックツール。医療行為の代替ではなく、傾向把握とコンディション管理が目的であることをトップに明記する。

【主要機能】
1. 視力チェック：画面からの距離(50cm推奨)を指定し、SVG生成のランドルト環(Cの向き)をランダム表示。8方向ボタンで回答し正答率から視力目安をスコア化。
2. 色覚傾向チェック：複数の色相パターンから浮かぶ図形を選択する簡易テストを10問実施。医学的診断でない旨と、要相談時は眼科推奨の注意書きを表示。
3. 聴力周波数チェック：Web Audio APIのOscillatorで125Hz〜16kHzの純音を左右チャンネル別に段階的な音量で再生し、聞こえた最小音量を記録。年代別平均と比較グラフ表示。
4. 結果ダッシュボード：3項目をレーダーチャートとカードでまとめ、キャラクターが結果に応じたコメントを表示。PNGでシェア画像を生成。
5. 履歴トラッキング：LocalStorageに毎回の結果を保存し、月別推移の折れ線グラフを表示。3ヶ月ごとの再チェック通知(ブラウザ内リマインダー)。
6. コンディションタイプ診断：3項目の傾向から6種の「感覚バランスタイプ」をキャラクター風に判定するエンタメ要素。

【画面構成】①トップ(3チェックへの導線+ラボ背景)②視力チェック画面(Canvas/SVG表示+距離入力)③色覚チェック画面④聴力チェック画面(ヘッドホン推奨表示+周波数スライダー演出)⑤結果ダッシュボード⑥履歴・推移グラフページ⑦免責事項・使い方ページ。

【データ構造】個人の健康データのためサーバー保存は行わずLocalStorageのみで完結(JSON形式でresults配列を管理：日時、視力スコア、色覚傾向、聴力最小可聴音量dB目安)。DB不要のためMySQLは使用しない。

【デザイン方向性】清潔感のあるパステルミント×ライトブルーの医療ラボ風フラットデザイン。丸みを帯びた線と柔らかい光の演出、白衣を着た小動物マスコットが案内役として登場し、検査中・結果発表シーンで表情が変化する。

【BGM仕様】Lo-fiアンビエント、BPM70、4/4拍子。ピアノアルペジオ+パッド和音+ソフトなブラシドラムで8小節×2(A/B)構成。Aは静かなピアノ主体、Bはパッドが厚みを増しフィルインで展開。結果発表時は同キーでテンポ+10、ベルを追加した高揚バージョンに切替。Web Audio APIでAudioContext.currentTime基準の先読みスケジューリングを実装し、BGM/SEの音量を別ゲインノードで管理、ミュートボタンと画面遷移時のノード解放処理を実装する。

## BGM品質要件
- アプリの雰囲気に合うジャンル・BPM・拍子を定め、ドラム、ベース、和声、メロディの4層で構成する
- 最低8小節またはA/Bの2展開を作り、休符、アクセント、フィル、フレーズ変化を入れる
- Web Audio APIはAudioContext.currentTime基準で先読みし、BGM/SE別音量・ミュート・停止処理を実装する
- 単一オシレーターの持続音や1〜3音だけの反復はBGMとして不可

## ビジュアル品質要件
- 生成済み素材を仕様内の用途・表示場所で実際に使用し、未使用素材を残さない
- 画風・配色・キャラクター比率を全画面で統一し、文字はHTML/CSSで重ねる
- PC・スマホで画像の欠け、引き伸ばし、文字との重なりがないことを開発完了前に確認する