ヤフーは2020年から、オンラインを前提に、社員一人ひとりが時間や場所にとらわれない働き方を実現しています。
それに伴い、ビジュアルデザインやUI設計を行うデザイナーの働き方も変化しました。コロナ禍前のように、サービスの企画担当者やエンジニアに、その場で仕様を確認したり相談したりしながらデザイン作業を進めることが難しくなったのです。
ヤフーでは、オンライン環境でもスムーズにモノづくりを進めることを目的に、「モブデザイン」を実施しています。モブデザインのメリットや進め方、実施する際に心がけたいことなどについて、担当者に聞きました。

- 武田 香奈子(たけだ かなこ)
- 2008年入社。Yahoo!ニュース、Yahoo!ファイナンス、Yahoo!検索、Yahoo! JAPANアプリなどのビジュアルデザイン、GYAO!のアートディレクターを経て、現在はCTO室デザイン横断部にて主にデザイン業務を効率化させ、デザインの品質向上につながる取り組みを担当している。
モブデザインとは、そのメリット
オンライン環境でUI設計やデザインを行う場合、たとえば「『ここ』を修正してほしい」の「ここ」がどこなのかを伝えるためには、該当部分の画面キャプチャーを撮り、注釈を入れてからSlackで送る…などの作業が必要になっていました。

モブデザインは、多職種のプロジェクトメンバーを集めて、同じ画面を見ながらその場でデザインを確定させる手法です。もちろん、その1回のミーティングでは確定しない場合もありますが、モブデザインを行うときは、各自が「この場でデザインを完成させる」という意識で参加することが重要です。
たとえば、短期間でリリースしなければならない突発案件が発生し、タスクフォースで組まれたチームで作業するような状況で、特にモブデザインの手法が効果的になると思います。
モブデザインでは「多職種で作業すること」にこだわる必要はありません。複数のデザイナー同士でもモブデザインをすることで、よりスピーディーに品質を向上させることができます。また、たとえば企画担当者が複数人で同じパワーポイントの画面を見ながらモブデザイン形式で資料を作るなど、デザイナー以外の同じ職種同士でも活用できると思います。
※この記事では、デザイナーと多職種のモブデザインの進め方についてご紹介します

モブデザインとは
・多職種のプロジェクトメンバーを集め、その場でデザインを確定させる手法
・多職種だけでなく、デザイナー、企画担当など同職種でも実施できる
モブデザインのメリット
1)関係者がデザインの考え方を理解することで、スムーズに議論ができる
メンバー全員がデザインの考え方を理解することで、「このデザインを考えるためにはどういう工程が必要か」「その結果どのぐらい時間がかかるか」などについて理解できるため、議論の時間も短くなります。また、エンジニアは、そのデザインを実装する際に気をつけるべきポイントもわかった上で開発しやすくなります。
2)意思決定のスピードが速くなる
モブデザインでは、テキストでのやりとりや、複数のミーティングを経て決裁を得るなど時間がかかる合意形成を一度で行うことができます。その案件の承認者や関係者をできるだけ集めて検討できるため、下記の工程のように、スピーディーな決定ができることもメリットです。

オンライン上でのモブデザインの進め方
1)可能な限り、多くの関係者に声をかける
モブデザインを実施する時は、案件の関係者の時間調整ができる範囲で、できるだけ多くのメンバーを集めることが重要です。デザインと関係がない職種の人からも、デザインしている時には気づかなかった視点から指摘をもらえるからです。また、一緒にデザインを考えることで、デザイナー以外のメンバーも、それぞれの業務の中でデザインを意識するようになるという相乗効果も期待できます。
2)時間は最短時間を設定する
小規模な相談であれば15分ぐらいで終わらせるなど、最短時間を設定します。長時間のモブデザインはメンバー全員が疲弊してしまうため、どんなに長くても1時間以内に設定しましょう。
3)気持ちを言葉に出しながら作業を進める事も大切
モブデザイン中は、デザイナーは自分がどのようなことを考えてデザインしているのかをできるだけ伝えながら行うのがおすすめです。デザイン経緯と意図、頭の中にある作業工程やその時考えていることなどを、できるだけ言葉で参加者に伝えながら作業を進めることで参加者が理解しやすくなるため、より深い提案を受けられたり、進捗(しんちょく)を早めたりできます。
4)参加者にどんどん質問をしていく
デザイナーは、全員に意見を言ってもらえるように質問をしながら、デザインをしていく事もポイントです。もし、ファシリテーションが苦手であれば、最初は参加者の誰かにファシリテーションをお願いしてもよいと思います。モブデザインは参加者と話しながら進めるため、会話しながら考えをまとめることが得意な人に特に向いているかもしれません。

2021年に公開した「ワクチン接種キャンセル枠お知らせサービス」で実施したモブデザインの様子を、以下の動画でご覧いただけます。
モブデザインの進め方
・可能な限り多くの関係者に声をかける
・実施するときは最短時間を設定する
・気持ちを言葉に出しながらデザインする
・デザイナーは参加者にどんどん質問する
モブデザインを進めるときに意識したいこと
1)ビジュアルで共通認識できるようにする
AとBの案が出るなど、意見が割れた際は、デザイナーの経験則ではAが良いと思っていたとしても、AとB両方のデザインをいったん作って見せてみましょう。
言葉や頭の中での理解より、ビジュアルを通じて共通認識をとる方が、より比較検討がしやすくなります。なるべく、まずみんなの前で作ってみることで、コミュニケーションが円滑になると思います。
2)参加者の意見をどんどんデザインに反映しながら作っていく
モブデザインを進めるときは、デザインの細部まではこだわらず、まずはどんどん手を動かして、メンバーから出た意見をデザインに反映していきます。
このように一緒に作っていくことで、デザイナー職以外のメンバーがデザインの工程を理解でき、より活発でスピード感のあるプロジェクトチームになると思います。

モブデザイン導入のコツ
・多職種のメンバー、その案件の承認者や関係者をできるだけ集める
・実施するときは時間設定、時間配分に気を付ける
・デザイナーは自分の気持ちを言いながらデザインしていく
・どんな意見も、みんなが共通認識をもてるようにデザインを必ず作って検討する
現在、社内デザイナーのモブデザイン(&別記事で紹介しているペアデザイン)の取り組みに対する認識率は9割と高めであり、実際に実施している割合は5割という状況です。
今後も、取り入れてみたいチームを中心にサポートを実施していきます。また、全社の他職種メンバーへの展開も検討しています。
必要な状況や環境でスピーディーに取捨選択が出来る手法として、これからもペアデザインとモブデザインを推進していきます。
モブデザイン、ペアデザインのこれまでの取り組み
2021年10月19日 | DESIGN Meetingで概要説明 |
---|---|
2021年10月下旬 | 各サービスへヒアリングを行い、ペアデザイン・モブデザインの案件を決定(Yahoo!公金支払い) |
2021年11月~ | ペアデザインとモブデザインの実験的取り組みを開始 |
2022年4月~ | 実験的取り組みの数値貢献を踏まえて本格的に実施 現在は両取り組みを全社に展開し、応募者や応募PJを募って実施しながら、サービスの品質向上や業務効率改善に取り組んでいる |
【関連リンク】
- オンライン上でも先輩デザイナーに気軽に相談できる「ペアデザイン」とは
- ペアデザイン・モブデザインを導入してみませんか?品質向上やプロジェクトの効率化(Yahoo! JAPAN Tech Blog)
- ヤフーのUI/UXに対する取り組み - Yahoo! JAPANが発信している、UI/UXに対する取り組みを紹介します。