モブデザインによる多職種チームのコミュニケーション改善 #yjtc
4.3K Views
February 02, 22
スライド概要
ヤフーは昨年「ワクチン接種キャンセル枠お知らせサービス」を公開しました。多くの関係者が存在するプロジェクトでありながら、リモートワーク環境下での協業、高いスピード感が必要となるプロジェクトでした。本セッションではこのプロジェクトの成功につながった「モブデザイン」という取り組みについて、その効果やうまく運用するためのポイントを紹介します。実際にモブデザインを行っている様子もご覧いただけるので、特に多職種チームでスピード感のある意思決定をしていくことに課題感をお持ちの方へのヒントになればと思います。
Yahoo! JAPAN Tech Conference 2022は2022年2月3日、4日に開催しました。
https://techconference.yahoo.co.jp/2022/
アーカイブ動画はこちらからご覧ください。
https://youtu.be/lmsY2uCP6lY
2023年10月からSpeaker Deckに移行しました。最新情報はこちらをご覧ください。 https://speakerdeck.com/lycorptech_jp
関連スライド
各ページのテキスト
モブデザインによる多職種チームの コミュニケーション改善 ワクチン接種枠お知らせサービス開発、SWAT-TF、その後の取り組み ヤフー株式会社 CTO室デザイン横断部⻑ ©2022 Yahoo Japan Corporation All rights reserved. 鈴⽊ ⾠顕
鈴木 辰顕 CTO室デザイン横断部長 2005年新卒入社。 社内ベンチャー制度から、2014年にリッチラボ株式会社を 設立、代表取締役社長就任。 国内外の広告賞やインター ネット関連アワードを多数受賞経験するとともに、Yahoo! JAPANにおいて広告表現に関する多数の特許を取得。 ©2022 Yahoo Japan Corporation All rights reserved. ©2022 Yahoo Japan Corporation All rights reserved.
モブデザインとは︖ ヤフー社内では、３名以上で同時にデザイン ワークを⾏うことと広く定義しています。 ©2022 Yahoo Japan Corporation All rights reserved. ©2022 Yahoo Japan Corporation All rights reserved.
ヤフーのデザイナーの近況 集合知のデザインを当たり前に モブデザインを通じ ヤフーの全社員をデザインに関わらせる ©2022 Yahoo Japan Corporation All rights reserved.
背景 ・リモートワーク環境 ・コラボレーションデザインツールの⼀般化 デザイナーの働き⽅と考え⽅も、変化させていく ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠お知らせサービスの開発 ©2022 Yahoo Japan Corporation All rights reserved.
SWAT-TF（スワット・タスクフォース） エンジニア デザイナー ディレクション ©2022 Yahoo Japan Corporation All rights reserved. ⽬的 事業成⻑における重要案件に対して、迅速かつ安定的な ⽀援を⽬指す 組織 多様な案件に対応できる能⼒、経験をもったメンバーを 全社から選出、兼務構成 構成⼈数 エンジニア23名、デザイナー6名、ディレクション3名
メンバー 安⽥ 健志 武⽥ ⾹奈⼦ ⽥中 愓 駒⽊ 快⽐古 企画 デザイナー デザイナー エンジニア ©2022 Yahoo Japan Corporation All rights reserved.
企画から⾒たモブデザイン ~ワクチン接種枠お知らせサービスにおけるFigmaの利⽤について~ ヤフー株式会社 SR推進統括本部 CSR推進室 安⽥健志 ©2022 Yahoo Japan Corporation All rights reserved.
安田 健志 SR推進統括本部 CSR推進室 2005年ヤフー中途入社。ヤフートップページのプロジェクトマネー ジャーとして2008年のリニューアルや2011年の東日本大震災対応を 経験。2012年にDeNAに転職するも、2017年にヤフーに復帰。 以降「防災模試」「防災ダイバーシティ」「3.11企画」に携わる。 災害のみならず「聞こえる選挙」「ワクチン接種枠お知らせサービ ス」などの社会課題を解決するサービスも担当。 最近は寒いので、飼い犬と一緒に寝ることに幸せを感じてます。 ©2022 Yahoo Japan Corporation All rights reserved. ©2022 Yahoo Japan Corporation All rights reserved.
このセッションについて モブデザイン実施の対象となった「ワクチン接種枠お知らせサービス」の 概要やプロジェクトの性質についてご説明します。 ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. ワクチン接種枠お知らせサービスとは 2. プロジェクトの性質 ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. ワクチン接種枠お知らせサービスとは 2. プロジェクトの性質 ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠お知らせサービスとは 2つの課題を解決したいという想いから⽣まれたサービス ユーザー 接種会場 2つの 社会課題 接種予約が なかなかできない … ワクチンが 余ってしまう… 写真・画像：アフロ ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠お知らせサービスとは LINE上で最⼩限のSTEPでワクチン接種が可能になるサービス ワクチン接種枠 お知らせサービス ユーザー 接種枠通知 接種枠予約 接種会場 接種枠登録 予約通知 LINE予約画⾯と⾝分証明書を会場で確認し接種 ワクチンを 接種できた！ ワクチンを廃棄 せずに済んだ！ 写真・画像：アフロ ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. ワクチン接種枠お知らせサービスとは 2. プロジェクトの性質 ©2022 Yahoo Japan Corporation All rights reserved.
PJの性質 １︓スピードが要求される 2021年7⽉頃PJ発⾜ 2021年7⽉20⽇リリース スピードが要求されるPJ ©2022 Yahoo Japan Corporation All rights reserved.
PJの性質 ２︓前例/実績がない LINE公式アカウントの活⽤ リッチメニューの検討・実装 LINE上で完結するサービス ⼿探りでの進⾏ ©2022 Yahoo Japan Corporation All rights reserved.
PJの性質 ３︓コミュニケーションの質が問われる オーナー 事務局（社⻑室） 川邊 法務担当者 PM PMO ユーザー 会場関係 ユーザーコミュニ ケーション担当 会場調整担当 社内接種担当 カスタマーサポート 安⽥ 松本 広報担当者 プロダクト デザイナー ⽥中・武⽥（CTO室） 技術監修 駒⽊（SWAT） 藤江（コーポレート技術） エンジニア エンジニア セキュリティ担当者 誘導（Y!くらし担当者） 誘導（YTOP担当者） 全社からメンバーが集められ、協働する必要があった ©2022 Yahoo Japan Corporation All rights reserved.
モブデザインマインドの創出に向けて 途中経過デザインを積極的に共有 ヤフー株式会社 CTO室デザイン横断部 ©2022 Yahoo Japan Corporation All rights reserved. 〜私のマインドの変化〜 武⽥ ⾹奈⼦
武田 香奈子 CTO室デザイン横断部 テレビ編集会社・デザイン会社・Webデザイン会社などを経て、2008年に中 途入社。 メディア系サービスを幅広く担当した後、エンタメ領域全体のアー トディレクターに就任。 産休後、検索サービスなどを担当し、現在はデザイ ンを横断的に管轄する部署にて、デザイナーの取り組みを企画推進していま す。 数値を考慮したUX提案、ビジュアルデザイン、コーディングまで一貫して作 業するのが得意です。 趣味はロードバイクです♡ ©2022 Yahoo Japan Corporation All rights reserved. ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. MTGにおけるモブデザインマインド 2. モブデザインのスピーディーさ 3. メンタル⾯も伝わるモブデザイン ©2022 Yahoo Japan Corporation All rights reserved.
１、MTGにおけるモブデザインマインド 必要最⼩限が参加 普段 ＜全員ビデオオフの場合もある＞ ビデオオフ ビデオオフ ビデオオフ 企画 エンジニア デザイナー 関係者全員が参加 ＜全員が常にビデオオン＞ 今回 社⻑室 ©2022 Yahoo Japan Corporation All rights reserved. 営業 ⼈事 エンジニア セキュリティ 法務 デザイナー
2. モブデザインのスピーディーさ 職域接種会場 ©2022 Yahoo Japan Corporation All rights reserved. ! ? ! 社⻑室 営業 未接種ユーザー QR ⼈事 エンジニア セキュリティ ? 法務 デザイナー
2. モブデザインのスピーディーさ その場でFIXしない 普段 Mtg後 修正してから 再レビュー フィードバック 企画 デザイナー その場でFIX 今回 フィードバック 意見を反映して 進めていく デザイナー 社⻑室 ©2022 Yahoo Japan Corporation All rights reserved. 営業 ⼈事 エンジニア セキュリティ 法務
3. メンタル⾯も伝わるモブデザイン 何歳以上の ユーザーを 対象とする か︖ ⼤変そうだ な・・何か お⼿伝いし たいな スケジュー ル的に⼤丈 夫かな︖︖ ⾜りてない ページ、作 る時間ある かな︖ デザインも htmlもひと りで⼤変そ う・・ 重要なものは この位置にし てみてはどう か︖ 両親の許可な く接種出来て しまわない か︖ ! ! 社⻑室 営業 ⼈事 エンジニア セキュリティ 法務 課題を持ち帰らずその場で決定していく ©2022 Yahoo Japan Corporation All rights reserved. デザイナー
SWAT-TF（スワット・タスクフォース） モブデザイン導⼊までの流れと エンジニア視点でのメリット ヤフー株式会社 ヤフー株式会社 CTO室SWAT CTO室SWAT ©2022 Yahoo Japan Corporation All rights reserved. ⽥中 暢 駒⽊ 快⽐古
出動要請がきて、３営業⽇後に稼働 SWAT-TF デザイナー・⽥中 エンジニア・駒⽊ 多様な案件に対応できる経験と能⼒が求められる ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. ⾃⼰紹介 2. モブデザイン導⼊までの流れと エンジニア視点でのメリット ©2022 Yahoo Japan Corporation All rights reserved.
田中 暢 CTO室SWAT TF 普段はYahoo!ニュースで、UIUXデザインやフロン トのコーディングなどを担当。 兼務でCTO室のSWAT-TFに所属。 趣味：油絵を描いてYouTubeで配信すること ©2022 Yahoo Japan Corporation All rights reserved. ©2022 Yahoo Japan Corporation All rights reserved.
SWAT-TFのスキルセット デザイナー ⽥中 暢 他職種の経験 • プロジェクトマネージャー • フロントエンド開発 認定⼼理⼠ • 脳科学をベースにしたUIUXデザイン • 瞑想 ©2022 Yahoo Japan Corporation All rights reserved.
駒木 快比古 CTO室SWAT TF 普段は課題を横断的に解決する技術戦略部として、 バックエンドの開発を担当。 兼務でCTO室のSWAT-TFに所属。 好きな言語・・・PHP ©2022 Yahoo Japan Corporation All rights reserved. ©2022 Yahoo Japan Corporation All rights reserved.
SWAT-TFのスキルセット エンジニア 駒⽊ 快⽐古 開発 • バッチ処理やAPI など、バックエンドを設計から開発まで 運⽤ • システム障害や脆弱性など、問題が発⽣したときに⽕が付くタイプ ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. ⾃⼰紹介 2. モブデザイン導⼊までの流れと エンジニア視点でのメリット ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠開発プロジェクトでの役割 熱気と混乱を感じる ⼈もサービスも始めましての状態で、ドキドキ …してる場合じゃなかった。。 ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠開発プロジェクトでの役割 サービスを触りながら、導線図をFigmaで作成 ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠開発プロジェクトでの役割 それとなく、モブデザインへ メンバーと話す時は、Figmaで作った改善イメージを⾒せる メンバーからの意⾒を、その場で反映 伝えたいことが伝わった︕という雰囲気ができる ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠開発プロジェクトでの役割 巨⼤組織でのモブデザイン導⼊事例 Yahoo!ニュースはデザイナー29名、企画・エンジニア含 めると、約170名の部署 • 2年ほど前に、SketchからFigmaへ移⾏を開始 • 企画、エンジニアを巻き込んだモブデザインが徐々に 浸透 → この経験があったから、モブデザインを薦められた ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠開発プロジェクトでの役割 今までのプロジェクトでは 職種間での⼿戻り 1. デザイナーが画⾯を作成後、エンジニアに連携 2. エンジニアがバックエンドの調査・設計 → 実現困難な場合、デザインの変更依頼が発⽣ ©2022 Yahoo Japan Corporation All rights reserved.
ワクチン接種枠開発プロジェクトでの役割 職種間でモブデザインを⽤いた場合 データの流れを整理してモブデザイン その場で実現可否を相談しながら反映 ⼿戻りなく意思決定をすすめられる ©2022 Yahoo Japan Corporation All rights reserved.
企画視点でのモブデザインのメリットと注意点 1.Figmaの利⽤⽅法 2.環境の重要性 3.まとめ ©2022 Yahoo Japan Corporation All rights reserved.
Figmaの利⽤⽅法 コミュニケーションの質の向上ために ©2022 Yahoo Japan Corporation All rights reserved.
Figmaの利⽤⽅法 スピード最速化のために ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. 利⽤⽅法 2. 環境の重要性 3. まとめ ©2022 Yahoo Japan Corporation All rights reserved.
環境の重要性 ツールや⼿法の導⼊だけではダメ 1.⾃分事化するための意識の変化 2.意⾒を⾔い合える空気の醸成 • 問う • 否定だけではなく改善案 • 巻き込む • 理由を添えて説明をする 毎⽇の朝会実施で上記2点を実施 ©2022 Yahoo Japan Corporation All rights reserved.
環境の重要性 開発フェーズなどにも影響を受ける可能性 フェーズ ⽴ち上げフェーズ チーム規模 5名程度の⼩規模チーム その他 作るものが明確に決まっていた デッドラインも定められていた 前提条件が変わればやり⽅も変わる ©2022 Yahoo Japan Corporation All rights reserved.
アジェンダ 1. モブデザインの活⽤⽅法 2. 環境の重要性 3. まとめ ©2022 Yahoo Japan Corporation All rights reserved.
まとめ モブデザインでもたらされたもの 1. デザイン / クリエイティブ作成の付帯業務の最⼩化 （クリエイティブ業務専念 / コミュニケーションコスト最⼩化） 2. 意思決定の最速化 モブデザインで注意すること 1.ツールやモブデザインという⼿法を活かせるPJ運営が必要 2.⽴ち上げフェーズ ＆ 少⼈数のPJでマッチするが、環境によっては、別の最適な⽅法も 職域横断で優れたUIUXの提供を ©2022 Yahoo Japan Corporation All rights reserved.
モブデザインの導⼊効果 関係者が多いほどこの⼯程が多くなる 普段 デザイン 作成 レビュー 修正 レビュー 準備 再 レビュー 修正 レビュー 準備 デザイン 責任者 レビュー SMPM、企画、エンジニア、などと同時レビュー＆その場で修正 今回 デザイン 作成 ©2022 Yahoo Japan Corporation All rights reserved. モブデザイン レビュー＆その場で修正 （複数ページ同時対応）
©2022 Yahoo Japan Corporation All rights reserved.