「数え切れないほどの試行錯誤と協力」を経て──新Web版メルカリのリリースを担当したメンバー21名の“今の気持ち”

先日、Web版メルカリを大幅にアップデートしました。その経緯についてはメルカリエンジニアリングに寄稿されているのでぜひご覧ください。

で、ですね。

ここでお伝えしたいのは「この開発にはたくさんのメンバーが関わっていたこと」です。実はこのプロジェクト、長い期間を経てリリースされたものだったりします。そこには多くのメンバーによる試行錯誤がありました。

今回のメルカンでは、Web版メルカリのアップデートに関わったメンバー21名に「今の気持ちは?」と質問し、返ってきたコメントをまとめてみました。
※外国籍メンバーも多く参加していたプロジェクトだったため、コメントは日英併記にしています

コメントを寄せた担当メンバーたち(一部)

@morishy:無事にリリースできてよかったです!Web版メルカリは、見た目が長い間更新されていなかったり、デザインの元データがなかったり…とにかくいろいろありました(笑)。大変でしたが、PMやエンジニアの方と協力しながら、細かい仕様をカバーしつつ進められました。デザイン観点では、アプリとWebサイトで同じ体験を届けるという大方針がありました。しかし、アプリとWebサイトではお客さまとのタッチポイントやモチベーションが異なります。またモバイルとデスクトップでも体験が異なるので、画面設計をするのが難しかったです。でも結果的にとてもいい経験になりました。個人的には、ダークモードや多言語化対応のデザインは初めてでした。まだまだブラッシュアップしたいところはあるので、引き続き頑張りたいです!
First of all, I’m glad we were able to release it successfully! It was a tough job, but I think we were able to proceed well with the design and specifications while working with PM and engineering members. From a design point of view, we had a general policy to deliver the same experience for both the app and the website. However, the touch points and motivations are different between the app and the website. It was also difficult to design the screens while thinking about how it would be different on a smartphone and a computer. But it turned out to be a good experience. Personally, it was my first time designing for dark mode and multiple languages. I still have a lot I want to polish, so I’ll keep working on it!
@david:このプロジェクトは2020年2月にエンジニア2名、テックリードとデザイナー、プロダクトマネージャーそれぞれ1名ずつでタスクフォースとして立ち上がりました。そしてWeb版メルカリをどう再構築するかを議論していたんです。そして1年半後である2021年8月には、50名近くのメンバーが参加し、本番リリースを迎えました。そこには、Web Componentsで実装されたDesign Systemも含まれています。これは素晴らしいことです!優秀なメンバーと一緒に、メルカリの基盤づくりに貢献できたことは光栄です。
This project was launched in February 2020 as a task force with two engineers, one tech lead, one designer, and one product manager. We were discussing how to restructure the web version of Mercari. And a year and a half later, in August 2021, we had a production release with nearly 50 members participating. This includes the Design System, which was built using web components. That’s great! I am honored to have been able to contribute to the foundation of Mercari with such talented members. Thank you very much!
@vwxyutarooo:メルカリでWebの体験を新しくするプロジェクトを始めて3年以上になります。正直なところ、最初にこのプロジェクトを見たとき、受け入れるのには苦労しました。しかし、実際に@kwakasaさんと@1000chさんとともにプロジェクトの理解を進めていくなかで、とても理にかなったプロジェクトだと賛同することができました。スモールスタートなプロジェクトでしたが、世界中から集まった多様で優秀なエンジニアを巻き込みながらとてもいいチームを作ることができました。新しいWeb版メルカリはアプリと同レベルの機能を持つことを最初のゴールとしているため、非常にシンプルな技術スタックで構成されています。このシンプルさを保ちながらエンジニアにとってもお客さまにとってもいい体験になるような技術的チャレンジも、今後はしていきたいと思っています。
I have been working with projects to update the web product for over three years now. To be honest, when I first saw this project, I struggled to understand it, because the project I had been working on was intended to be something similar. However, as I clarified the details by talking with @kwakasa and @1000ch, it turned out that this project did make sense to me.
It was a small team at first, but we were able to make it into an awesome team while involving engineers from various countries. Since we aimed for feature parity against Mercari’s native apps, our technical stack is quite simple. While maintaining this simplicity, I hope to take on more bold challenges in order to provide good experiences for developers and our users.
@urahiroshi:私はおもにインフラやバックエンド、認証機能などを担当していましたが、このプロジェクトを通じて多くのチャレンジを行うことができました。まだ既存のWebのインフラを完全に置き換えられておらず課題は残っているのですが、新しいWeb版のメルカリを公開できたことは大きな一歩になったと思っています。技術的な詳細については、エンジニアリングブログなどで随時発信していければと思っています。
I was in charge of infrastructure, backend, and features such as authentication, and I was able to take on a lot of challenges through this project. We still have some problems to face because we are in the middle of replacing the old web, but I think it is a great milestone that we were able to update the web version of Mercari. I want to publish an article that describes the technical details related to this project on our engineering blog.
@homer:私も参加していたDesign Systemによってこのプロジェクトを無事に完遂させられたことがうれしいです。これからも、コンポーネントを使って、Web版メルカリをより良くしていきたいです。そのための挑戦は、まだまだたくさんあります!そして将来的には、コンポーネントが他のプロジェクトでも役立てられればと思っています。
I am happy that we were able to complete this project successfully with the Design System, in which I also participated. I would like to continue to use components to make the web version of Mercari even better. There are still a lot of challenges we face in order to do that! And in the future, I hope that the components will be useful for other projects as well.
@kwakasa:実は、@davidさんが入社する前からWeb版メルカリのアップデートについてさまざまなメンバーと話し合いを重ねていました。夢を見ていたような感覚です(笑)。もちろん完遂できると確信していましたが、改めてこれまでの日々を振り返ってみると圧倒されます。それくらい、今回のリリースは私たちにとって大きなマイルストーンになりました。
メルカリは、規模の大きなマーケットプレイスです。Web版メルカリのアップデートによって、より多くのお客さまへサービスが広がることが今から楽しみです。みなさん、お疲れさまでした。ありがとうございました!
Actually, I had been discussing with various members about updating the web version of Mercari before @david joined the company. I felt like we were dreaming (laughs). Of course, I was confident that we could complete the project, but looking back on this time again, I feel really emotional. That’s how big a milestone this release was for us.
 Mercari is a large marketplace, and I am looking forward to seeing the web version of Mercari updated to reach more and more users. Thank you all very much for your hard work!
