田村 勇貴

検索改善 今までの検索だと、どの業態を跨いでも同じ検索結果になってユーザーにとっては不必要な条件も提示される問題点があった(例: 美容室を探してるけど、ネイルが引っかかるなど) ここは今まではMojoliciuouで作られていたけど、stateのやり取りなどを行いやすくするというのもあってReactを導入。 Reactの環境を作ってstateカスタムフックを使ってstateやフックの共通化するようにして扱いやすいようにして作成。 この改善施策ではエリア指定の検索をよりUXをよくするために、インクリメンタルサーチを導入して入力のストレスを減らすなど対応。 写真詳細内のカタログリンクを改善 元々このページでは写真の前後移動のリンクがわかりにくい位置にあったりなどUX的にも良くない状態だった。 画像とのリンク移動がわかりやすいUI設計に変更して、改善後はページ・セッションの方は0.5~1ページほど増えて、PVは15000ほど増加するようになった。 予約フロー改善 予約に関連するページは今までだと、ステップインジケーターと画面フローがあってない状態になっておりユーザーが今どの位置にいるかわかりにくくすぐ予約まで確定するんじゃないか？みたいな不安をユーザに提供してしまう可能性があった。 主にこのページはfigmaと実装とのスタイルの乖離などが激しく、今回の施策改善によってスタイルを合わせるようにしたりユーザにわかりやすいUIを設計してUXがいい状態を作るようにした。 フロントエンド移行 minimodeljpはPerlのMojoliciousを使って動いているので、レガシーな技術ということもありフロントエンドのリプレイスを担当。 SEOが重要なサービスということもあり、SSRをしたほうがよいのでフロントはNext.jsを使うようにした。 minimodel上で使われているコンポーネントをReactでコンポーネント化していきスタイル周りをCSS in JSでemotionを使うようにしてStorybook上で確認できる状態を作っていった。 一部のページのFigmaが更新されていなかったり、各マージン・フォントサイズ・UI部分など、コンポーネントの共通化が行えそうな箇所はデザイナーの方と移行に合わせてルールの統一化や相互に改善するような対応を取るようにした。 フロントエンド移行するにあたってすぐにNextに置き換えできるというわけでもないので、既存でReactを使われていた部分をsubmodule化してviteでビルドした結果をSPAで配信するようにしたりするなど。