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

Design for Developers

Kevin Dees
November 03, 2016
Programming
1
140

Design for Developers

Kevin Dees

November 03, 2016
Tweet

More Decks by Kevin Dees

See All by Kevin Dees
The Hidden Features Of CSS
kevindees
1
95
Create Your Own Theme Page-Builder in Minutes
kevindees
0
2k
CSS Gird
kevindees
0
410
Forms make the web
kevindees
1
280
TypeRocket 3.0: Unleash WordPress and be amazing (Wilmington NC)
kevindees
1
350
TypeRocket 3.0 - Unleash WordPress and Be Amazing
kevindees
0
790
Busting The Loop Lies
kevindees
2
140
Pragmatic WordPress Workflow
kevindees
2
290
Pragmatic WordPress WorkFlow: Theming
kevindees
0
650

Other Decks in Programming

See All in Programming
Defying Front-End Inertia: Inertia.js on Rails
skryukov
0
490
Coding Experience Cpp vs Csharp - meetup app osaka@9
harukasao
0
750
AIコードエディタの基盤となるLLMのFlutter性能評価
alquist4121
0
210
Rollupのビルド時間高速化によるプレビュー表示速度改善とバンドラとASTを駆使したプロダクト開発の難しさ
plaidtech
PRO
1
170
Enterprise Web App. Development (1): Build Tool Training Ver. 5
knakagawa
1
110
Dissecting and Reconstructing Ruby Syntactic Structures
ydah
0
700
Building a macOS screen saver with Kotlin (Android Makers 2025)
zsmb
1
150
海外のアプリで見かけたかっこいいTransitionを真似てみる
shogotakasaki
1
170
スモールスタートで始めるためのLambda×モノリス（Lambdalith）
akihisaikeda
2
280
PHP で学ぶ OAuth 入門
azuki
1
200
AIコーディングワークフローの試行 〜AIエージェント×ワークフローでの自動化を目指して〜
rkaga
3
3.7k
Vibe Coding の話をしよう
schroneko
7
1.2k

Featured

See All Featured
Raft: Consensus for Rubyists
vanstee
137
6.9k
Art, The Web, and Tiny UX
lynnandtonic
298
20k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.3k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.5k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
21k
A designer walks into a library…
pauljervisheath
205
24k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
For a Future-Friendly Web
brad_frost
176
9.7k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
12k

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