Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Tooling for Designer–Developer Collaboration

Avatar for Jeff Jewiss Jeff Jewiss
May 06, 2016
Programming
0
36

Tooling for Designer–Developer Collaboration

In search of better tools and process to enable team members to do better work.

Avatar for Jeff Jewiss

Jeff Jewiss

May 06, 2016
Tweet

Other Decks in Programming

See All in Programming
HTTPプロトコル正しく理解していますか？ 〜かわいい猫と共に学ぼう。ฅ^•ω•^ฅ ﾆｬ〜
Avatar for ♛Heitor Hirose hekuchan
2
690
AI & Enginnering
Avatar for codelynx codelynx
0
110
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
Avatar for nrs nrslib
2
1.9k
CSC307 Lecture 01
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
690
Grafana：建立系統全知視角的捷徑
Avatar for Blueswen blueswen
0
330
OSSとなったswift-buildで Xcodeのビルドを差し替えられるため 自分でXcodeを直せる時代になっている ダイアモンド問題編
Avatar for yimajo yimajo
3
620
15年続くIoTサービスの SREエンジニアが挑む 分散トレーシング導入
Avatar for Melonps melonps
2
200
Amazon Bedrockを活用したRAGの品質管理パイプライン構築
Avatar for とすり tosuri13
5
720
CSC307 Lecture 03
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
1
490
プロダクトオーナーから見たSOC2 _SOC2ゆるミートアップ#2
Avatar for Kenta Suzuki kekekenta
0
220
フロントエンド開発の勘所 -複数事業を経験して見えた判断軸の違い-
Avatar for Yoichiro Kubo heimusu
7
2.8k
Basic Architectures
Avatar for Denys Poltorak denyspoltorak
0
680

Featured

See All Featured
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
13
1.1k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.8k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Leadership Guide Workshop - DevTernity 2021
Avatar for David Neal reverentgeek
1
200
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto Wada twada
PRO
117
110k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
Avatar for r-kagaya rkaga
60
42k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.4k
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
49
From π to Pie charts
Avatar for Rasagy Sharma rasagy
0
120
Building Adaptive Systems
Avatar for Chris Keathley keathley
44
2.9k
Code Review Best Practice
Avatar for Trisha Gee trishagee
74
20k
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
120k

Transcript

  1. Tooling for Designer–Developer Collaboration ExplodeConf - 2016

  2. Jeff Jewiss @jeffjewiss

  3. None
  4. None
  5. None
  6. None

  7. The Goal Well designed websites and apps Works on necessary

    devices and screen sizes Bridge the gap between designers and developers

  8. BFFs

  9. Expectations Must solve a problem for users Design systems have

    the highest leverage The browser is the platform
  10. None

  11. Why is working together hard? Where to look for inspiration

    Tools of the trade (systems design) CSS as a collaboration medium

  12. Why is this so hard?

  13. None
  14. None
  15. None
  16. None
  17. None
  18. None
  19. None
  20. None
  21. None
  22. None

  23. We Need Boundaries

  24. None
  25. None
  26. None

  27. Role Models

  28. None
  29. None
  30. None
  31. None
  32. None
  33. None
  34. None
  35. None
  36. None

  37. Prototyping

  38. Paper/rough sketches User Flows Proof of Concept Spike

  39. None

  40. Get to Code Faster Prototypes are amazing for communicating intent

    They rarely take into account constraints of the browser Creating a flow for every screen size is unrealistic

  41. Grid Systems

  42. None
  43. None
  44. None
  45. None
  46. None

  47. http://philipwalton.com/articles/side-effects-in-css/

  48. http://philipwalton.com/articles/side-effects-in-css/

  49. http://philipwalton.com/articles/side-effects-in-css/

  50. Flexbox

  51. None

  52. Styleguides

  53. None

  54. What makes a good styleguide? No elements left out Team

    buy-in Live – generated from code
  55. None
  56. None
  57. None

  58. https://github.com/chrislopresto/ember-freestyle/

  59. CSS Is Hard

  60. None

  61. Deleting unused css is hard and time consuming. And more

    often than not - it’s not work people are excited to do. So what happens? People keep writing more and more css. http://mrmrs.io/writing/2016/03/24/scalable-css/
  62. None

  63. http://thesassway.com/beginner/the-inception-rule

  64. thesassway.com/beginner/the-inception-rule

  65. CSS COMPONENTS

  66. BEM OOCSS SMACCS ITCSS SUITCSS

  67. None
  68. None

  69. CSS STATS

  70. None
  71. None
  72. None
  73. None
  74. None
  75. None

  76. CSS FUNCTIONAL

  77. None

  78. http://philipwalton.com/articles/side-effects-in-css/

  79. http://philipwalton.com/articles/side-effects-in-css/

  80. None

  81. Writing new css should be the exception, not the rule.

    http://mrmrs.io/writing/2016/03/24/scalable-css/
  82. None
  83. None
  84. None
  85. None
  86. None
  87. None
  88. None

  89. Recap Set boundaries Find role models Leverage design systems and

    process Get to code, write CSS at scale

  90. THANK YOU! Jeff Jewiss @jeffjewiss

  91. Q & A