How design happens at GitHub (Osaka, 2014)

Here are the slides for a talk I gave in Osaka, Japan, in 2014, about how design happens at GitHub.

Transcript

1. ! cobyism — Osaka, 2014
   HOW
   DESIGN
   HAPPENS
   AT GITHUB
   

   View Slide

2. @cobyism
   

   View Slide

3. ࢲ͸GitHubͷσβΠφʔͱ։ൃऀͰ͢
   

   View Slide

4. GitHub͸ɺαϯϑϥϯγείʹڌ఺Λஔ͕͘ɺࢲ
   ͸๺ΞΠϧϥϯυʹॅΜͰ͍·͢
   

   View Slide

5. ࢲ͸ɺϦϞʔτͰಇ͘ଟ͘ͷࣾһͷதͷҰਓͰ͢
   

   View Slide

6. ໿60ˋ͕ϦϞʔτͰ͢ɻ
   

   View Slide

7. DESIGN
   How it works at GitHub
   ํ๏ઃܭ͸GitHubͷ࣌ʹى͜Γ·͢
   

   View Slide

8. σβΠϯ͸ɺίʔυ಺Ͱൃੜͨ͠
   

   View Slide

9. σβΠϯ͸ɺϓϧཁٻͰൃੜ
   

   View Slide

10. Pull Requests help
    settle arguments.
    ϓϧཁٻ͸ɺҾ਺Λղܾ͢Δखॿ͚
    

    View Slide

11. Pull Requests
    keep you grounded
    in reality.
    ϓϧཁٻ͸ɺ͋ͳ͕ͨݱ࣮ʹয఺Λ౰͓ͯͯ͘
    

    View Slide

12. Design happens
    in ...
    σβΠϯ͸ɺϒϥ΢βͰى͜Δ
    

    View Slide

13. Design here
    is real.
    ϒϥ΢βʔ಺Ͱߦ͏σβΠϯ͸ݱ࣮ɻ
    

    View Slide

14. Design it once,
    not twice
    ઃܭҰ౓ɺೋ౓Ͱ͸ͳ͍
    

    View Slide

15. Design here is
    always current.
    ϒϥ΢βͰߦ͏ઃܭ͸ৗʹ࠷৽Ͱ͋Δɻ
    

    View Slide

16. Just commit.
    ίϛοτɺ͓ΑͼͦΕ͕଎͘ͳΔ
    

    View Slide

17. big

    picture
    Focus on
    the first
    ࠷ॳ͸શମ૾͔Βݟ·͠ΐ͏
    

    View Slide

18. Design happens
    with prototyping.
    σβΠϯ͸ϓϩτλΠϓΛ͍ͬͺ͍࡞Δ͜ͱʹΑͬͯߦΘΕΔ
    

    View Slide

19. [ REDACTED ]
    ൿີ!
    

    View Slide

20. Design happens
    with lorem ipsum

    dolor sit amet.
    ϓϨʔεϗϧμςΩετ?
    

    View Slide

21. Design happens
    with real data.
    σβΠϯʹ͸ຊ౰ͷσʔλ͕ඞཁ
    

    View Slide

22. View Slide

23. Design happens
    hidden behind
    feature flags.
    σβΠϯ͸ػೳϑϥάͰӅͯ͠ຊ൪؀ڥͰςετ͞Ε͍ͯΔɻ
    

    View Slide

24. def new_feature_enabled?
    …
    end
    

    View Slide

25. def new_feature_enabled?
    preview_features?
    end
    

    View Slide

26. def new_feature_enabled?
    preview_features? &&
    team_access?(:some_team)
    end
    

    View Slide

27. View Slide

28. def new_feature_enabled?
    true
    end
    

    View Slide

29. Beware of

    feature flags.
    ػೳϑϥάΛ࢖͏ͱԿΛӅ͍ͯͯ͠Կ͕ग़ՙ͞Εͯ
    ͍Δ͔͕Θ͔Βͳ͘͜ͱ΋͋Δɻ
    

    View Slide

