Vue Fes Japan 2025 に登壇しました！
こんにちは、RIZAPテクノロジーズ株式会社の加藤です。
10月25日に開催された Vue Fes Japan 2025 にて、
「chocoZAPサービス予約システムをNuxtで内製化した話」
というテーマでLT登壇する機会をいただきました。
発表内容について
chocoZAPのサービス予約システムをNuxt.jsで内製化した取り組みについての発表です。これまで外部サービスを利用していましたが、今年3月に内製化が実現しました。
今回のLTでは、内製化に向けて開発時に工夫したポイントを中心に紹介しています。
chocoZAPサービス予約システムをNuxtで内製化した話
5分という短い枠では UI/UX に関する部分を十分にお話しできなかったため、ここからは資料では触れきれなかったUI/UXの工夫をご紹介します。
5分では話しきれなかった工夫ポイント
■UI/UXをchocoZAPアプリ全体のトンマナに統一
内製化によって大きく変わったのが、予約サービスのUI/UXをアプリ全体と同じトンマナに揃えられるようになったことです。
chocoZAPのデザインシステムに沿ったコンポーネントを実装して組み込めるようになったことで、予約サービスだけ雰囲気が違う状態だったものが解消され、アプリ全体のブランド体験としても一貫性が大きく向上しました。
■ 状況別のエラーをユーザーに正しく伝える
ユーザーがどんな理由でエラーに遭遇したのかをわかりやすく伝えることが重要だと思っています。
これまでは「予約できませんでした」という一文でまとめられてしまう場面だったものが、内製化によってエラーの種類に応じて適切なメッセージを細かく出し分けることができるようになりました。（予約上限・予約重複・通信エラーなど…。）
これにより、「なぜ予約できないのか」が直感的に伝わるようになったので、ユーザーを迷わせず次に取るべき行動が分かりやすい体験を提供できるようになったのです。
■ ユーザーに合わせた2種類の予約方法
予約システムには、利用スタイルに合わせて2つの予約方法を用意しています。
今すぐ予約
現在時刻から最短の空き枠を自動で提示し、すぐに予約できます。
「その場で今すぐ使いたい」というニーズに対応でき、利用開始までの導線がとても速い点が特徴です。
日時選択
1週間分の空き状況を表形式で俯瞰でき、時間帯を見ながら自分の生活リズムに合わせて予約できます。
個人的には、前後に人がいない時間帯を選びたいことが多いため、空き枠を確認しながら選べる日時選択はとても便利だと感じています。
当日はとても緊張していましたが、直前に他のLT登壇者の方々と少し話す時間があり、気持ちがほぐれました。
また、社内メンバーが応援に来てくれたことも大きな支えとなり、安心して壇上に立つことができた次第です。
初めてのVue Fes Japan登壇は、とても良い経験になりました。
準備や当日のサポートに関わってくださった皆さまに、改めて感謝申し上げます。
準備を通して感じたこと
5分というLT枠は思っていた以上に短く、内容を絞り込むところが苦労のポイントでした。
話したいことはたくさんありましたが、削りすぎると文脈が途切れて伝わりづらいし、逆に盛り込みすぎると「このLTでは結局何を伝えたいのか」がぼやけてしまうため、構成を何度も見直して調整しました。
また、資料を作る過程で、普段なんとなくやっている判断や実装の流れを改めて言語化できたので、頭の中の整理につながったように感じています。
振り返りとしてもとても良い時間になりました。
おわりに
今回の登壇は、Nuxtを用いたサービス開発の裏側を整理し、外部イベントで発信する良いきっかけとなりました。
今後もプロダクト開発の中で得られた知見や試行錯誤を、継続的に共有していきたいと思います。
当日は複数メンバーが参加しており、それぞれの視点でイベントのようすをレポートしています。ぜひ合わせてご覧ください！
関連する求人情報
