品質向上を目指す開発組織のデザインレビュー / SmartHR

2022.03.02 うちのデザインレビューは“ここ”を見る【デザナレVol.11】の登壇で使った資料です。
https://vivivit.connpass.com/event/239353/

プロダクトデザイナー、全力で採用しているので、少しでも興味がある方はぜひ応募してください！

■デザインレビューについてもっとお話をしたい方
https://www.vivivit.com/job-postings/7301

■一緒に働きたい！と思っていただけた場合はこちら
https://open.talentio.com/r/1/c/smarthr/pages/45038

※当日資料はGoogle Slideを使いましたが、SpeakerDeckに書き出したPDFをアップロードすると、文字表示がおかしくなるため、Keynoteで再編集して再アップロードしました。

Transcript

1. CONFIDENTIAL 品質向上を目指す
 開発組織のデザインレビュー
 2022.03.02 うちのデザインレビューは“ここ”を見る【デザナレVol.11】 小木曽 槙一 SmartHR プロダクトデザイングループ
2. CONFIDENTIAL 自己紹介
3. CONFIDENTIAL
   SmartHR プロダクトデザイングループ所属
   去年まではメイン機能開発、今年から新規開発事業へジョイン
   「デザイン」業務を中心に企画、実装まで幅広く対応
   パラレルキャリアを標榜して、副業も積極的にやってる
   妻1人とローン30ウン年の家がある
   趣味は副業先のSlackに、おもしろ絵文字を輸出入すること 小木曽 槙一 （こぎそしんいち） https://twitter.com/kgsi @kgsi
4. CONFIDENTIAL 会社紹介
5. CONFIDENTIAL すべての人が、信頼しあい、
 気持ちよく働くために。
6. CONFIDENTIAL SmartHRは、人事・労務の業務効率化を実現し、 働くすべての人の生産性向上を支える 「クラウド人事労務ソフト」です。
7. CONFIDENTIAL 今日話すこと
8. CONFIDENTIAL “デザインはデザイナーに任せておくには重要すぎる” IDEOのティム・ブラウンのTED内で述べた言葉、もともとはRaymond Loewyの言葉とされる
9. CONFIDENTIAL ソフトウェアの「デザイン」の重要性と期待値は、
 ますます高まっています。
10. CONFIDENTIAL
    この不確実性が増した世界で、優れたアウトプットは1人の知見だ けで生み出せるものではありません。
    我々がよく扱うUIデザインだけに限らず、すべての「デザイン」と いう行為に当てはまります。
11. CONFIDENTIAL 「デザイン」は「皆（みんな）の力」を使うことで、現実的で使 いやすい、理想を目指すことができます。 「デザインレビュー」とは、設計品質を高め、理想を現実に近づ ける手段のひとつです。 今回はプロダクトデザイングループが実施している
 「プロデザレビュー会」をメインに紹介します。
12. CONFIDENTIAL
    ご視聴される方は、今日のスライドを見ていただ くだけで、SmartHRのデザインレビューの知見 を「完全理解」した状態になれます。
    今日の発表が、少しでも所属される組織・個人の 刺激になれば幸いです。 「完全理解うちわ5本セット」：SmartHR Storeで販売中
 https://omise.smarthr.co.jp/products/kanzenrikai
13. CONFIDENTIAL 詳細な説明の前に... 「デザイン」とは本来何を指す？
14. CONFIDENTIAL デザイン（英語: design）とは、審美性を根源にもつ計画的行為の全般を 指すものである。意匠。設計。創意工夫。英語のdesignには本項の意味 より幅広く、日本語ではデザインと呼ばない設計全般を含む。 出典: ウィキペディア（Wikipedia）https://ja.wikipedia.org/wiki/ %E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3
15. CONFIDENTIAL “審美性を根源にもつ計画的行為の
 全般を指すもの”
