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

Design for Developers

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Kevin Dees Kevin Dees
November 03, 2016
Programming
1
180

Design for Developers

Avatar for Kevin Dees

Kevin Dees

November 03, 2016
Tweet

More Decks by Kevin Dees

See All by Kevin Dees
The Hidden Features Of CSS
Avatar for Kevin Dees kevindees
1
120
Create Your Own Theme Page-Builder in Minutes
Avatar for Kevin Dees kevindees
0
2.3k
CSS Gird
Avatar for Kevin Dees kevindees
0
520
Forms make the web
Avatar for Kevin Dees kevindees
1
310
TypeRocket 3.0: Unleash WordPress and be amazing (Wilmington NC)
Avatar for Kevin Dees kevindees
1
400
TypeRocket 3.0 - Unleash WordPress and Be Amazing
Avatar for Kevin Dees kevindees
0
960
Busting The Loop Lies
Avatar for Kevin Dees kevindees
2
170
Pragmatic WordPress Workflow
Avatar for Kevin Dees kevindees
2
320
Pragmatic WordPress WorkFlow: Theming
Avatar for Kevin Dees kevindees
0
680

Other Decks in Programming

See All in Programming
Go Conference mini in Sendai 2026 : Goに新機能を提案し実装されるまでのフロー徹底解説
Avatar for Takahito Yamatoya yamatoya
0
480
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
350
朝日新聞のデジタル版を支えるGoバックエンド ー価値ある情報をいち早く確実にお届けするために
Avatar for JunkiIshida junkiishida
1
290
並行開発のためのコードレビュー
Avatar for Miyuki miyukiw
2
2.1k
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
130
AIによる高速開発をどう制御するか？ ガードレール設置で開発速度と品質を両立させたチームの事例
Avatar for tonkotsuboy_com tonkotsuboy_com
7
2.6k
CSC307 Lecture 13
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
310
今更考える「単一責任原則」 / Thinking about the Single Responsibility Principle
Avatar for philomagi tooppoo
3
1.2k
ぼくの開発環境2026
Avatar for yuzneri yuzneri
1
290
AIプロダクト時代のQAエンジニアに求められること
Avatar for imtnd imtnd
1
510
コーディングルールの鮮度を保ちたい / keep-fresh-go-internal-conventions
Avatar for NAGATA Hiroaki handlename
0
120
浮動小数の比較について
Avatar for Kishikawa Katsumi kishikawakatsumi
0
360

Featured

See All Featured
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
2
970
How to make the Groovebox
Avatar for あそなす asonas
2
2k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
Claude Code どこまでも/ Claude Code Everywhere
Avatar for nwiizo nwiizo
63
53k
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
A Soul's Torment
Avatar for Nat Ma seathinner
5
2.4k
Building AI with AI
Avatar for Ines Montani inesmontani
PRO
1
760
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
659
61k
How to build an LLM SEO readiness audit: a practical framework
Avatar for Nick Samuel nmsamuel
1
660
New Earth Scene 8
Avatar for Sydney Stone popppiees
1
1.7k
The Curse of the Amulet
Avatar for Matthew Lei leimatthew05
1
9.3k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
860

Transcript

  1. Design for Devlopers

  2. Design = Solving Problems

  3. Users First

  4. Steal like an artist

  5. Patterns

  6. → Menu → Footer → Header → Dropdown → Login

    Forms

  7. Typography

  8. None

  9. Large x-height for body copy

  10. Use good line height

  11. None

  12. lines 45 to 75 characters

  13. Serif for body copy

  14. Classic typographic scale

  15. None

  16. http://type-scale.com/

  17. Font Pairing

  18. http://fontpair.co/

  19. Ligatures

  20. None

  21. Content is King

  22. None
  23. None

  24. Color

  25. None

  26. → Primary → Secondary → Tertairy → Complementary → Triads

  27. None
  28. None
  29. None
  30. None
  31. None

  32. https://color.adobe.com

  33. None

  34. Photography

  35. Looking Room

  36. None
  37. None

  38. Rule of Thirds

  39. None

  40. High small, low tall

  41. Take advantage of shadows and lighting

  42. Interaction

  43. Click vs Hover

  44. For every action, there is an equal and opposite reaction

  45. Microinteraction

  46. Do one task well

  47. None
  48. None
  49. None

  50. Emotion

  51. Design for Humans

  52. Consider a persons relationships

  53. Personality

  54. Quick Tips

  55. Use a global light source

  56. Free Icons

  57. Wireframe Your Ideas

  58. Find inspiration

  59. Finally, go design something