Designer meets Domain-Driven-Design

Designer meets Domain-Driven-Design

サービスデザインからUXデザイン・分析、UIデザインなど、Domain-Driven-Designの事を非エンジニアも知れるようにまとめました。

* Standard Inc & Fablic Incで開催された非エンジニアがDDDに出会うワークショップのスライド資料です。

Transcript

1. Designer meets
   Domain-Driven-Design
   Designer meets
   Domain-Driven-Design
   Designer meets
   Domain-Driven-Design
   σ β Π φ ʔ ͕ υ ϝ Π ϯ Ϟ σ ϧ ۦ ಈ ։ ൃ Λ
   ମ ݧ ͯ͠ ಘ ͨ ஌ ݟ
   T S U Y O S H I H I G U C H I
   

   View Slide

2. P R O F I L E
   樋 口 剛 T S U Y O S H I H I G U C H I
   S e r v i c e D e s i g n e r & U I D e v e l o p e r
   ϑϦʔϥϯεͰελʔτΞοϓ΍৽͍͠ϓϩμΫτͷ
   αʔϏεσβΠϯͱ։ൃɾ࣮૷·Ͱߦ͍ͬͯ·͢ɻ
   @tyshgc
   

   View Slide

3. G R O U P
   Design For User
   ͜ͷษڧձ͸ɺαʔϏεσβΠϯʹؔΘΔશͯͷਓୡ
   ͱϢʔβʔͷͨΊʹΑΓྑ͍αʔϏεΛఏڙ͢ΔͨΊ
   ͷφϨοδڞ༗ͷ৔ॴͱͯ͠͸͡Ί·ͨ͠ɻ
   

   View Slide

4. Domain-Driven-Designとは何か
   
   実例で見てみる
   
   DDDを経たデザインフローの変化
   OOUXやコンポーネント指向へ…
   
   

   View Slide

5. Domain-Driven-Designとは何？
   
   

   View Slide

6. Domain-Driven-Designを
   体験して感じたコト
   

   View Slide

7. ドメインモデリングはエンジニア発の
   ユーザー中心設計だ！
   戦略的ドメインモデル駆動開発は
   サービスデザインと同じだ！
   

   View Slide

8. 自分もユースケースとユビキタス言語
   を探すようになっていた！
   

   View Slide

9. しかし…
   Domain-Driven-Design も 銀の弾丸 ではない
   ツールやフレームワークを知るのではなく、解決したい本質の部分を学ぶ
   

   View Slide

10. Domain-Driven-Designを
    採用するエンジニアやチームが何を得ようと
    しているのかが重要
    

    View Slide

11. では、Domain-Driven-Designを
    紐解いてみましょう
    

    View Slide

12. Domain Driven Design
    エリック・エヴァンス氏が提唱する
    ソフトウェアの設計手法
    ドメイン駆動設計・開発
    

    View Slide

13. ιϑτ΢ΣΞઃܭͱ͸ɺ໰୊ղܾͱܭըͷ޻ఔ
    移り変わる
    概念やステークホルダーの関心事がある
    

    View Slide

14. ソフトウェアはヒトが扱うもの
    ソフトウェアはサービスの一部
    

    View Slide

15. ソフトウェアはヒトが扱うもの
    ソフトウェアはサービスの一部
    ιϑτ΢ΣΞ͕ղܾ͢΂͖໰୊͸ɺ
    αʔϏεʹؔ܎͢Δ֓೦Λ੔ཧ͢Δաఔ͔ΒಡΈऔΕΔ
    

    View Slide

16. ֓೦
    ෺ࣄʹ͍ͭͯந৅తʹ೺Ѳ͢Δ͞·
    ϝϯλϧϞσϧ
    

    View Slide

17. αʔϏεͷར༻ऀ αʔϏεͷఏڙऀ
    ར༻ऀͷղܾ͍ͨ͠໰୊΍
    χʔζͷͨΊʹۀ຿Λ
    ͓͜ͳ͏
    ղܾ͍ͨ͠໰୊΍χʔζ͸
    ιϑτ΢ΣΞͷத͚ͩʹ
    ͋ΔΘ͚Ͱ͸ͳ͍
    αʔϏεͷεςʔΫϗϧμʔ
    

    View Slide

18. ιϑτ΢ΣΞ͕ղܾ͢΂͖໰୊
    αʔϏεͷར༻ऀ αʔϏεͷఏڙऀ
    εςʔΫϗϧμʔͷ
    ϝϯλϧϞσϧ͔Β໰୊ͷ֩৺Λநग़Ͱ͖Δ
    

    View Slide

