🛹

【個人開発】スケーター向けの Web アプリを作った

2022/08/15に公開

Firebase

Next.js

個人開発

idea

スケーター（スケートボーダー）向けに Skaters という Web サービスを作った。

作ったもの🎉

Skaters
https://skaters.one

作った理由

スケボーをしているときに、下記のようなアプリがあるといいなと思ったので、作った。

成功したトリックを確認できる
それぞれのトリックに対して、メモを残したい
行ったことのあるスケボーパークを確認したい
セットアップ（使っている板・ウィールなど）の履歴を記録したい

構成

フロントエンド： Next.js
バックエンド： Next.js の API ルート、 Firebase cloud functions
ホスティング： Firebase Hosting

認証やストレージ、DB も Firebase/GCP を利用。Cloud Run 利用。
Firestore の Read についてはブラウザから直接取得。 Write については、Next.js の API を介している。

Firestore や storage、Auth のデータ変更に対するトリガーを使いたかったので、 cloud functions を利用。

Skaters の機能を具体的に👀

トリックの管理

Skaters トリック管理

スケボーのトリック一覧画面にて、成功したトリックに対して ⭐️ マークを表示。自分が成功したトリックを一目で確認できる
いきなり全てのトリックを表示しても味気ないと思ったので、トリックを成功すればするほど、新しいトリックが開示される仕組みにしている
トリックの詳細画面では、トリックの動画を全画面で再生してイカした雰囲気に
スケボーのスタンス（進行方向に対して、右足が前か、左足が前か）は２種類ある。スケボーのスタンスに一致するように、動画を反転表示させてあげている。
スケボーのスタンスごとに成功判定をできるように。慣れているスタンスと逆のスタンスを「スイッチスタンス」というが、スイッチスタンスで何ができるかというのも管理できる。
トリックごとに自分のメモを残せるように。何をしたら上手くいったか、何をすべきじゃないかなどの記録を残せる。
トリック情報は SSG で生成
依然としてトリックの動画データや各種情報（トリックの説明やハウツーなど）は揃っていないので、時間をかけて整備していく
【今後】自分独自のトリックを登録できるように。友達もそのトリックに挑戦できる。
【今後】自分独自のライン（トリックの組み合わせ。AしてBしてCする的な）を登録できるように。友達もそのラインに挑戦できる。

スケートパークの訪問記録

Skaters パーク管理

スケボーパークの情報を県別に確認できる
スケボーパークにどんな種類のセクション（ランプと呼ばれるハーフパイプや、レールと呼ばれるトリック用の鉄パイプの存在）があるかを確認できる
「チェックイン」することでスケボーパークへの訪問が記録される
パーク情報は SSG で生成
依然としてパークの写真データや各種情報（パークの説明やトイレ・駐車場の有無など細かい情報）は揃っていないので、時間をかけて整備していく
【今後】スタンプラリーのような、訪れたことのあるパークの一覧画面を作成する（スタンプラリーっぽいものを用意すれば、全国のスケボーパークを巡ろう♪となってくれそうなので）

セットアップ（板・ウィールなど）の管理

Skaters セットアップ

スケボーで出会った人との会話では、必ずセットアップ（使っている板やウィールなど）について聞くことがある。他人のセットアップは気になるもの。オリンピックで金メダルをとった堀米選手のセットアップに関するネット記事は多い。
なので、自分のセットアップを登録できる機能を作成した。
セットアップを変えるごとに、作成しておくことで、「前はこの板使ってたな〜」と振り返ることができる。

フレンド機能

ポケモンGO のように、フレンドコードを介して、他のアカウントとフレンドになることができる（相互フォロー）
フレンドになることで、友達の活動履歴（最近なんのトリックを成功したか、どこのパークに行ったか、セットアップは何を使っているか）を確認できる
スケボーは狭いコミュニティなので、公園で滑っているとすぐに声を掛け合って、仲良くなることが多い。そういう時、インスタや Twitter の連絡先を交換することがあるので、その時に Skaters でもフレンドになってくれ〜という思いでこの機能を作成
Twitter のように勝手にフォローする仕組みはやめた。一方的なフォローは繋がりが薄い気がしたので。

作ってみた感想など✍️

スケボーパークやトリックなど、膨大な初期データを揃えるのにとにかく苦労した（いまだに全然データが足りていない）。かかった労力・時間は初期データの整備が全体の９割くらい。
思ったよりスケーターからの反応が薄い笑。とはいえ、自分には刺さっているサービスなので、自分で使いながら、のんびり広めていこうと思う。
データが十分に揃ったら、英語版も整備する予定

まとめ🐀

友達にスケボーやっている人がいたら教えてあげてください☺️