# 個人開発したサービスについて
HollowShelfieというユーザー投稿型VRイベント共有サービスを
2024年6月9日にreleaseしました。
https://hollowshelfie.com/home
デザインはとても拘りました。
メインは掲示されているポスターとなるため
邪魔にならない程度の装飾とアニメーション
## 名前の由来
空っぽ(Hollow)
棚(shelf)
自分で(selfie)
飾る。
**HollowShelfie** としました。
## 開発期間
初期構想
技術選定
画面レイアウト検討
開発
本業が忙しかったりしましたが。
時間ができれば開発するようにしてました。
scrap＆buildを重ねtotalだと8ヵ月ほどで0->1でリリース
大体の1日のタイムスケジュール
- 平日
- **9:00** - 業務開始
- **19:30** - 業務終了
- **20:00** - 個人開発開始
- **25:00** - 就寝
- 土日
- **11:00** - 起床、個人開発開始
- **25:00** - 就寝
## 作るに至った理由
私は普段VRSNSで遊んでおり
そこでとある方に
「主催者や演者をソースにイベントを探す方法がないんだよね～～」と
ボソッとつぶやかれたのがきっかけで作成を決めました。
### 競合のリサーチ
VR界隈ではかなりの認知を得ている
VRCイベントカレンダーというサービスがすでにあります。
- 日々50~80を超えるイベントが掲載されています。
### 競合との差別化を探す
Google カレンダーがベースになっているため
検索性能や仕分けが行いにくそうだなと感じておりました。
また、イベント情報修正が行えないなどがあるなと
そこから差別化ポイントを洗い出し
- Eventを投稿者本人が自由に変更できる。
- Eventをカテゴリやタグ付けすることができる。
- Eventをいいねbookmarkできる。
- 検索の条件を多彩に設定でき、見つけたいイベントを確実に見つけることができる。
### さらなる差別化を求めて
知り合いへのリサーチ
- イベントのフライヤーがユーザの目に触れる時間は少ない
- 拘って作ってるんだけどすぐうもれる
- 個人の活動履歴追いにくい
- ユーザのタレント化が進んでおり特定の人のライブやDJや演劇などを見に行く
これらを解消できるようなシステムを目指しました
### リリース目標日の策定
最初は2月を目標にしたが本業が忙しく断念
6月を次の目標に設定。
## 実装したい機能の洗い出し
初めに大まかにどういった機能を入れたいかの洗い出しを行いました。
- Eventの掲載と自由な変更
- いいね
- bookmark
- タイムライン表示
- リッチな検索
- 通知
- チーム(グループ)
- フォロー
- プロフィール
- イベントの公募
- チケッティング
### 優先度を落とした機能
- イベントの公募
マッチング機能になるため実装検討事項が多くなるため目標リリースに間に合わない。
- チケッティング
プラットフォーム周りでの利用規約により実装負荷
- 通知
リリース目標までに間に合わなかった。
## 技術選定
キャッチアップが目的でもあったため
基本的に本業で使用しているものと似たstackにした
メインとなるものだけをピックアップします。
バックエンド
- laravel
- 本業で使用しているメインFWのため
- laravel jetstream
- 今回、認証周りのキャチアップを求めていなかったため全部入りのパッケージを使用しました。
- チーム機能やAPItoken発行機能などが画面付きで標準搭載されています。
- laravel socialite
- OAuth認証を実装したく導入しました
- GoogleやDiscord認証
- laravel scout
- 全文検索を行うためのライブラリです
- 開発環境にlaravel sailを使用しているのですがインストール時に選択に出てきて気になって入れてみました。(笑)
- meilisearchを接続していますが後悔しています。導入が速すぎたと思っています。というのもコンテンツが少ないとおーばスペックですし
apサーバーとは別にmeilisearchサーバーを用意する必要があり
余計にお金がかかってします。
- laravel filament
- 開発の後半にいれた覚えがあります
- 管理用の画面を作成したかったのですが自前で用意するには時間がかかりすぎるためこちらのライブラリを使用しました
- dbのschemaをもとにある程度自動でCRUD形式の画面を生成してくれるため多少の手直しで十分動くもが作成できました
- 使い勝手もよくカスタマイズ方法が多彩で結果的に導入してよかったと思っている
フロントエンド
- vue 3.x
- 業務で使用していたため
- inertiajs
- laravel jetstreamで作成する際に画面をvueで作成したい場合に自動で導入される
- tailwindcss
- こちらも同じくlaravel jetstreamで自動導入
- daisyui
- tailwindcssにいくらかのユーティリティコンポーネントを提供してくれる。
インフラ
- laravel forge
今回インフラについては勉強の対象外としたため
どこかのPaasに乗っけることを前提としていました
- Sentry
本番環境で発生したエラーを追跡するために導入
その他
- googleアナリティクス
## できたもの
LPページ
https://hollowshelfie.com
- 様々なサイトのLPページを見てそれっぽくしあげました
デモイベントのページ
- カテゴリやタグをクリックすると検索ページに遷移
- タイムテーブルを表示して演者の出演時間をわかりやすく。
https://hollowshelfie.com/event/01hzy6gqfwfpcffct3x8dc828p/show
イベントの管理ページ
個人のprofileページ
https://hollowshelfie.com/@Sphere
チームのprofileページ
https://hollowshelfie.com/@HollowShelfie
## 振り返ってみて
### リリースしてから思ったこと
- 全然使ってもらえない。
- 思ったほど伸びなかった
個人的にはかなり出来は良いかなと思っていたで話題になるかなとは思ってたのですが微風でした（笑）
https://x.com/SphereVR/status/1799731407054610654
### 反省点
マーケティングが全くできていなかった。
開発中もこういったものを作成中！だったり
イベントなどに顔を出して主催者へのアプローチをしておけばよかったと思ってます。
今後はXなどでタイムラインに流れてきたイベントの主催者に直接許可をとって自分で転載するなどしてコンテンツを増やしていってみようと思ってます。
### 開発してみておもったこと
総じて、とても勉強になった。
一番身についたのは課題解決力だと思います。
いろんな課題にぶつかってそれを解決するための手法を探したり
公式のドキュメントやGithubのIssueを穴が開くほど眺めたりライブラリの中のソースを読んだりする経験ができました。
## ぶつかった課題
- seoがよくわかってなくて途中でSSRに変更したこと。
- 419エラーの解消にてこずったこと
- 全文検索(MeiliSearch)でネストした検索に苦労した話。
- 動的なfilterの生成の話。
- 記事通りlaravelのtz設定したら+9h 時刻がズレた話
- vue-formのスタイルが気に入らなかったからformの構築を自作した話
- tiptapをしようしたwysiwygエディターの構築
- nginxの設定により特定のページだけ502エラーとなってしまう。
- render.comへのデプロイがうまくいかなかったなど