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

Developers as Intentional Designers

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Lynn Fisher Lynn Fisher
April 26, 2014
Technology
1.2k
1

Developers as Intentional Designers

A talk from JSConf Brazil, Fortaleza.

Avatar for Lynn Fisher

Lynn Fisher

April 26, 2014

More Decks by Lynn Fisher

See All by Lynn Fisher
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
22k
A Different Kind of UX
Avatar for Lynn Fisher lynnandtonic
9
1.4k
Illustration with CSS
Avatar for Lynn Fisher lynnandtonic
9
4.2k
Be Good At Lots of Things
Avatar for Lynn Fisher lynnandtonic
8
1.5k
I’ll Be Awesome At Lots of Things, Thank You Very Much
Avatar for Lynn Fisher lynnandtonic
4
450
Illustrating With Heart
Avatar for Lynn Fisher lynnandtonic
3
630

Other Decks in Technology

See All in Technology
日本 Fintech 未来予測レポート 2027〜2028年（オリジナル版）
Avatar for 8maki 8maki
0
350
白金鉱業Meetup_Vol.24_「AIエージェントは分けるほど良い」は本当か？ / Is it true that “the more you divide AI agents, the better”?
Avatar for BrainPad brainpadpr
1
120
2026TECHFRESH畢業分享會 - 原生還是跨平台? App 開發踩坑實錄
Avatar for LINE Developers Taiwan line_developers_tw
PRO
0
590
noUncheckedIndexedAccess、3時間、1万円。 / noUncheckedIndexedAccess, 3 Hours, 10,000 JPY.
Avatar for 株式会社カオナビ kaonavi
1
340
非定型業務をAI slackbotで自動化する ~ 社内要望を自動壁打ちするbotを作った ~/automating-ad-hoc-work-with-ai-slackbot
Avatar for shibayu36 shibayu36
0
560
10倍の生産性を実現するAI駆動並列エージェントのすべて
Avatar for 熊井悠 kumaiu
4
1.3k
AI Engineering Summit Tokyo 2026 AIの前に、やることがある 〜医療データ企業の4フェーズ〜
Avatar for Daisuke Taniwaki dtaniwaki
0
2.4k
スキルと MCP ツール、責務をどう分けるか？ AI が迷わないインターフェース設計の戦略
Avatar for CData Software Japan cdataj
1
870
AIソロプレナー時代に2ヶ月で20人増員した事業創造会社の開発組織の話
Avatar for Koji Miyata miyatakoji
0
510
Agentic ERPをどう設計するか ー 受発注エージェントを動かす、現場の知見と設計思想ー
Avatar for 株式会社リチェルカ recerqainc
1
2.1k
LLMと共に進化するプロセスを目指して
Avatar for y_matsuwitter ymatsuwitter
12
3.8k
データ基盤をDataformで整えた話 〜 開発環境を添えて 〜
Avatar for Takanobu Nozawa takapy
0
140

Featured

See All Featured
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.6k
It's Worth the Effort
Avatar for 3n 3n
188
29k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
2
1.5k
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
230
New Earth Scene 8
Avatar for Sydney Stone popppiees
3
2.3k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
201
75k
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
200
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
320
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.2k
Information Architects: The Missing Link in Design Systems
Avatar for Michelle Chin soysaucechin
0
960
Code Reviewing Like a Champion
Avatar for maltzj maltzj
528
40k
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
200

