Codex開発で収益化するまで #3
「旅を再生する」機能を作り始めたら、一気にアプリ感が出た
これまでは、
「旅の記録を残す」
という感じ。
でも今回作りたかったのは、
その先。
“旅を再体験できる”UIを作りたくなった
旅行って、
写真を見るだけだと断片的。
でも実際は、
- 移動して
- 景色が変わって
- 時間が流れて
記憶になってる。
なので今回は、
Journey Replay（旅再生）
という機能を作り始めました。
どういう機能？
アップロードした写真を撮影日時順に並べ、
- 地図が旅の流れに合わせて滑らかに移動
- ルート線が“軌跡”として徐々に描画
- その瞬間に撮った写真へ切り替わる
ことで、
「どこへ行き、どんな景色を見て、どう移動したのか」
を、ただ記録として残すのではなく、
“旅そのものを再生する”
ような体験を目指しています。
単なるフォトアルバムでも、Mapでもなく、
「旅の追体験ができる」
そんなUIを作ろうとしています。
実際かなり雰囲気が変わった
正直、最初は
「写真の場所をMapに表示するアプリ」
という感覚でした。
もちろん便利ではある。
でも、
ただピンが並んでいるだけだと、
“情報” の域を超えなかった。
そこに、
- 地図が旅の流れに合わせて移動する
- ルート線が軌跡として伸びていく
- 写真がその瞬間ごとに切り替わる
演出を加えた瞬間、
一気に空気感が変わりました。
ただ場所を見るのではなく、
「この順番で移動してたんだ」
「この時こんな景色だったな」
と、“記録” が “記憶” に変わる感覚が出てきた。
Mapを動かしているというより、
旅そのものを再生している感覚に近くて、
開発していてかなり面白かったです。
今回特にこだわった部分
ルート線の見せ方
既存のGoogleMap感を消して新たな体験を作る、という意味で
- ダークテーマ
- 発光感のあるルート線
- 滑らかな視認性の良い移動
を意識。
デザインとしてInstagramのダークモードが好みなのでそれに近しい雰囲気を目指しています。
写真とMapの連動
タイムライン側の写真を押すと、
- Mapがその場所へ移動
- マーカー強調
- 写真切り替え
するように調整。
これだけでかなり触っていて気持ちいい。
「ただの一覧表示」じゃなくなってきました。
今回感じたこと
Google Mapsって、
ただ埋め込むだけだと “地図”。
でも動きを付けると、
一気に “体験” になる。
特に旅系は、
情報量よりも、
「見返したくなる感覚」
の方が大事なのかもしれない。
地味に苦戦したところ
Map移動、
Marker更新、
ルート描画、
現在地、
タイムライン同期。
全部別々に動いてるので、
状態管理が少し複雑になってきました。
Reactで、
「どこをstateに持つべきか」
をかなり考えるようになった気がします。
次やりたいこと
次はさらに、
“旅の動画化”
に寄せていきたい。
- 再生速度変更
- 旅終了演出
- 他のユーザーとの共有
このあたりの機能を搭載して、
利用者が「旅行後に見返したくなる」
アプリにしていきたい。
少しずつだけど、
“便利アプリ” ではなく、
“感情が残るアプリ”
に近づいてきた気がします。