矢印キーで、路線に沿って東京都の地下鉄駅を移動していくゲーム？を作成しました。主用途は、「プレイして仕事の心配事を一時的に忘れる」ことです。
自分本位かつ目的も楽しむことではなかったので、予定調和的にくそアプリが出来上がりました。
光が丘駅から、ランダムに選出された駅にへ向かう仕様となっています。
単に路線の終点の中から選んだだけですが、それゆえ乗り換え駅が遠く、退屈かもしれません。
11月ごろから、朝の5分間瞑想を取り入れることにしました。
でもうまくいきませんでした。ぼーっとしようにもたくさん心配事が浮かんできます。
せめてそんな雑念を振り払う時間が取れないかと思い、１つのことに意識を集中させる何かが欲しくなりました。
ソフトウェアエンジニアだし何か製作しようと思い立ち、アプリの開発に至ります。
目標
要件としては、
- 簡単に作れる → webアプリかなぁ
- 面白さより操作の簡単さを求める。→ 操作が難しくて考えることが増えても仕方ないので
- 集中したい → 画面を見ないで目を閉じていてもできるものがいい → 音声を聞きつつキーボード操作で成り立つものがいい
の点をぼんやり考えていました。
コンテンツ
東京都の地下鉄路線をモチーフに選びました。日々都内への通勤で複数の地下鉄を使っていることから思いつきました。
現在の駅から目的駅に移動するというルールなら、音で駅名を知らせていけばできます。
作るものは以下のように決めました！
- 地下鉄の駅だけを登場させる。収集つかなくなるので。
- ゲームを始めると、現在自分がいる駅と、目的地となる駅が表示される。
- 矢印キーを使うと、自分がいる駅の隣の駅に移動する。また、乗り換え可能な場合は別路線の駅に移動できる
- 隣の駅へ移動するたびに、「移動音」がなり、到着すると「駅名」が合成音声で読み上げられる
- 目的駅に移動すると、ゴールが音声で告げられる
使ったもの
アプリ : svelte + typescript
サーバー : netlify
データ : 駅データ.jp 様 の無料データ
svelteは初挑戦で、生成AIにはかなりお世話になりました。
アピール（くそ）ポイント
完成度を高める気がなかった言い訳はともかく、
成果物として:
- 別に面白くはない
- UIがちんけ
- 都内の地下鉄をそこそこ把握していないと永遠にたどり着けない。私は北東の駅が弱いです。入谷ってどこ？
技術的な瑕疵
- 合成音声のピッチなどが調整できない。くそ速い場合がある
- 読み上げられる駅名がタイポのせいで間違っている場合がある。プログラムによる読み上げのために駅名をひらがなで用意していますが、そこで入力ミスしています。
- overlayがうまく実現できていない。AIに勧められたものを確認もせずに使った。
etc.
改善の余地として前向きにとらえることにしました ♪
プレイした感想
毎朝5minほどやってみましたが、「意識の集中」はできました。
自分の中の地下鉄地図を思い浮かべながらなので、仕事の心配事も登場してきませんでした。
なので自分的には満足です。
飽きますけどね。
学び
路線ごとのかぶりを含めると、300弱もの地下鉄駅があることを知りました。
ちなみにかぶりを除くと200駅ぐらいです。
しかもまだ延伸の話が出ています。発展に驚くばかり。