Transcript

  1. DEVELOPERS AS INTENTIONAL DESIGNERS Lynn Fisher @ lynnandtonic

  2. None
  3. None
  4. None
  5. None
  6. None
  7. None

  8. DESIGN DEVELOPMENT

  9. DESIGN DESIGN DEVELOPMENT DEVELOPMENT

  10. DESIGN DESIGN DESIGN DEVELOPMENT

  11. DESIGN + DEVELOPMENT

  12. DEVELOPERS AS INTENTIONAL DESIGNERS

  13. DEVELOPERS DECIDING TO BE DESIGNERS —DESIGNING WITH PURPOSE & ON

    PURPOSE
  14. None

  15. SPECIALIZATION IS A GOOD THING

  16. CONFLICT IS A GOOD THING

  17. CONSTRUCTIVE CONFLICT IS A GOOD THING

  18. BUT SOMETIMES IT’S JUST YOU

  19. SORRY

  20. SORRY I’M NOT A DESIGNER

  21. STOP APOLOGIZING

  22. YOU GOTS THE SKILLZ

  23. MODULARITY & REUSABILITY

  24. MODULE

  25. DON’T REPEAT YOURSELF

  26. REUSE

  27. MODULE

  28. CONSISTENCY

  29. 2 SPACES 4 SPACES >

  30. 2 SPACES 4 SPACES <

  31. CONSISTENCY!

  32. @ brad_frost

  33. HIERARCHY

  34. 1 2 3 4 5

  35. ORDER

  36. ORDER GROUPING

  37. ORDER GROUPING SIZE

  38. READABILITY

  39. section.readability h1 Look at this contrast! p Your text editor

    has some really helpful colors for strong readability. a(role=“example”) See? p It’s awesome! 1 2 3 4 5 6 7 8

  40. IS IT READABLE?

  41. STICK WITH HIGH CONTRAST. LOW CONTRAST CAN BE HARDER TO

    READ.

  42. UP THAT FONT SIZE. DON’T MAKE PEOPLE SQUINT.

  43. MAKE THOSE LINKS OBVIOUS. LIKE, IS THIS EVEN A LINK?

  44. TOOLS

  45. + 1 2 3 4 5 6 7 8 9

    10 11 12 13 <!DOCTYPE html> <html> <head> <title>JSConfBR</title> </head> <body> <div class=“content”> <h1>Welcome!</h1> </div> </body> </html> <title>JSConfBR</title> </head> <body> <div class=“content”> .content margin: 0 padding: 10px

  46. @ spiralstairs

  47. RECAP

  48. MODULARITY RECAP

  49. MODULARITY RECAP REUSABILITY

  50. MODULARITY RECAP REUSABILITY CONSISTENCY

  51. MODULARITY RECAP REUSABILITY CONSISTENCY HIERARCHY

  52. MODULARITY RECAP REUSABILITY CONSISTENCY HIERARCHY READABILITY

  53. MODULARITY RECAP REUSABILITY CONSISTENCY HIERARCHY READABILITY TOOLS

  54. VISUAL DESIGN

  55. None

  56. GO TEAM!

  57. PRACTICE

  58. AIN’T NOBODY GOT TIME FOR THAT

  59. START SMALL

  60. CLICK HERE! SUBMIT NAME EMAIL PHONE CANCEL OK

  61. NOT EVERY PROJECT IS A REDESIGN

  62. CONSISTENCY (REMEMBER?)

  63. RECREATE & REDESIGN

  64. REDESIGN OFTEN

  65. REDESIGN OFTEN & QUICKLY

  66. DRAW SOMETHING EVERY DAY

  67. 1. SOMETHING YOU CAN SEE

  68. 1. SOMETHING YOU CAN SEE 2. SOMETHING YOU IMAGINE

  69. None

  70. 1. SOMETHING YOU CAN SEE 2. SOMETHING YOU IMAGINE

  71. CREATE A VISUAL REPRESENTATION OF WHAT YOU SEE WITH YOUR

    EYES

  72. CREATE A VISUAL REPRESENTATION OF WHAT YOU SEE WITH YOUR

    EYES AND WHAT YOU SEE WITH YOUR MIND

  73. SO OTHERS CAN SEE WHAT YOU SEE

  74. SHOW OTHERS YOUR WORK

  75. “ONLY THOSE WHO ARE WILLING TO TAKE THE RISK OF

    WRITING CODE THAT’S NOT PERFECT EVER WRITE CODE.” - MICHAEL “GAR” GARVIN

  76. SHAPE THE COMMUNITY

  77. RECAP

  78. START SMALL RECAP

  79. START SMALL RECAP REDESIGN & RECREATE

  80. START SMALL RECAP REDESIGN & RECREATE DRAW SOMETHING EVERY DAY

  81. START SMALL RECAP REDESIGN & RECREATE DRAW SOMETHING EVERY DAY

    SHOW YOUR WORK

  82. START SMALL RECAP REDESIGN & RECREATE DRAW SOMETHING EVERY DAY

    SHOW YOUR WORK SHAPE THE COMMUNITY

  83. HOW TO WORK WITH DESIGNERS

  84. EVERY “HOW TO WORK WITH X PERSON” ARTICLE OR TALK

  85. EVERY “HOW TO WORK WITH X PERSON” ARTICLE OR TALK

    CAN BE SUMMED UP WITH UNDERSTAND THEM & APPRECIATE THEM.

  86. IT’S NOT JUST ABOUT DESIGNERS

  87. DESIGNERS AS INTENTIONAL DEVELOPERS

  88. STOP APOLOGIZING

  89. YOU’RE DOING THIS

  90. THANK YOU Lynn Fisher @ lynnandtonic