19. サービスデザインにおける
    フロントヤードとバックヤードなどの視点と同じだ
    

    View Slide

20. ؔ܎͢Δώτͷ໰୊ղܾͱͣͬͱ෇͖߹͏ͨΊʹɺ
    ֓೦ϞσϧʹԊͬͯΦϒδΣΫτࢦ޲Ͱ
    ։ൃʢઃܭɾ࣮૷ʣΛਐΊΔ
    Domain Driven Design
    

    View Slide

21. なぜ、Domain-Driven-Design？
    DDDへの変遷
    

    View Slide

22. ιϑτ΢ΣΞ։ൃ͸ৗʹมߋͱεϐʔυͱͷઓ͍
    

    View Slide

23. ઃܭͷͳ͍ঢ়ଶͰͷ։ൃ͢ΔͱͲ͏ͳΔ͔ʁ
    

    View Slide

24. มߋʹΑΔӨڹൣғ͕޿͘ͳ͍͖ͬͯ
    อक͕೉͘͠ͳΔ
    ࣅͨಉ͡ػೳͷίʔυ͕൙ཞ͍ͯ͠Δ
    
    UIͱίΞʹͳΔίʔυ͕ࠞࡏɺUIมߋͷ౓ʹӨڹΛड͚Δ
    
    = SmartUIʢརޱͳUI / ը໘ۦಈʣ
    
    σʔλϕʔε΁ͷϦΫΤετ΍มߋͷίʔυ͕఺ࡏ͍ͯ͠Δ
    

    View Slide

25. ࢓༷υΩϡϝϯτ͸
    ௥͍͔ͭͳ͍
    Өڹൣғ͕ଟͯ͘
    ࠞཚ͕ى͜Δ
    

    View Slide

26. ソフトウェア開発はサービスの成長スピードに
    合わせて柔軟に寄り添い続ける必要がある
    メンタルモデルを基本にした設計に則って、
    コードを言語として人がわかるように書こう！
    

    View Slide

27. どうやってやる?
    HOW
    

    View Slide

28. 設計を正しく行うために
    サービスの概念 を正しく知ろう
    概念を知るために ユースケース を探そう
    

    View Slide

29. ユビキタス言語を抽象化し
    ドメインモデル を抽出しよう
    ユースケースから
    ユビキタス言語 を定義しよう
    

    View Slide

30. ドメインモデルをオブジェクト指向の
    クラスモデル にしていこう
    ドメイン層と
    技術的処理やUI層など 責務 を分けよう
    

    View Slide

31. ֓೦͕ίʔυͰදݱ͞Εɺ໾ׂ͝ͱʹߏ଄Խ͞ΕΔ
    ίʔυΛॻ͘ = Lean & Design
    

    View Slide

32. ドメイン？ ユースケース？
    ユビキタス言語？責務?
    WHAT
    

    View Slide

33. υϝΠϯ
    サービスのコンテキスト上にある
    概念の集まり
    アカウントという概念はコンテキスト
    によって異なる。
    銀行サービスという文脈で見ると口座
    という意味になるが、アプリという文
    脈で見るとユーザー情報となる。
    

    View Slide

34. Ϣʔε
    έʔε
    サービスに関係するアクターの
    それぞれの活動や行動
    アクターは利用者、提供者、
    システムまで含まれる。
    それらのタスクを主語・述語レ
    ベルで表現できるような単位の
    もの。
    

    View Slide

35. ϢϏΩλε
    ݴޠ
    ユースケースに存在する
    言葉の定義 = メンタルモデル
    ユビキタス言語とは、
    どこでも使える言語のこと。
    開発時の普段の会話から
    コードの命名にも使われる。
    

    View Slide

36. ੹຿
    ドメインモデルを様々な実装上の
    都合などから隔離すること
    サービスの概念や振る舞いだけ
    をコードに置き換えたものが
    ドメイン層。
    それ以外については、役割ごと
    に別の層に置いていく。
    

    View Slide

37. 実例で見てみる
    
    

    View Slide

38. レストランの接客業務
    を例にする
    

    View Slide

39. アクターとユースケースを
    探ってみる
    

    View Slide

40. ΞΫλʔ
    αʔϏεʹؔ܎ͨ͠׆ಈʹొ৔͢Δਓ෺΍γεςϜ
    

    View Slide

