モダンアジャイルによる制作事例

受託web制作おいて、アジャイル開発の導入事例を紹介します。

Transcript

1. テクニカルディレクターの流儀 モダンアジャイルによる制作事例 2019.03.15 MASATOSHI ENDO
2. 遠藤雅俊 - CREATIVE DEVELOPER - 制作プロセスの構築/改善 - クリエイティブディレクション 〜 フロントエンド 自己紹介
3. 野村パスポート SCOPE：フロントエンド http://nomurapassport.com/ URL：
4. ブルークラウド SCOPE：ディレクション、デザイン、フロントエンド https://www.blue-cloud.co.jp/ URL：
5. 葉山シャツ SCOPE：フロントエンド https://www.hayama-honten.com/ URL：
6. マッチングエージェント SCOPE：ディレクション、フロントエンド https://www.matchingagent.co.jp/ URL：
7. ミミクリデザイン SCOPE：ディレクション、フロントエンド https://mimicrydesign.co.jp/ URL：
8. 本日のテーマ モダンアジャイルによる制作事例
9. モダンアジャイルとは？ そもそも、アジャイルって？
10. ウォーターフォール型 アジャイル型 アジャイルとは？
11. ビジネスデザイン チーム クラフトマンチーム ブランドストラテジー チーム https://www.don-guri.com/recruit/community/ DONGURIのコミュニティについて： ビジネスデザイン チーム クラフトマンチーム ブランドストラテジー チーム https://www.don-guri.com/recruit/community/ DONGURIのコミュニティについて：
12. モダンアジャイルとは？ Agile 2016 の基調講演で発表されたコンセプト ・人々を最高に輝かせる ・安全を必須条件にする ・高速に実験&学習する ・継続的に価値を届ける
13. - エンジニア - デザイナー - コンサルタント - クライアント - 使う人(エンドユーザー) プロダクト - 使いやすい 関わる人全てを幸せに - なんか好き！最高だよね - 良い成果が出た - 一緒に仕事できてよかった -やりたいことができる/得意なことができる -新しいことに挑戦できる 人々を最高に輝かせる
14. 安全を必須条件にする デザイナー エンジニア 対等 対等 クライアント DONGURI - ここでもか！！という印象 心理安全性 - 気兼ねなくコミュニケーションをとれる - 失敗を恐れず、チャレンジできる
15. 高速に実験&学習する 継続的に価値を届ける 小さく失敗できる環境があり、 フィードバックループをまわし続ける仕組みがある - ソリューションのアップデート - ビジネスの変化に対応しやすい、開発体制や設計
16. モダンアジャイルやってみた！
17. ビジネス領域 ビジネスデザインチーム クリエイティブ領域 ブランドストラテジーチーム ナレッジマネジメント イシューマネジメント 週次スプリント PO 高田：スクラムマスター 遠藤：クリエイティブデベロッパー バックログ追加 ステークフォルダーマネジメント ビジネス設計 仮説検証/リサーチ イシューバックログ 価値検証 ・プロトタイプ作成 ・ワークショップ ・ファシリテーション 引合い ソリューション設計 タスクバックログ スプリントバックログ ・ワイヤーフレーム ・キービジュアル ・トンマナ ・コピーなど クライアントMTG 概念
18. ステークフォルダーマネジメント ビジネス設計 リーン開発 仮説ドリブンで、価値を見極める （正しいことをする） スクラム開発 イシュードリブンで、状況に対応しながら価値を実現する （正しく実行する） 仮説検証/リサーチ イシューバックログ 価値検証 PO ナレッジマネジメント イシューマネジメント ・プロトタイプ作成 ・ワークショップ ・ファシリテーション 高田：スクラムマスター 遠藤：クリエイティブデベロッパー バックログ追加 週次スプリント ソリューション設計 タスクバックログ スプリントバックログ ・ワイヤーフレーム ・キービジュアル ・トンマナ ・コピーなど クライアントMTG 引合い 概念
19. 実例
21. チームメンバー 早川将司 ビジネス戦略を担当 吉田直記 アートディレクター デザイン、撮影周り 遠藤雅俊 PM、実装周りを担当
22. - コーポレートサイトリューアルしたい - 3/13の2周年に公開したい ビジネスフェーズ1
23. - ヒアリング （客先、SNSで） - サイトの目的・導線・要件 - 懸念点 - 簡易サイトマップ ビジネスフェーズ2
24. ビジネスフェーズ：資料
25. クリエイティブとの連携、タスクの洗い出し
26. jiraで管理 - 懸念されるイシューの積み上げ イシューをチームで共有することで、 やること、やる理由を明確にする。 メンバーのたタスク量と担当者を明確にする。 - 想定されるタスクのざっくり割り出し
27. スプリント
28. スプリント チーム全員で実施しており、 イシューを消し込むための、タスク処理ができているかFB し炎上を防ぐ。（正しく実行されているかを見る場。） また、他メンバーの進め方なども見れるので、プロジェクト マネージャーのナレッジシェアともなっている。 - 次1週間で行うタスクや懸念点を報告する
29. クライアントMTG
30. 初回MTG ・ワイヤーフレーム ・サイトトーン ・キービの方向性
31. 初回MTG ワイヤーフレーム サイトトーン
32. 初回MTG キービジュアルの方向性
33. その結果 初回MTG
34. ワイヤーフレーム　→　ほぼOK サイトトーン　→　OK キービの方向性　→　・・・ 初回MTG
35. “視点を変える”ってのがいい、しかし 気づくか気づかないのギリギリでいい。 知的なものがいい。 初回MTG
36. ビックイシュー① 初回MTG ミミクリを体現するモチーフ選定の 難易度が東大レベル
37. 対策 初回MTG キービジュアルと他デザインを分離してすすめる。 キービジュアルはローンチ間際まで認識合わしながらゆっくり と進めていく方針へシフト。
38. 2回目MTG ・キービの方向性
39. 別資料 2回目MTG
40. 流石DONGURIさん！！ アイディアとメタファ＋ビジュアルの 落とし込みが秀逸すぎる。 ただ、ウニ案に決めて、経営的に大丈夫かを
 冷静に判断したいので、少し待ってくれ。 2回目MTG