30. Dogfooding is
    powerful, but it
    has it’s limits.
    ࣗ෼Ͱࣗ෼ͷϓϩμΫτΛςετ͢Δͷڧྗ͚ͩͲɺݶք΋͋Δ
    

    View Slide

31. Design happens
    with feedback.
    ϑΟʔυόοΫ͕͋ͬͯͦ͜σβΠϯ͸ى͜Δ
    

    View Slide

32. Design happens
    with quantitative
    feedback.
    σβΠϯ͸ɺఆྔతͳϑΟʔυόοΫͰൃੜ
    

    View Slide

33. Design happens
    with qualitative
    feedback.
    σβΠϯ͸ɺఆੑతͳϑΟʔυόοΫͰൃੜ
    

    View Slide

34. Design is
    everyone’s
    responsibility.
    σβΠϯ͸ΈΜͳͷ੹೚ɻ
    

    View Slide

35. Design often
    begins without
    any designer input.
    σβΠϯ͸݁ߏසൟʹσβΠφʔ͕ؔΘΒͳͯ͘΋࢝·Δɻ
    

    View Slide

36. Beware of design
    by committee.
    ҕһձʹΑΔσβΠϯ͸͚͞·͠ΐ͏ʂ
    

    View Slide

37. Beware of

    drive-by comments.
    ௨ߦਓ͔Βͷίϝϯτʹ͸஫ҙ͍ͯͩ͘͠͞
    

    View Slide

38. Design should be
    an open process.
    σβΠϯ͸ɺಁ໌ͳϓϩηεͰ͋Δ΂͖
    

    View Slide

39. Open design
    is the future.
    ಁ໌σβΠϯ͸ະདྷ͕͋Δ
    

    View Slide

40. Open design
    is really hard.
    ಁ໌ੑͷ͋ΔσβΠϯ͸࣮ݱ͢Δͷ͸ຊ౰ʹ೉͍͠
    

    View Slide

41. Open design
    requires making at
    paradigm shift.
    ಁ໌ͳσβΠϯ͸ɺύϥμΠϜγϑτ͕ඞཁͰ͢
    

    View Slide

42. Open design
    means showing
    work early.
    ಁ໌ੑͷ͋ΔσβΠϯʹ͸ૣ͍ஈ֊ʹσβΠϯΛݟͤΔ
    ඞཁ͕͋Γ·͢ɻ
    

    View Slide

43. Open design
    means accepting
    imperfection.
    ಁ໌ੑͷ͋ΔσβΠϯʹ͸׬ᘳͰ͸ͳ͍͜ͱΛड͚
    ೖΕΔඞཁ͕͋Δɻ
    

    View Slide

44. Open design helps
    build empathy.
    ಁ໌ੑͷ͋ΔσβΠϯʹ͸ڞײ͋͑͠Δؔ܎Λߏங
    ͢Δඞཁ͕͋Δ
    

    View Slide

45. Open design
    means articulating
    design decisions.
    σβΠϯʹࢸΔҙࢥܾఆΛ໌֬ʹදݱͰ͖Δ
    ඞཁ͕͋Δɻ
    

    View Slide

46. Open design
    means sacrificing
    your pride.
    ಁ໌ੑͷ͋ΔσβΠϯʹ͸ࣗ෼ͷϓϥΠυΛࣺͯΔ
    ඞཁ͕͋Δɻ
    

    View Slide

47. Open design means
    trusting people.
    ಁ໌ੑͷ͋ΔσβΠϯʹ͸νʔϜϝʔτΛ৴པ͢Δ
    ඞཁ͕͋Δɻ
    

    View Slide

48. Open design means
    being respectful.
    ಁ໌ੑͷ͋ΔσβΠϯʹ͸ϑΟʔυόοΫΛ
    ݴ͏࣌ʹ૬खΛଚॏ͢Δඞཁ͕͋Δɻ
    

    View Slide

49. Open design takes
    constant work.
    ಁ໌ੑͷ͋ΔσβΠϯʹ͸ৗʹ౒ྗͯ͠վળ
    ͢Δඞཁ͕͋Δɻ
    

    View Slide

50. Thank you!
    coby@github.com
    @cobyism
    
    Ͳ͏΋͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ
    

    View Slide