目指すのは“モダンな開発体験”が可能なチーム。KINTOサービスサイトの顧客体験にコミットするフロントエンド開発の舞台裏

KINTOテクノロジーズでは現在フロントエンドエンジニアを絶賛採用中です！
今回、KINTOテクノロジーズでは、2024年6月に入社したahomuさんがフロントエンド開発の現場の声を聞きに行く、という“フロントエンドエンジニアの仕事”をテーマにした対談企画をスタートします。

第2弾では、KINTOサービスサイトの再構築など、社内システムのリプレースを推進しているKINTO ONE開発部新車サブスクグループのフロントエンドエンジニアに焦点を当てました。

シニアフロントエンジニアを務める大河原さんはそのチームづくりにおいて、「モダンな開発体験が可能なチームであること」を重視していると語ります。「モダンな開発体験」が何を意味し、チームにどのようなメリットをもたらしているのか。メンバーの伊藤さんが実際に感じている点などを踏まえつつ、新車サブスクグループのチーム力、開発力の源泉へと迫ります。

▍IT／IS部佐藤歩（ahomu）
https://x.com/ahomu
Webシステムの受託開発企業でフルスタックエンジニアとしてキャリアをスタート。やがて、より専門的なノウハウを求めて、サイバーエージェントへと転職し、フロントエンドエンジニアとして、多くの新規事業の立ち上げ開発に携わる。同社では、事業や組織を横断してWebプロダクトの品質向上や技術的チャレンジを推進する「Web Initiative Center」を設立し、テックリードなどの要職も務めた。その後はスタートアップに技術部門の責任者として参画。2年の勤務を経て、2024年6月にKINTOテクノロジーズへとジョインする。当社へのキャリアチェンジを決めた理由は、自動車というモノを売る企業のデジタル化に可能性を感じたから。15年のキャリアで得た幅広い経験を武器に、モビリティサービスの拡大へと尽力する。SNSなどでは、「あほむ」というハンドルネームでも広く知られている。

▍大河原　KINTO ONE開発部新車サブスクグループシニアフロントエンドエンジニア
大学卒業後、ベンチャー企業でエンジニアとしてのキャリアをスタート。その後、ゲーム系やメディア系など、色々なサービス開発や運営を経験したのち、KINTOテクノロジーズへとジョインする。入社の決め手となったのは、設立から間がなく、文化が確立されていない事業会社であったこと。シニアフロントエンドエンジニアとして活躍するかたわら、チームのリーダーとして、組織づくり、組織運営にも力を注ぐ。

▍伊藤　KINTO ONE開発部新車サブスクグループフロントエンドエンジニア
大学卒業後、他業種で営業職へと従事したのち、エンジニアに転身。ベンチャー企業での受託開発、自社サービス開発などの経験を経て、2023年10月にKINTOテクノロジーズにジョインする。入社を決めた理由は、充実したリソースと自由度の高い職場環境が整っている環境に魅力を感じたから。これまでの経験を活かしサービス改善へと取り組んでいる。

サービスの改善という事業会社らしいプロジェクトに従事

佐藤：大河原さんがKINTO ONE開発部新車サブスクグループに配属されたのは、KINTOテクノロジーズの設立前である2020年ごろのことだと伺いました。チームではこれまでの4年間、どのような業務を担当してきたのでしょうか。

大河原：最初に着手したのは、データベースの移行、Amazon RDSの導入です。参画してからしばらくのあいだは、部署全体でそのプロジェクトを進めていました。
現在でこそ内製開発組織として動いているKINTOテクノロジーズですが、当時は必要なプロダクトをベンダーへと発注していました。そのため、細部の仕様に不十分な箇所が見つかることも少なくなく、また、そうした部分を適切な形へとアップデートする作業にも手がつけにくい状況でした。Amazon RDSの導入が一段落してからは、社内で内製したシステムへのリプレースが目下の課題となっていきましたね。現在はこのプロジェクトも完了し、新たな機能開発やレビュー含め改善を進めています。

佐藤：伊藤さんはどのタイミングでチームにジョインしたのですか？

伊藤：2023年10月です。システムのリプレースが完了する頃ですね。私が配属になった直後にプロジェクトの打ち上げが行われていました。

佐藤：先ほどサービスサイトの再構築というお話がありましたが、大河原さん、伊藤さんの所属する新車サブスクグループは、サイト内のどのような箇所の開発を担当していますか？

大河原：私たちが開発しているのは、サービスへの申し込みに関連する一連のフォームと、利用を開始したお客様に個別に用意されるマイページ部分などですね。主にお客様の入力内容によって表示や反応が変わる動的なページを担当しています。前者で10～15ページほど、後者で40ページほどでしょうか。

佐藤：マイページではどのような機能が提供されているのでしょうか？

大河原：契約の詳細が見られるページや、解約や再契約のご案内、車両変更の手続きといった機能が盛り込まれています。申し込み完了というゴールに向かってリニアにページが並んでいる前者とは異なり、後者ではお客様のご利用状況やご要望によって求められる役割が変わってきます。

佐藤：伊藤さんはこれまでのキャリアでさまざまな開発を行ってきたそうですね。過去に携わったプロジェクトと現在担当しているプロジェクトのあいだにはどのような違いを感じていますか？