41. ビックイシュー② 2回目MTG やりすぎた！
42. 3回目MTG ・トップデザイン/下層デザイン1P ・プロトタイプ
43. 3回目MTG
44. 3回目MTG
45. 3回目MTG プロトタイプ http://mmc.don-guri.com/
46. 4回目MTG前
47. ビックイシュー③ 4回目MTG前 撮影が必要になり、 デザイン工数を圧迫
48. 対策 4回目MTG前 下層のデザインをしない方向にシフト 必要なコンポーネントデザインのみ行い、WFを元に実装。
49. 結果 4回目MTG前 ・遅延を挽回 ・撮影できたことで、クオリティのUP
50. 4回目MTG
51. 4回目MTG
52. ３/13公開 https://mimicrydesign.co.jp/
54. まとめ
55. モダンアジャイル　＝　みんなハッピー
56. END
57. ・スクラムをざっくり説明するときのスライド https://qiita.com//halhorn/items/5cf7d28034ad9132d311 スクラムをざっくり説明するときのスライド ・Engineering Manager Advent Calendar 2018 https://qiita.com/advent-calendar/2018/em アジャイル系の開発体制のはなしや、組織づくりの話が盛り沢山 ・モダンアジャイルに関して http://enk.hatenablog.com/entry/2017/02/10/200841 モダンアジャイルの概念などがまとめてある記事 ・私の考えるプロダクトマネジメントとUXデザインの関係 https://note.mu/taketetsu1982/n/n2e431592eade POとUXに関しての良記事 ・【Po dc as t】 EMF M https://anchor.fm/em-fm/episodes/ep8--CT OV PoE --takoratta-e2kko3 アジャイル、組織論 、マネ ジメ ント論 、採用 など幅広 く語られ てい る。 ・エ ンジニ アリ ング組織論へ の招待 アジャイルが必要 になった背景 やマ インドが書かれ てい る ・イシューからはじめよう スプリ ント をタ スクマネ ジメ ントから イシューマネ ジメ ント に変え る時 の参考 ・エ ンジニ アのため のデザイン思 考入門 w eb制作 のプロセ スを「お客さん に提案 しに行 く」から「お客さん と作 る」へと シフト するた めのきっかけ となった本 ・カ イゼ ン・ジャーニー モダンアジャイルのプ ラクティ ス