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

Straight-Up Design

Avatar for Jen Myers Jen Myers
January 10, 2013
Design
1
1k

Straight-Up Design

Simple ways devs can make apps look and work better.
Avatar for Jen Myers

Jen Myers

January 10, 2013
Tweet

More Decks by Jen Myers

See All by Jen Myers
Listen to Your (and All) Mothers
Avatar for Jen Myers jenmyers
0
160
Cartoon Creativity
Avatar for Jen Myers jenmyers
0
220
How To Not Be an Expert
Avatar for Jen Myers jenmyers
1
260
How to Start Coding from Any Level
Avatar for Jen Myers jenmyers
0
250
Shepherding Unicorns
Avatar for Jen Myers jenmyers
2
290
Owning It
Avatar for Jen Myers jenmyers
0
300
Developers Can't Design (2013)
Avatar for Jen Myers jenmyers
6
470
How to Not Be an Expert
Avatar for Jen Myers jenmyers
8
560
Redesigning the Interface
Avatar for Jen Myers jenmyers
4
810

Other Decks in Design

See All in Design
真・altはつけるだけじゃなくて -alt属性の考察 2025年版-
Avatar for Yu Morita securecat
5
1.6k
Карта процесса-опыта — как визуализировать сервис просто, понятно и подробно
Avatar for Andrew Shapiro ashapiro
0
110
今日から意識できるアクセシビリティ
Avatar for fumiko fumiko
0
260
Мышление историями. Как текстовые модели поведения помогают дизайнеру проектировать
Avatar for Andrew Shapiro ashapiro
0
110
Saudade typeface
Avatar for Tiago Porto tiagoporto
0
330
【最新】マズロー安達の弟子実績（1期-4期の26人分）
Avatar for マズロー安達 maslow_akkun
0
470
札幌の雪を観光資源に変える：デザインプログラムSESSAの挑戦
Avatar for Ittyanm ittyann
0
260
業務効率化だけじゃ物足りない AIと一緒にプロトタイプ開発
Avatar for Shingo Suzuki shingo2000
1
1.5k
21 Ways to Call American Airlines Customer Care Full Guide USA
Avatar for Sonny americanhub
0
180
児童相談所における養育里親委託時の親権者同意に向けたコミュニケーションの実態
Avatar for trivia trivia
0
490
企画を動かすデザイナーの思考！「広げて絞る」アプローチ。
Avatar for Hikida Kan hikidakan
0
100
「批評」を習慣にするための仕組みと場のデザイン/uxdesign202507
Avatar for 日本経済新聞社 エンジニア採用事務局 nikkei_engineer_recruiting
2
360

Featured

See All Featured
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
1
440
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
23
3.5k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
184
22k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
71
11k
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
6.7k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
53
2.9k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
51
8.5k
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
750
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
32
1k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.5k

Transcript

  1. Straight-Up D E S I G N simple ways for

    devs to make apps look and work better

  2. Hi. I’m Jen. I’m a designer.*

  3. Design Myths 1 Design is decoration. Design is subjective. Design

    is separate from development. 2 3

  4. Simple ways to do design? Do tell!

  5. There are no simple ways to do design.

  6. But there are some places to start.

  7. Inspiration

  8. STEAL.

  9. SEARCH AND BOOKMARK.

  10. Layout

  11. CREATE A FLOW.

  12. negative space

  13. None
  14. None

  15. USE GRIDS.

  16. WIREFRAME.

  17. WIREFRAME.

  18. USE PATTERNS.

  19. Details

  20. CHOOSE FONTS.

  21. CHOOSE FONTS.

  22. CHOOSE COLORS.

  23. CHOOSE ICONS.

  24. frameworks & helpers

  25. Twitter Bootstrap? Um ... do you have to?

  26. JEN MYERS @antiheroine jenmyers.net/speaking

  27. RESOURCES http://www.austinkleon.com/steal/ http://pinboard.in/u:jenmyers/t:inspiration/ http://pinterest.com/deliberatepixel/web-app-design/ http://dribbble.com http://inspectelement.com/articles/the-principles-of-good-web-design-part-1-layout/ http://balsamiq.com http://ui-patterns.com/ http://www.google.com/webfonts http://typekit.com

    http://youtu.be/BMP5cuAYG_Q http://www.colourlovers.com/ http://www.colorschemer.com/online.html http://cs.nyu.edu/courses/fall02/V22.0380-001/color_theory.htm http://css-tricks.com/examples/IconFont/