41. ϨετϥϯαʔϏεͷΞΫλʔ
    ϨετϥϯͷαʔϏεΛར༻ɻ
    ϗʔϧελοϑ ઀٬୲౰ͷελοϑɻ઀٬࣌ʹ୺຤Λ࢖༻
    ͯ͠஫จΛड෇͚Δɻ
    ར༻٬
    ਥ๪ελοϑ ௐཧ୲౰ͷελοϑɻ
    POS ൢച࣌఺৘ใ؅ཧγεςϜɻ୺຤͔Β஫จ
    Λड͚෇͚ɺਥ๪΁प஌ͨ͠Γɺܾࡁͷ؅
    ཧΛߦ͏ɻ
    

    View Slide

42. Ϣʔεέʔε
    ΞΫλʔͦΕͧΕͷλεΫ
    ओޠʢΞΫλʔʣ+ ड़ޠʢಈ࡞΍ঢ়ଶʣ
    ͳΔ΂͘γϯϓϧͳจষʹ͢Δ
    

    View Slide

43. ϨετϥϯαʔϏεͷϢʔεέʔεʢҰ෦ൈਮʣ
    ར༻٬͸ɺೖళ͢Δ
    ϗʔϧελοϑ͸ɺςʔϒϧ΁Ҋ಺͢Δ
    ར༻٬͸ɺϝχϡʔ͔Β඼໨ΛબͿ
    ར༻٬͸ɺϗʔϧελοϑΛݺͿ
    ར༻٬͸ɺر๬ͷ඼໨Λ஫จ͢Δ
    ϗʔϧελοϑ͸ɺ୺຤ʹ඼໨Λೖྗ͢Δ
    ୺຤͸ɺ஫จ඼໨ͷࡏݿΛݮΒ͢
    

    View Slide

44. Ϣʔεέʔε͸ਤʹͯ͠΋ྑ͍
    ڞ༗Ͱ͖ͯΘ͔Ε͹ͳΜͰ΋ྑ͍
    ސ٬ ϗʔϧελοϑ
    ୺຤
    ඼໨ΛબͿ
    ඼໨Λ୳͢
    ඼໨ΛબͿ
    ஫จΛ֬ఆ͢Δ
    ஫จΛ͢Δ
    γεςϜ
    ʢ104ʣ
    

    View Slide

45. ϢϏΩλεݴޠ
    Ϣʔεέʔεʹଘࡏ͢Δݴ༿ͷఆٛΛ͢Δ
    ྫʣϨετϥϯͱ͸ɺ஫จͯ͠ҿ৯͢Δ৔ॴͩ
    

    View Slide

46. Ϣʔεέʔε͔Βݴ༿Λर͍ͬͯ͘
    ར༻٬͸ɺೖళ͢Δ
    ϗʔϧελοϑ͸ɺςʔϒϧ΁Ҋ಺͢Δ
    ར༻٬͸ɺϝχϡʔ͔Β඼໨ΛબͿ
    ར༻٬͸ɺϗʔϧελοϑΛݺͿ
    ར༻٬͸ɺر๬ͷ඼໨Λ஫จ͢Δ
    ϗʔϧελοϑ͸ɺ୺຤ʹ඼໨Λೖྗ͢Δ
    ୺຤͸ɺ஫จ඼໨ͷࡏݿΛݮΒ͢
    テーブル
    メニュー
    品目
    注文
    在庫
    

    View Slide

47. ϨετϥϯαʔϏεͷϢϏΩλεݴޠʢҰ෦ൈਮʣ
    ੮͕ෳ਺͋Δ΋ͷɻςʔϒϧ୯ҐͰ஫จΛ
    ड͚෇͚Δɻ
    ϝχϡʔ ඼໨͕ΧςΰϦ͝ͱʹϦετ͞Εͨ΋ͷɻ
    ςʔϒϧ
    ඼໨ ྉཧ঎඼΍ҿྉ঎඼ɺηοτɾίʔεͳͲ
    ͷ঎඼ͷࣄɻ
    ஫จ ඼໨ΛબΜͰਥ๪ͰௐཧΛ࢝ΊΔ͜ͱɻ
    
    ·ͨ୅͕ۚൃੜ͢Δ͜ͱɻ
    

    View Slide

48. ϢϏΩλεݴޠΛ୳Δ࣌ͷϙΠϯτ
    ݴ༿ͷఆٛʹҧ࿨ײΛ֮͑ͨΒɺ
    αʔϏεͷ஌ࣝΛ࣋ͭਓ΍ར༻ऀʹώϠϦϯάΛߦ͏
    ҧ࿨ײͷ౓ʹ܁Γฦ͠ߦ͏
    ΤϯδχΞ͸ίʔυॻ͖ͳ͕Βҧ࿨ײΛ୳͍ͬͯΔ
    

    View Slide