伊藤：これまでは1,2ページといった小規模のプロジェクトが多く、現在担当しているような大規模なものは経験したことがありませんでした。また、作りきりではなく、こつこつとサービスを育てていくプロジェクトも、私にとっては未経験の領域でした。ですが、いまとなっては、形のない目標に一歩ずつ向かっていくという経験がやりがいにもつながっています。事業会社の内製開発組織らしいプロジェクトだと感じていますね。

意識したのは、モダンな開発体験ができる環境であること。

佐藤：システムリプレイスが始まった当時、チームはどれくらいの人数規模で動いていたのでしょうか。

大河原：当初、プロジェクトにアサインされていたのは私だけでした。以降は少しずつメンバーが増え、現在は全体で7名のチームになっています。リプレース作業の完了までには2年弱という時間を要しましたが、振り返ればあっという間だった気がしますね。

佐藤：チームづくりで意識したことがあれば教えてください。

大河原：意識したのは、スタンダードな開発体験ができる環境であることです。エンジニアは、常に新しい知識／技術にアンテナを張っていなければ、簡単にトレンドから置いていかれてしまう仕事です。だからこそ、いま主流の開発ツールを取り入れたり、検証ができたりするような環境を整えることで、時代遅れにならないような開発環境を目指しました。たとえば、新車サブスクグループでは、JavaScriptフレームワークにReactとNext.jsを採用しています。チームづくりにおいて私が最優先としたのは、他の進んだ開発チームと比較しても遜色のない技術スタックで技術環境を構築することでした。

佐藤：開発体験について現時点での評価はいかがですか？

大河原：まだ道半ばではありますが、着々と目指した開発環境に近づけている感覚はあります。現在着手している再構築後のサイトのページレビューでは、UIカタログ作成ツールのStorybook、テスティングフレームワークのjestなどを導入したことが、迅速かつ正確なテストの運用へとつながりました。

佐藤：テストはどのようなフローで実施したのですか？

大河原：現在、プロダクトの中で行っているテストには、コンポーネントテスト、ユニットテストの2種類があります。どちらもが正確なレビューのためには必要な工程ですが、そのなかで私たちが重きを置いたのが、前者のコンポーネントテストでした。その背景には「すべてのコンポーネントが正しく動いていれば、最終的なページも正しく動くはず」という考えがありました。実際に私たちが行ったのは、Storybookのplay関数を用いて作成したパターンリストをjestへとインポートし、統合テストのような形で実行することでした。

結果としてこのアプローチは私たちが想定していたとおりに動作し、スムーズにコンポーネントテスト、ユニットテストを完了させることができました。理想のチームづくり、チーム運営を行ううえで、意義の大きい事例となりました。

メンバー個々の成長が組織の強度へとつながっていく

佐藤：現在、開発面で課題に感じていることがあれば教えてください。

大河原：目下の課題は、サービスへの申し込みページを、途切れることなく完結できる仕組みにすることですね。シングルページアプリケーションで構築していることもあり、現状ではお客様が途中で離脱した場合に最初からやり直しになってしまうケースが珍しくありません。UI／UXが優れているとは決して言えない動き方となってしまっているので、この点はできるだけ早く改善していきたいです。

伊藤：現在は入力内容保存ボタンを設置し、マイページから申し込みを再開することが可能になっています。とはいえ、お客様の操作に委ねてしまうところはあるので、より理想的な方法を模索していきたいですね。契約や見積もりはサービスの顔になる部分だと思います。煩雑な印象を与えてしまわないよう、ユーザー目線での改善を続けていきたいです。

佐藤：チームづくり、チーム運営の面ではいかがでしょうか。

大河原：「モダンな開発体験ができるチームにする」という目標には、今後も継続して取り組んでいきたいです。また、それとは別に、メンバーには少なくとも半期に1つ、大きなプロジェクトに携わってもらえるようにマネジメントしていきたいですね。そのなかで各自が課題を見つけ、それを解決することで自身の成長へとつなげていってもらえれば、結果として組織の強度も上がっていくと思います。事業会社の内製開発チームであるKINTOテクノロジーズにとっては、サービスの改善も重要な業務のひとつです。だからこそ、中長期的な視点も踏まえながら、チームづくり、チーム運営を考えていきたいですね。

伊藤：一方、短期的な視点では、2週間に一度、レトロスペクティブという振り返りの機会を設け、進捗の報告や課題の共有、今後導入したいツールの提案などを行っています。このようなメンバー間の情報共有がきっかけで、個人、さらにはチームのパフォーマンスが良くなることも珍しくありません。私も過去、担当する案件での困りごとをメンバーに相談し、解決してもらったことがありました。理想のチームづくり、チーム運営を実現するうえで、こうした場の存在はとても有意義だと感じています。今後も続けていきたい取り組みのひとつですね。

佐藤：個々の成長、メンバーのつながりを第一に、チームマネジメントを考えているのですね。

大河原：そうですね。こうした柔軟な風土こそが、大手とベンチャーの良い部分を併せ持つKINTOテクノロジーズらしさだと、私は感じています。理想としているのは、自分自身の価値をアップデートしていけるチームであることですね。そのためにはそれぞれが目的意識を持って日々の業務に向かう必要があります。システマチックになりすぎると、請負開発のような動き方になってしまうじゃないですか？せっかく事業会社で開発に従事するのですから、言われたことを言われたようにやるだけではもったいないと思います。

新車サブスクグループでは現在、私たちとともに働くフロントエンドエンジニアを募集しています。主体性を持って開発に向かえる方が活躍できる環境です。みなさんのご応募をお待ちしています。