概要
Web Audio APIによる正確なモールス音再生、モバイルでも使いやすい入力UI、実績バッジ、ランキング向けUIを備えた学習アプリです。
Vanilla JSで複数ページを構成し、共通UIやデプロイ手順を整理しながら継続開発できる形にしています。
音声と視覚フィードバックを同期させ、音が出せない環境でも学習しやすいUIを目指しています。
使用技術
Vanilla JSWeb Audio APISupabaseVercelCSS
実装・設計のポイント
- AudioContextによる正確な音声スケジューリング
- スマホ向けタップ入力グリッド
- 実績バッジとゲスト・ログイン両対応
- 音と同期する全画面フラッシュ
- 共通UIモジュール化による重複削減