$30 off During Our Annual Pro Sale. View Details »

Designing with GitHub

Designing with GitHub

Learn how our team at GitHub works, and how we think about design.

Steve Smith

April 02, 2014

More Decks by Steve Smith

Other Decks in Design


  1. Designing with GitHub

  2. Hi, I’m Steve @orderedlist

  3. How our Designers Work

  4. Who are we? 28 designers, many disciplines

  5. HTML/CSS Front-end designers, developers

  6. Native Applications Desktop, iOS, Android

  7. Illustration Octocats, animations, branding

  8. Print Material Marketing, business ops

  9. Video Marketing, education, events

  10. Research User studies, product research

  11. Our Tool Belt What we use to do what we

  12. Words Yes, words

  13. In order to communicate visually to your users, you must

    be able to communicate verbally to your team.
  14. Photoshop Dem PSDs

  15. Sketch The software, and the book

  16. Illustrator Vector Victor

  17. Web Browsers Inspectors man…

  18. Text Editors Atom, Sublime, Emacs, etc.

  19. Text Chat Campfire, Hubot

  20. Video Chat Google Hangouts, BlueJeans

  21. GitHub Use GitHub to design GitHub

  22. How we Collaborate Design better together

  23. Serendipitous Interactions Great ideas from unexpected places

  24. Annual Summit Everyone in one place

  25. Team Mini-summits Strategy and planning

  26. Face to Face Contact Understand tone and personality

  27. Remote Working ~70% of GitHub is remote

  28. But Why? Isn’t it easier to work in an office?

  29. Good People are Everywhere Limiting to geography is, well, limiting

  30. 243 GitHubbers 103 cities, as of 9pm yesterday

  31. Freedom to Travel Experience the world, while staying productive

  32. None
  33. Family Life Allows for family freedom

  34. None
  35. Personal Happiness Some people don’t want to live where you

    do, and that’s ok
  36. But How? How do you ensure productivity?

  37. Remote First Mindset Assume remote in most situations

  38. Communication Use your words

  39. Asynchronous Workflows Don’t assume people are available whenever you need

  40. Text is the Best Searchable, transcripts, notifications, etc.

  41. Give People Time to Respond Patience is a virtue, and

    all that
  42. Chat Rooms We have a lot of them

  43. None
  44. Everyone Uses Chat Even if you’re in the office

  45. /virtual office me Video chat for that in-office experience

  46. None
  47. GitHub Team Our Internal Status App

  48. None
  49. Don’t Email People No history, terrible threading, it’s just bad

  50. And of Course, GitHub Communication with results

  51. How we use GitHub Ideas and workflows

  52. Teams Permissions, mentions, notifications

  53. None
  54. None
  55. Design-specific Repos Repos aren’t just for code

  56. Assets, sometimes Not always, but it can be great

  57. None
  58. Issues For problems, not solutions

  59. None
  60. Design Documents and Projects Keep an up-to-date record of current

  61. Markdown Files Text with benefits

  62. History See changes to project direction over time

  63. Discussion See the thoughts that lead to conclusions

  64. Pull Requests A workflow for proposing changes

  65. Woah, Woah, Woah I don’t want to use Git

  66. Deal with it, it’s not difficult

  67. Let Me Show You github.com/orderedlist/design-example-repo

  68. Questions?

  69. How Design Works

  70. GitHub Zen Finding your design center

  71. Features are Expensive Creation, maintenance, complexity, real estate

  72. Approachable is Better Than Simple Simple ideas don’t mean simple

  73. Mind Your Words They are important

  74. Communicate Concisely Your customers deserve it

  75. Communicate Thoughtfully Your colleagues deserve it

  76. Put Effort Into Your Words They are more important than

    your designs
  77. Speak Like a Human Please

  78. Non-blocking is Better Than Blocking Don’t get in people’s way

  79. Block by Interruption Confirmation, popups, dialogs

  80. Block by Overstimulation Over-design, too many options, distractions

  81. Block by Complication Requiring too much from the user

  82. None
  83. Favor Focus Over Features Say no to things

  84. Perfection is achieved, not when there is nothing more to

    add, but when there is nothing left to take away. Antoine de Saint-Exupery
  85. None
  86. Anything Added Dilutes Everything Else Be careful about additions

  87. When many good ideas present themselves, it's easy to become

    distracted. Don't let good ideas get in the way of great execution.
  88. Starting is Easy, Finishing is Hard The process of shipping

    is incredibly difficult
  89. Wrapping Up A Few Key Points

  90. Communication is Important For your designs and your colleagues

  91. Design Happens Anywhere Not just your office

  92. Backup Your Designs with Words Keep those words meaningful and

  93. Design Better Together It’s better than designing alone

  94. Questions?

  95. Thank you!