Recruiting Groupの米田です。
今回は、BASEでの開発プロジェクトはどのようなものがあるか、実際に社内のエンジニアはどのような期間・プロジェクトメンバー・人数規模・開発内容のプロジェクトに携わっているのかをご紹介していきます。
開発の進め方
BASEでは、開発の進め方として「プロジェクト制」を採用しています。
クォーターごとにプロダクトオーナーとCTOや開発部門のマネージャーが話し合い、そのクォーターに取り組む開発プロジェクトを決めます。
サービス開発のプロジェクトの種類は大きく下記の3つに分かれます。
①新規の機能開発
例：
・「コミュニティ App」「商品オプション App」など、ネットショップ作成サービス「BASE」の拡張機能であるBASE Appsの新規開発
・「PayPal」など新規決済方法の導入
・ショッピングアプリ「BASE」の新規機能開発
②既存機能の強化
例：
・BASE Appsの各Appの機能強化
・ショッピングアプリ「BASE」の機能強化
③既存機能のリニューアル
例：
・ショップオーナーさんが使う管理画面のフルリニューアル
・ショップデザイン編集機能アップデート
・カート機能アップデート
その他、サービスの機能開発以外では、ミドルウェアや利用している言語やフレームワークなどのバージョンアップなどもプロジェクトとして進められます。
サービスの機能開発のプロジェクトは、多くの場合、PM（プロダクトマネージャー兼プロジェクトマネージャー）、デザイナー、サーバーサイドエンジニア、フロントエンドエンジニアで構成されます。
プロジェクトによって手を動かして開発するエンジニアの他に、技術責任者をアサインすることもあります。技術責任者とは、コードを書くことをメインとせず、設計指針やコードレビューに責任を持つ役割を担っています。在籍年数が相対的に長く、BASEのシステムに詳しいエンジニアが担うことが多いです。
プロジェクトの規模が大きければ、PMの他にディレクターを入れたり、エンジニアやデザイナーのメンバーが多くなります。
今回は、サーバーサイドエンジニアの 栗田さん、田仲さん 、フロントエンドエンジニアの青木さんに、これまでどんなプロジェクトに携わってきたのかをお聞きしました！
栗田さん
「予約販売 App」の開発プロジェクト
プロジェクト期間
2019年4月から2019年7月まで（途中から参画）
プロジェクトメンバー
PM 1名
フロントエンドエンジニア 0.5名
サーバーサイドエンジニア 3名
デザイナー 1名
このプロジェクトの概要を教えてください！
栗田：入荷前の商品を先行販売し、予約注文を受けることができる「予約販売 App」の開発を行うプロジェクトです。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点があれば教えてください！
栗田：初のプロジェクトで途中からの参画だったので、プロジェクトの進め方や開発手順など分からないことが多く苦戦しました。特に、エンジニアが複数名参加しているのでプロジェクトメンバー内の役割分担や、自分はどういう役割を担うかを誰と合意をとるべきかが最初は分かりませんでした。そこは、先にプロジェクトに関わっていたエンジニアが率先して役割分担を進めてくれましたね。
このAppの開発では、商品に関する機能を横断的に担当して、広く浅く「BASE」の開発を学ぶことができたかなと思います。
あと、プロジェクトにサーバーサイドエンジニアが3人いたので、うまく分業したりペアプロしたりして進められた印象があります。
ペアプロはどのような背景で実施したのでしょうか？
栗田：現在はサーバーサイドとフロントエンドを明確に担当を分けて開発しているプロジェクトが増えているのですが、このプロジェクトではサーバーサイドエンジニアもフロントエンドのコードを書いていました。
当時はショップオーナーさんが使う管理画面のフルリニューアルが進んでおり、フロントエンド基盤が入れ替わっているタイミングだったので、新しい基盤での開発に慣れるために実施することにしました。一緒にプロジェクトを担当していたサーバーサイドエンジニアにペアプロをしてもらったり、松原さん（Web Frontendエンジニアリングマネージャー）にモブプロしてもらったこともありました。
消費増税・軽減税率対応プロジェクト
プロジェクト期間
2019年7月から2019年9月まで
プロジェクトメンバー
プロジェクトマネージャー 1名
ディレクター 1名
技術責任者 1名
フロントエンドエンジニア 1名
サーバーサイドエンジニア 1名
デザイナー 1名
このプロジェクトの概要を教えてください！
栗田：消費増税・軽減税率対応のための「税率変更予約機能」の開発を行うプロジェクトでした。具体的には、商品に対して税区分を導入して、標準税率と軽減税率を持てるようする開発でした。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点などあれば教えてください！
栗田：プロジェクトを進めるにあたっては、サーバーサイドエンジニアが基本1人だったので、なんとかしなければと思ったのを覚えています。
APIで分離している開発を本格的にやるのが初めてだったので、キャッチアップや濃いコミュニケーションを心がけました。
プロジェクトのキックオフ時点では要件が固まり切っておらず、プロジェクトを進めながら要件を固めていきました。技術責任者の方に国が出している資料を共有してもらったり、他社ECプラットフォームの対応も参考にしました。
ショップと商品のデータに税の情報を持たせるという大幅なデータ変更の必要があったので、SREに相談してデータ変更にかかる時間の確認やメンテナンスのスケジュール調整したりなど、開発ディレクションも積極的に行いましたね。
「商品オプションApp」の開発プロジェクト
プロジェクト期間
2019年10月から2020年8月まで
プロジェクトメンバー
PM 1名
フロントエンドエンジニア 1名
サーバーサイドエンジニア 1名 → 途中から増員して最終的に3名
ネイティブアプリエンジニア 2名
デザイナー 1名
このプロジェクトの概要を教えてください！
栗田：ショップオーナーさんが商品を販売する際に有料/無料の商品のオプションを設定することが可能になる「商品オプション App」の開発を行うプロジェクトです。例えば、商品に有料のギフトラッピングを300円で商品オプションとして追加できる、といった使い方ができるようになります。以前よりオーナーさんから要望が多くあったAppでもあります。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点などを教えてください。
栗田：機能開発面では、注文価格の計算ロジックに手を加える開発は前例があまりなく、影響範囲の確認に手こずりました。注文価格はあらゆる箇所に影響するので、ネットショップ作成サービス「BASE」、ショッピングアプリ「BASE」、デザインマーケットの3つ同時リリースしました。3つ同時にリリースする事例はあまり多くないです。
最初はサーバーサイドエンジニアが自分しかおらず、かつあまり触ったことのない部分の開発、見積・設計が必要だったのが大変でした。途中でメンバーを増やしてもらい、リリースまでのスピードを早めることができました。
プロジェクト進行面では、インシデント対応があったり、並行して進行している他プロジェクトとの兼ね合いや調整が多くあり難航しました…。
3つ同時リリース、10ヵ月という期間や、参加人数から見てもBASEの中では比較的大規模なプロジェクトでしたよね。リリースを成功させるためにどんなことを行ったのでしょうか？
栗田：綿密な準備を行って進めていきました。リリースは、デザインテーマ、ショッピングアプリ「BASE」、ネットショップ作成サービス「BASE」の順で行ったのですが、デザインテーマのテーマ制作者さんに事前に連絡してAppの対応を行っていただいたり、いつも作成しているリリースノートをより丁寧に書いたり、あとPMがビジネスサイド向けにAppの機能についての説明会も行っていましたね。
※「商品オプション App」のプロジェクトについては、栗田さんのブログ記事「BASEの長期間プロジェクトでのチーム開発について」もぜひご覧ください！
田仲さん
PayPal決済導入プロジェクト
プロジェクト期間
2019年10月中旬から2019年11月下旬まで（途中から参画）
プロジェクトメンバー
PM 1名
サーバーサイドエンジニア 2名
フロントエンドエンジニア 1名
デザイナー 1名
このプロジェクトや作る機能の概要を教えてください！
田仲：「BASEかんたん決済」にてPayPal決済を提供するための開発プロジェクトです。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点はどのようなところでしょうか？
田仲：初のプロジェクトで途中からの参画だったので、「BASE」の仕様や開発手順など分からないことが多く苦戦しましたね。
特に、様々な決済方法の理解に苦労しました。前職では旅行系サービスの開発をやっていて、クレジットカード決済と現地決済については知っていたのですが、「BASE」ではコンビニ決済や後払いなどにも対応しており、そのあたりのキャッチアップは大変でしたね。
多様な決済手段に対応している「BASE」だからこその大変さですね…。分からない点があった際にどのように解決していたんですか？
田仲：不明点はチームの昼会でメンバーに相談したり、開発メンバーでメンターである翠川さんに聞いて解決していました。あとは、BASEはドキュメントが整っているので、分からないことがあればSlackやKibelaで検索すれば解決方法が分かることも多かったです。これまでいくつかの職場を経験しましたが、僕が働いた中ではBASEほどドキュメントが残っている会社はなかったです。
「クーポン App」のアップデート開発プロジェクト
プロジェクト期間
2020年1月から2020年3月まで
プロジェクトメンバー
PM 1名
フロントエンドエンジニア 1名
サーバーサイドエンジニア 1名
デザイナー 1名
プロジェクトや作る機能の概要について教えてください！
田仲：「クーポン App」の機能を拡張するための開発プロジェクトで、このAppは成長したショップさん向けの機能になります。今回のプロジェクトで行ったのは、「クーポン利用を1人1回に制限する機能」「Appの次世代化」を実装することでした。
「次世代化」とはどういった内容でしょうか？
田仲：次世代化とは、フロントエンド基盤の次世代化のことです。ショップオーナーさんが使う管理画面のフルリニューアルに併せてフロントエンド基盤も刷新されたのですが、このプロジェクトでは機能強化とあわせてAppのフロントエンド基盤の次世代化も行いました。
次世代化で具体的に行ったこととしては、最新版のデザインへの追従、UIの構築をWebフレームワークからVue.jsへの移し替えの実施、UIに表示する主要なデータ取得のAPI化などです。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点はどのようなところでしたか？
田仲：僕はショップオーナーさんが使う画面側のApp機能のAPI開発を担当したのですが、以前の職場も含めて、フロントエンドとの分業は初めてだったので、フロント側でどう実装するのかイメージしながらサーバーサイドのAPIを作るのが難しかったなと思います。
フロントエンドの人がどういうデータが欲しいかを想像して、こまめにコミュニケーションを取り、意思疎通をしながら実装を進めることを特に意識しました。
「送り状データダウンロード App」の開発プロジェクト
プロジェクト期間
2020年5月から2020年8月まで
プロジェクトメンバー
PM 1名
フロントエンドエンジニア兼サーバーサイドエンジニア 2名
デザイナー 1名
プロジェクトや作る機能の概要について教えてください！
田仲：佐川急便・日本郵便・ヤマト運輸の送り状発行サービスに適したCSVデータを「BASE」管理画面の注文一覧からダウンロードすることができる「送り状データダウンロード App」の開発プロジェクトです。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点などを教えてください。
田仲：設計、サーバーサイドからフロントエンド含めて開発の大半を担当できたのは印象的でした。通常のプロジェクトであればサーバーサイドとフロントエンドを分業にしますが、このプロジェクトでは僕と、途中からもう一人のエンジニアにも参加してもらって、2人でそれぞれサーバーサイド・フロントエンド両方の開発を行いました。
他には、設計の段階で技術責任者・チーム・CTOそれぞれにレビューしてもらい精度を高められたのは良かったです。
設計レビューでは、どんなフィードバックが返ってきたんですか？
田仲：チームからはプログラム自体への指摘をもらい、CTOからは運用面・ビジネス面の指摘をもらいました。例えば、配送会社さんのフォーマット変更がどれだけあるか、どうやって変更を教えてもらえるのか、といった今後のシステム運用についての指摘などがありました。
青木さん
次世代管理画面プロジェクト
プロジェクトメンバー
PM 1名
デザイナー 1名
サーバーサイドエンジニア 2名
フロントエンドエンジニア 3～5名（プロジェクトの時期によって変動していた）
プロジェクトや作る機能の概要を教えてください！
青木：ショップオーナーさんが使う管理画面のフルリニューアルを行うプロジェクトで、デザインのリニューアルにあわせてフロントエンド基盤の刷新も行われました。
2018年から長きに渡り開発されていたプロジェクトで、自分は2019年10月上旬から中旬までと途中から少しお手伝いさせてもらった形でジョインしました。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点などを教えてください。
青木：主に注文一覧画面や、注文キャンセル周りを見た記憶があります。注文管理は支払待ち、発送待ち、商品受け取り待ちなどステータスが多いので、それぞれのステータスを丁寧に確認していく必要がありました。
注文をたくさん作ってそれぞれのステータスを確認する必要があったため、Puppeteerを使って注文を自動で作成するといった工夫をしていました。
SKUプロジェクト
プロジェクト期間
2019年9月から2020年2月まで
プロジェクトメンバー
PM 1名
デザイナー 1名
サーバーサイドエンジニア 3名
フロントエンドエンジニア 1名
プロジェクトや作る機能の概要を教えてください！
青木：SKU単位でも商品管理できるようにするプロジェクトで、商品に品番、SKU、JANなどのコードを登録することができる「商品コード App」や「注文データダウンロード App」「CSV商品管理 App」の3つのAppを開発するプロジェクトです。
成長したショップさんの業務効率化を目的とした機能で、販売商品を商品管理コードで管理することができるようになるため、商品管理コードをキーとした在庫管理や外部の倉庫管理システム連携が可能になります。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点などを教えてください。
青木：実装当初こそ、フロントエンドの実装としては、商品追加・編集画面に商品管理コードを1つ追加するだけに思えましたが、実際は想像以上に影響範囲が大きく、同時に3つのAppを開発することになったのが印象的でした。当初はサーバーサイドエンジニアが1人だったのが、途中から増員して3人になりました。
複数のAppを同時に開発することはBASE内でもあまり例がなく、3つのAppを一気に作ったことでBASEの開発の仕方をより知れましたね。Storybookを使って、既存の実装から切り分けて開発をするなどの工夫しました。
「商品説明カスタム App」の開発プロジェクト
プロジェクト期間
2019年9月から2020年4月まで
プロジェクトメンバー
PM 1名
デザイナー 1名
サーバーサイドエンジニア 1名
フロントエンドエンジニア 1名
プロジェクトや作る機能の概要を教えてください！
青木：商品の魅力を動画やスライドショー形式の画像などの多様なコンテンツフォーマットを通して分かりやすく説明できる「商品説明 App」を開発するプロジェクトです。
このプロジェクトで印象的だったこと、開発の上で難しかった点・工夫した点などを教えてください。
青木：画像データを取り扱う開発で、今はImageFluxを便利に使っていますが、使わなかった場合どうするのかなど画像の取り扱いが難しいなと感じました。
また、実際の販売ページに関わる開発だったため、BASE Template（ショップオーナーさんが編集できるHTMLテンプレート）の理解が深まったのも印象的でした。
ショップの販売ページにダイレクトに影響する機能だったこともあり、リリース後はショップオーナーさんからポジティブな反応をいただけて嬉しかったですね。
本記事にて、BASEの開発の進め方や具体的なプロジェクトの内容について理解を深めていただけましたら幸いです。
ちなみに組織体制については下記の会社紹介資料に記載しておりますので、ぜひご覧ください。
BASEでは、引き続きエンジニアを積極的に採用しています！ご興味を持たれた方はぜひ下記の求人をご覧ください。