16. CONFIDENTIAL
17. CONFIDENTIAL UIやモックデザイン 設計や計画全般 デザイン is
18. CONFIDENTIAL その上で デザインレビューとは？
19. CONFIDENTIAL デザインレビューとは、開発における成果物を、複数の人にチェック してもらう機会のことで、JIS（日本工業規格）やISO（国際標準化機 構）9000シリーズにおいて定義されている設計審査のことである。デ ザインレビューは本来、システム開発に限らず、工業製品開発も対象 としているJISやISOなどの規格で定義されているものを指すが、ソフ トウェア開発において一般的に行われているレビューをデザインレ ビューと呼ぶことも多い。 出典: IT用語辞典バイナリ https://www.sophia-it.com/content/Design+Review
20. CONFIDENTIAL デザインレビューとは、製品開発の工程の一つで、設計に問題がない かを担当者、担当部局以外の第三者を交えて検討すること。設計に限 らず、各工程の成果物を関係者全体で検討する活動全般を指す場合も ある。 出典: IT用語辞典 e-Words
 https://e-words.jp/w/ %E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%83%AC%E3%83%93%E3%83%A5% E3%83%BC.html
21. CONFIDENTIAL
22. CONFIDENTIAL 「デザインレビュー」を解釈
23. CONFIDENTIAL 成果物の「品質」について 精査 ・検証する儀式
 
 ...とここでは解釈します。
24. CONFIDENTIAL 品質とは何か？
25. CONFIDENTIAL “品質とは誰かにとっての価値である” ジェラルド・ワインバーグの著書 “Quality Software Management: Systems Thinking”より
26. CONFIDENTIAL 「品質」という言葉は本来主観的なもの 評価するステークホルダーによって、品質の定義はさまざま 1人のデザイナーの「主観」で出した答えが、
 客観としての「品質」の良さを証明することは難しい
27. CONFIDENTIAL プロダクトは 誰のために 作っているのか? ユーザーにとって 価値とは何か? これらの疑問を開発者（プロダクトデザイナー含め）は
 常に持つべき
28. CONFIDENTIAL ユーザー目線に立ち、常に主観を疑い、検証していく... そのためにデザインレビューが必要
29. CONFIDENTIAL デザインレビューの紹介の前に改めて... SmartHRの デザイン組織紹介
30. CONFIDENTIAL コミュニケーション デザイングループ プロダクト
 デザイングループ プログレッシブ
 デザイングループ マーケティング・ブランディングなど コミュニケーションのデザイン プロダクトに関わる デザイン ユーザーの多様性に
 関わるデザイン NEW
31. CONFIDENTIAL コミュニケーション デザイングループ プロダクト
 デザイングループ プログレッシブ
 デザイングループ マーケティング・ブランディングなど コミュニケーションのデザイン プロダクトに関わる デザイン ユーザーの多様性に
 関わるデザイン NEW
32. CONFIDENTIAL 開発組織の 主なレビューイベント
33. CONFIDENTIAL 1. スプリントレビュー 2. プロデザレビュー会
34. CONFIDENTIAL
    スプリント期間に合わせて（各チームおおよそ1週間単位）職能混 合でレビューを行う
    レビュー対象はUIデザインに限らない、すべてのプロダクトバッ クログアイテムが対象 スプリントレビュー スクラムチームと、ステークホルダーがスプリントの成果を
 レビューするイベント
35. CONFIDENTIAL 1. スプリントレビュー 2. プロデザレビュー会
36. CONFIDENTIAL
    プロダクトデザイングループが中心になって行う会
    対象はSmartHRのプロダクトデザインに関わる成果物全て
    今回はこの会を掘り下げたお話 プロデザレビュー会 デザインレビューとモブデザインを行う会
37. CONFIDENTIAL プロデザレビュー会とは
38. CONFIDENTIAL プロデザレビュー会の目的
    プロダクトを中心とした成果物の精度・品質の向上
    各プロダクトの状況把握と情報共有
    ナレッジや判断材料のシェアと標準化 出典:イメージをお楽しみください
39. CONFIDENTIAL レビュー対象
    UIデザイン
    オブジェクト、UML図
    ユビキタス言語
    組織の方針・体制
    今晩の献立... etc 出典: 時間がなかったのでいらすとや・その他
40. CONFIDENTIAL 実施内容 昨今は完全にオンラインで、毎週木曜に1時間実施 デザイナーのレビューが多めだが、職能は閉じていない、
 エンジニアやPdMからのレビュー依頼もあり 横断の取り組みとして、グループ会社の成果物レビューも実施中
41. CONFIDENTIAL レビューのやりかた
42. CONFIDENTIAL
    レビューのお題を決めるのは、原則レビュー依頼をする人
    依頼者が用意したアジェンダに従って進行する
    進行手順に決まりはない、課題、持ち込んだ人次第
    レビューのツールはFigmaの割合多め、MiroやGoogle Docs、 Spreadsheet、実装画面...など媒体は問わない