@sahil505:これは私がゼロから関わってきたプロジェクトでした。また、私にとってメルカリで2つ目のプロジェクトでもありました。正直、このプロジェクトへのモチベーションについて当初は複雑な部分もありました。しかし結果的に強く賛同し、開発に向き合うことができました(笑)。このプロジェクトの最大の収穫は、お客さま体験をアップグレードできたこと、そしてアプリが提供しているサービス体験へ近づけられたことです。また、アクセシビリティや多言語化のための基盤も前提に開発を進めるなど、技術的側面にも力を入れています。特に多言語化については、多文化チームのメンバーの1人として得るものが多かったです。この基盤を使って、Web版メルカリをより拡大させていきたいです!
This was a project that I was involved in creating from scratch. It was also my second project at Mercari. Actually, my motivation for this project was mixed at first. But in the end, I strongly agreed with the direction of the project and was able to tackle the development (laughs). The biggest benefit of this project was that we were able to upgrade the customer experience and move closer to providing the same service experience as the app. We are also focusing on the technical aspects of the project, such as developing a foundation for accessibility and internationalization. As a member of a multicultural team, I have gained a lot from the internationalization of the web product, and it definitely has benefits from a developer productivity (DX) perspective. I would like to use this infrastructure to further expand the web version of Mercari!
@mtomato:私はNginxやGatewayなどのインフラを担当していました。入社したのは2020年4月で、当時は右も左もわかりませんでした。厳しいスケジュールでしたが、多くのメンバーに助けられながら、コントリビュートできたと思っています。メルカリは大きな企業になりつつあります。ですが、今回のプロジェクトでは規模感を感じさせない意思決定の風通しのよさと、新人を育てる土壌があることに感動しました。ありがとうございました!
I was in charge of infrastructure such as Nginx and Gateway. I joined the company in April 2020, and at that time, I didn’t know my way around. It was a tough schedule, but I think I was able to contribute with the help of many other members. Mercari is becoming a larger company. However, in this project, I didn’t feel like it was too big at all; I was impressed by the openness of the decision-making process and the foundation for newcomers to grow. Thank you very much!
@mmiy:@kwakasaさんも話していましたが、このプロジェクトは1年半ほどかかりました。メルカリでは比較的小さなFeatureをスピーディに開発し、リリースしていくのが主流です。そのなかで、これほど規模が大きなプロジェクトを実施してリリースできたこと自体が大きな成果だと私は思っています。このプロジェクトは2019年11月に「Web Reborn」という名前でスタートしました。多くのステークホルダーと議論しつつ、Design System、アクセシビリティや多言語対応を行い、将来の基盤となるように多くのことにも挑みました。私としてはこういった新しいことをたくさん「提案してみた」にも関わらず、多くのメンバーがそれらを前向きに検討して完遂してくれました。Web版メルカリは、間違いなくメルカリにとって大きな財産になっています。みなさんのおかげです、ありがとうございました!
As @kwakasa mentioned, this project took about a year and a half to complete. Mercari has a culture of speedy development and release. The fact that we were able to sit down and work on such a large-scale project is, in my opinion, a major achievement. This project was launched in November 2019 under the name “Web Reborn.” While discussing the project with many stakeholders, we took on many challenges such as the design system, accessibility, and creating a foundation for multilingualization. The web version of Mercari has definitely become a great asset for Mercari. I couldn’t have done it without all of you. Thank you very much!
@1000ch:メルカリへ入社したときから、もともとWeb版メルカリをよくしたい気持ちは持っていたのですが、メルペイにジョインしたこともあり機会を持てずにいました。そんな中、2019年の10月に採用活動で台湾を訪れたときに、火鍋屋🔥で@kwakasaさんとWeb版メルカリの話をしてこのプロジェクトに関わることになったのを思い出しました。プロジェクトの立ち上げにも紆余曲折があり、チームも初めは小さかったのですが、採用活動の甲斐もあってたくさんのエンジニアがジョインしてくれて、1年半かけて無事にリリースに漕ぎ着けることができました。リリースする直前は特に胃が痛かったのですが、今は少しほっとしています。Web版メルカリを刷新できたことは、メルカリのビジネスとエンジニアリングの両面にとって、大きな意味を持つと思っています。まずはリリース、お疲れさまでした!
I originally wanted to contribute to the web version of Mercari when I first joined, but I ended up joining Merpay and didn’t have such an opportunity. After a while, I finally got involved when I went to Taiwan to attend a hiring event and talked with Wakasa-san about Mercari Web at a hotpot restaurant 🔥. We faced several complications and had only a few members in the initial phase of the project. But lots of engineers joined as the result of hiring efforts, and finally we launched the new Mercari Web after a year and a half of work. I was so nervous my stomach hurt, especially right before the release, but I’m a little relieved now. I think the fact that we upgraded Mercari Web is really meaningful from business and engineering perspectives, and I hope we can make Mercari Web even better. Thanks to all!
@paipo:僕は、トランザクションページやページ移行するための最初のイメージ設計を担当していました。既存の取引ページの実装をそのまま流用するのがいいのではないかと考えたこともありましたが、最終的にその手段は選びませんでした。プロジェクトを進める間に組織変更もありましたが、そのなかで今の方法を選びました。それは正しかったと今では思っています。素晴らしいプロジェクトに参加できてよかったです、ありがとうございました!
I was in charge of the initial image design for the transactional pages and page migrations, and while I thought it might be a good idea to reuse the existing transaction pages, I ultimately chose not to. There were some organizational changes during the course of the project, but within that, I chose the current method. I now believe that it was the right choice. It was a great project to be a part of; thank you!
@tracy:このプロジェクトを知ったのは、入社後半年ほど経った頃でした。そのときは驚いたのですが、実は水面下でいろいろなことが動いているのだと後から知りました。たくさんのメンバーと議論しながら、このプロジェクトがメルカリにとってチャンスなのだと思ったんです。最終的に、みんなの努力でリリースすることができました。これをきっかけに、お客さまにとってよりよいサービスになることが今から楽しみです。
I learned about this project about six months after I joined Mercari. I was surprised at the time, but I later realized that there were actually many things going on under the surface. Through discussions with many members, I felt that this project was a great opportunity for Mercari. In the end, thanks to everyone’s efforts, we were able to release the product. I am now looking forward to making this an even better service for our users. Thank you very much!
@yi:私は、こういったプロジェクトに初期段階から参加するのは初めてでした。なので、様々な選択の柔軟性があったと同時に、多くのことを考慮する必要がありました。当時エンジニアは3名、PMは1名でした。技術的にもWeb Componentsで実装された Design System やダイナミックレンダリングなど、私が経験したことがないものばかりで、これらを通じて Go Boldの精神を実践してきたように思います。Web版メルカリを完璧なものにするためには、まだまだ課題がありますが、一つ一つ解決していけると信じています。何より、優秀なメンバーと一緒に仕事をすることは貴重な経験でした。彼らなくしてこのプロジェクトは達成できなかったと思います。
It was the first time I participated in such a project from the initial stage. We had lots of flexibility in our choices, but there were also many things to consider. At that time, there were three engineers and one PM. We also tried some new tech which I had never used or done before, like using web components in Design System and dynamic rendering. I feel we embodied the Go Bold spirit well. There are still some obstacles to face before we can make our website perfect, but I believe we can tackle them one by one. It was a very valuable experience to work with these talented members. Without these members we couldn’t have completed it. Thank you all!!
@zordius:私にとって、メルカリで2つ目のプロジェクトでした。Design Systemなど、新しい技術に触れられて良かったと同時に、多くの課題にもぶつかりました。そんななか、Camp体制によって良いチームで仕事ができ、解決してこれたと思っています。なにより、このプロジェクトには透明性がありました。この規模でこれほどの透明性を維持できているのはすごいことだと思います。このプロジェクトを思い出すとき、いい記憶だけが残っていると信じています(笑)。
This was my second project at Mercari, and I was happy to be exposed to new technologies such as the Design System. At the same time, I faced many challenges, but the Camp system allowed me to work with a good team and solve them. Above all, there was transparency in this project. I think it’s amazing that we have been able to maintain such transparency at this scale. I believe that when I look back on this project in the future, I’ll have nothing but good memories (laughs). Thank you very much!
@hatappi:このリリースに際して、PFAT、プリレンダリング、PWAなどなど、さまざまな技術的チャレンジがありました。これらはWebチームの努力だけで成し得たものではなく、ID Platform team、Architect team、Microservice Platform team、PRCのレビュアーなどなど、多くのチームの協力のおかげです!All for one!!
We took on various challenges in this release (PFAT, prerendering, PWA, and so on). These could not have been achieved by the efforts of the web team alone. We were only able to succeed thanks to the cooperation of many teams (ID Platform Team, Architect Team, Microservice Platform Team, PRC reviewers, and so on). All for One!!
@gary:私は一年前にジョインしたばかりで、もともとネイティブクライアント向けの取引画面の実装に関わっていました。この取引画面はWebViewで表示されるWebアプリケーションで、数年かけて次なる新しい技術スタックへのマイグレーションをしている最中でした。加えて Web の実装は、歴史的な経緯もあって何度かに渡って再実装が繰り返されていました。この新しいプロジェクトの目的は、アプリケーションを部分的にではなく全体を書き直すことでしたが、そうした背景もあり懐疑的に見られるのも無理はありませんでした。もし過去のリライトが失敗したのであれば、このプロジェクトも失敗しかねないのではないか?ありがたいことに、熱心なメンバーと一貫したお客さま体験を作るための丁寧な努力によって、プロジェクトはうまく進み、私たちはついに目的を果たすことができました。機能等価性に向けては引き続きやることがありますが、このプロジェクトは、ゼロから取り組むことがプロダクトを刷新するときに効果的であることの優れた事例になると思います。
I joined Mercari just over a year ago and was initially working on the Item Transaction Page for the native clients. This page is actually a web application rendered in a WebView, and at that time, a phased migration to a new tech stack had been underway for some number of years. In addition to this, the web client itself was also a product of numerous reimplementations dating from different times in Mercari’s history. The objective of this new project, then, to rewrite not just one part of the application but the whole thing, was understandably seen with some skepticism. If previous rewrites had failed, why wouldn’t this one also? Thankfully, with a team of enthusiastic members and efforts to create a more coherent experience for the user, the project progressed well and we were finally able to achieve our goal. From here on out we still have some way to go before we can reach feature parity with the native applications; however, I think this project can be a great example to show that starting from the ground up can be an effective strategy when rearchitecting a product.
@Nate:私がメルカリに入社したときには、すでにプロジェクトは始動していました。新しいコードベースに立ち向かうときはいつも自信を失ってしまうのですが、チームのサポートのおかげもあり、最初の週からコミットを始めることができてとても良かったと思います。プロジェクトに取り組むなかで特に良かったことのひとつは、エンジニアが議論しオーナーシップを発揮することが奨励されていることです。デザインや要件に関する疑問があれば、エンジニアは素早くそして自発的に他のチームに質問することができます。なので、エンジニアの自主性と同様にコミュニケーションも強固です。どんなプロジェクトでも浮き沈みがありますが、強力なチームで仕事をしていればゴールに到達でき、それこそが私がこのプロジェクトで最も楽しめたことです。
When I joined Mercari, the GroundUp web project was already well underway. Stepping into a new codebase is always a little intimidating, but thanks to the support of my team, I was able to start making code contributions during my first week, which was a great feeling. One of the things that I have really enjoyed about working on this project with this team is the level of discussion and ownership that engineers are encouraged to take. When questions about designs and requirements inevitably come up, engineers are able to quickly and autonomously ask their questions to other teams. So communication is strong, as well as developer autonomy. Every project has its ups and downs, but goals and release dates always feel within reach when you are working with a strong team, which is one of the reasons I most enjoy working on this project.
@russ:私はメルカリにおよそ2年前にジョインして、もともとはこの前身となる、Webアプリケーションを書き換えるプロジェクトに関わっていました。前のプロジェクトではいわゆる GraphQL サーバーを BFF として使ってサーバーサイドレンダリングをしていましたが、今回のプロジェクトは API を直接呼び出してクライアントサイドでレンダリングするという、とてもシンプルな構成でした。この単純性はローカル環境での開発を簡単なものにしてくれましたし、前のプロジェクトで2年間をかけてできなかった機能等価性に向けた実装を、素早く達成することを可能にしてくれたと思います。また、このプロジェクトに関わった多くのチームがとてもよくコミュニケーションしており、全体としてよくまとまったプロダクトを作るために、プロセスや実装に関する方向性を揃えるために Camp を超えて協力してきました。このプロジェクトがこれからも、お客さまにとって最高の体験を提供するための、生産的な環境であってほしいと思います。
I joined Mercari almost two years ago, and was originally working on the previous project to revitalize the web client. The previous project was server-side rendered and used a bespoke GraphQL BFF, whereas the GroundUp web project is a much simpler client-side rendered app that calls endpoints on the API gateway directly. This simplicity made the local development experience much easier, and I think allowed us to more rapidly reach feature parity with the current web, something that the previous project failed to do in two years. Also, the multiple teams who contributed to the GroundUp web project communicated very well, striving to align processes and implementations across camps in order to create a more cohesive overall product. I hope the GroundUp web project will continue to be such a productive environment where we can build out the best possible web experience for our users.
@yayoc:私はこのプロジェクトの途中でジョインしました。幸運にも、アーキテクチャはシンプルかつよく設計されていたので、スムーズにプロジェクトに入っていくことができました。他チーム含め、協力的なメンバーばかりで、彼らのサポートなしには、PFAT マイグレーションのような挑戦的なタスクを達成することはできなかったと思います。このプロジェクトおよびWeb版メルカリに多少なりとも貢献できて良かったですし、引き続きより良くしていけることを楽しみにしています。
I joined the team in the middle of the project. Fortunately, the architecture was already simple and well-designed, so I was able to smoothly jump into the project. Also, the members of the team, including other teams, were very supportive. Without their support, I don’t think we could have accomplished challenging tasks such as PFAT migration. I am glad that I could contribute in some way to the GroundUp Mercari Web project, and I’m looking forward to continuing to make it better.
@nekobato:プロジェクトの立ち上げからローンチまでDesign Systemの開発者として関わらせていただきました。Web Componentsを使った今回の実装は会社にとってもWeb業界にとっても挑戦的なものとなっており、無事に運用まで至ったのは非常に嬉しい限りです。また、この挑戦を長い間続けさせてくれたプロジェクトと、Design System Web を使いこなしてくれたチームのエンジニアたちに感謝です。
I was a member of this team as a developer of Design System Web from the start of this project until the launch. I’m delighted that we have implemented and shipped this challenging implementation for our company and also for the web industry. I would like to thank the project for allowing us to take on this long-term challenge and the developers who used the Design System library well.
@osamu38:私はもともとこのプロジェクトに参加する前、既存のWeb版メルカリを担当していました。最初このプロジェクトの話を聞いたときは、正直に言えば微妙な気持ちでした。自分が今までやってきたことが無駄になってしまうのではないかという気持ちがあったからです。しかしこのプロジェクトを通じてさまざまなメンバーと一緒に開発してリリースまでできたことは自分の経験としてとても良いものでした。まだまだ多くの課題がありますが、これからもこのアプリケーションをより良くすることに努めていきたいと思います!
Before I participated in this project, I was originally in charge of the existing Mercari Web. To be honest, when I first heard about this project, I had mixed feelings. I was worried that what I had been doing so far was going to go to waste. However, it was a very good experience for me to be able to develop and release with various members through this project.
There are still many challenges, but we will continue to strive to improve this application!

—–

この記事に掲載するコメントをもらうためにオンライン上で集合したのですが…とてもエモい会となりました。

しかし、Web版メルカリの進化はこれで終わったわけではありません。まだまだやりたいことは山積みです。仲間も大募集中です!気になる方は、下記のページをチェックしてみてください!

関連記事 サクッと読める!✨

「Mercari Summer Internship 2022」の募集を開始しました! #メルカリな日々

メルペイ初!QAエンジニア育成&インターンシッププログラム「Merpay QA Summer Training Camp 2022」の募集を開始します! #メルカリな日々

「Mercari Summer Internship 2021」の募集を開始しました! #メルカリな日々

関連記事 読み応えアリ✨