49. このコードは、
    レストランの "品目"
    というモデルを
    表現している例
    

    View Slide

50. 品目（MenuItem）は…
    品目名があり、
    それぞれ一意なIDが
    決められている。
    また、値段が決められており、
    数に限りがある（在庫がある）。
    

    View Slide

51. 品目（MenuItem）の
    振る舞い（ロジック）
    品目には在庫があり、在庫は管
    理されるもの。
    • 品目の在庫から選ぶ sele ct( )
    • 品目の在庫を戻す cancel( )
    

    View Slide

52. ඼໨ɿΦϜϥΠεΛ࡞Δ
    ඼໨ͱ͍͏ந৅తͳΦϒδΣΫτʢΫϥεΦϒδΣΫτʣΛ
    ΦϜϥΠεͱ͍͏࣮ମʹ͍ͯ͠Δ
    

    View Slide

53. これが初歩の段階。
    このコードや他のモデルを整理したり、責務を移譲したり
    とイテレーションをすることで違う表現が見えてくる →リファクタリングへ
    ֓೦Λ
    ϞσϦϯά
    Ϟσϧ
    Ϋϥεͷਫ਼ࠪ
    ϢϏΩλεݴޠ
    ݟ௚͠
    ੹຿ͷҠৡ
    

    View Slide

54. まとめ
    

    View Slide

55. Domain Driven Designの本質は
    ユビキタス言語 = メンタルモデル
    ߏ଄ԽͷΞʔΩςΫνϟ͸։ൃࣄ৘ʹ߹Θ͍ͤͯ͘
    

    View Slide

56. ϢϏΩλεݴޠΛ࢖͏͜ͱͰΠϝʔδͷᴥᴪΛݮΒ͢
    
    ֓೦ͷந৅ԽʹΑͬͯαʔϏεͷຊ࣭Λڞ༗͢Δ
    
    ίʔυΛ࢓༷υΩϡϝϯτʹঢ՚ͤ͞อकੑɾมߋ༰қੑ
    Λ޲্ͤ͞Δ
    
    ϝϯλϧϞσϧ͔ΒυϝΠϯϞσϧΛཧղ͢Δ͜ͱͰ
    
    Ϣʔβʔத৺ͷιϑτ΢ΣΞΛ࡞Δ
    ͕͜͜Ұ൪ॏཁ
    

    View Slide

57. DDDを経たデザインフローの変化
    
    OOUXやコンポーネント指向…
    

    View Slide

58. 基本的には前から
    やってた感はあるけど…
    

    View Slide

59. ϢʔεέʔευϦϒϯʹͳͬͨ
    ユーザーストーリーよりもスコープが小さいので
    主観的にユーザーを想像することが少なくなった。
    ユースケース分析すると時間の流れも把握できる。
    導線設計やデータフローの参考にするようになった。
    

    View Slide

60. ユーザーAは
    観光地までの
    アクセス方法を
    知りたい
    ユーザーCは
    オススメの
    飲食店の場所を
    調べる
    ユーザーBは
    空港までの
    乗り換え案内
    を見たい
    ユーザーは
    経路を調べる
    ユーザーは
    施設情報を
    調べる
    各論
    抽象論
    

    View Slide

61. νʔϜϝϯόʔͰूΊͨϢʔεέʔεΛ࣌ܥྻʹεϓϨουγʔτʹ·ͱΊͨΓ
    

    View Slide

62. ϝϯλϧϞσϧΛఆٛ͢ΔΑ͏ʹͳͬͨ
    画面単位でのデザインを行わず、メンタルモデルに
    沿ったコンポーネント設計をするようになった。
    モデルからコンポーネントの属性値や振る舞いを見つ
    ける。またGUI依存するものや表示するだけのものなど
    責務ごとに分けてなるべく疎結合を目指す。
    

    View Slide

63. 品目リスト（配列）を渡す
    メニューコンポーネント
    品目コンポーネント
    品目名、価格、注文数などを渡す
    

    View Slide

64. View Slide

65. View Slide

66. View Slide

67. ユースケースや
    メンタルモデルから
    コンポーネント
    を定義する
    OOUXͱ͍͏ͷΛఏএ͍ͯ͠Δਓ͕͍Δ
    Object-Oriented-UX
    http://alistapart.com/article/object-oriented-ux
    

    View Slide

68. Domain Driven Designからの学び
    メンタルモデルとユースケースとても大事
    σβΠϯ΋֓೦ʹԊΘͤͯɺ࠷ऴతʹ͸ϑϩϯτΤϯυͷίʔυʹ
    

    View Slide

69. Thank you!
    

    View Slide