43. CONFIDENTIAL 実際のレビュー事例紹介
44. CONFIDENTIAL 事例: UIのバリデーション設計
    メインプロダクトのバリデーション機能の表示 方法を挙げた例
    フォーム内の入力項目数が長いため、通常の フォームバリデーションとは違った考慮が必要 だったのでレビュー会で意見を募ることになっ た
45. CONFIDENTIAL 事例: アクセシビリティ改善
    SmartHR UIというSmartHRの共通コンポーネン トのカラーコントラストを改善したい、という 事例
    APCAという新しいコントラストのスコア基準と いうものがあることを教えてもらいつつ、モブ デザインを実施
46. CONFIDENTIAL 事例: スペシャルサイトの設計
    Schedule - RubyKaigi Takeout 2021のUIデザイン の設計
    SmartHRがRubyKaigiのスポンサーということも あり、特別アプリのUIデザインを担当すること に
    エンジニアと協力してサイトの設計、意匠を決 めた事例
47. CONFIDENTIAL 事例: 非同期の改善案募集
    レビュー枠を待たずに非同期で改善提案が走る こともある
    レイアウトへの改善提起、意見を募って改善案 のディスッションをSlack上で実施
    こういった突発的なレビューもしばしば行われ ている
48. CONFIDENTIAL レビューで生まれる効果
49. CONFIDENTIAL
    第三者視点の気づきと多様なフィードバック
    創発的なアイデアとディスカッション
50. CONFIDENTIAL 参加する
 プロダクトデザイナーの
 生の声
51. CONFIDENTIAL
52. CONFIDENTIAL デザインレビューの 場作り
53. CONFIDENTIAL
    デザインを見るってどんな観点でみればいいの？
    レビューはどんな粒度で持っていけばいい？
    レビューを受け取ったら必ず反映しないといけない？
    レビューでは何を言ってもいいの？
54. CONFIDENTIAL 答え 我々にはデザインシステムがある
55. CONFIDENTIAL
    レビューは、レビュー依頼側がレビューで達成したい目的・目標 を設定し、レビュワーに明示する。
    レビュワーはその目的・目標に沿った成果物・コードを軸に判断 し、コメント、アドバイス・助言する。
    チームの知見や気づきを糧に品質を向上し、深遠なるインター フェースの極地にたどり着くための儀式である。 抜粋：SmartHR Design System - デザインレビューの手引#目的・目標 https://smarthr.design/products/design-process/review/
56. CONFIDENTIAL
    レビューはクオリティを高め、レビュー依頼者が気づかないこと への気づきを与えるものです。
    レビューは意見の押し付けではなく、ディスカッションです。
    レビューはあなたの考えを否定するものではありません。 出展：SmartHR Design System - デザインレビューの手引#レビューとは https://smarthr.design/products/design-process/review/
57. CONFIDENTIAL 言語化・体系化されたドキュメントがグループを支えてくれる 共通認識ができ、レビューに対して認識ズレが起こりにくくなる 前提として、メンバーみんなが泥水を啜ってきた猛者なので、
 課題感の認識合わせコストが低い...ということもある
58. CONFIDENTIAL まとめ
59. CONFIDENTIAL 昨今の「デザイン」における課題
    「品質」を担保するのは1人では難しい
    一つの観点ではどうしても客観的に見れない
60. CONFIDENTIAL デザインレビューに期待できること
    意見やフィードバック、精査によって成果物の「品質」を客観的 に向上させることができる
    参加者や職能を絞らないことで、組織全体にナレッジと判断基準 を共有できる
    お互いの知見を持ち寄ることで、スキルの底上げが可能となる
61. CONFIDENTIAL レビューを成功させるためには...
    組織のビジョン、デザインについての目線と認識を合わせよう
    思想や思考を言語化し、共有しよう
    泥水を啜って繰り返し研磨しよう
62. CONFIDENTIAL 最後にお約束の宣伝
63. CONFIDENTIAL We are hiring!
 SmartHRは価値あるプロダクトの開発を、
 一緒に進めてくれる仲間を募集しています！
64. CONFIDENTIAL https://open.talentio.com/r/1/c/smarthr/pages/ 45038 デザインレビューについて もっとお話をしたい場合はこちら https://www.vivivit.com/job-postings/7301 一緒に働きたい！と 思っていただけた場合はこちら