Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Straight-Up Design

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Jen Myers Jen Myers
January 10, 2013
Design
1.1k
1

Straight-Up Design

Simple ways devs can make apps look and work better.

Avatar for Jen Myers

Jen Myers

January 10, 2013

More Decks by Jen Myers

See All by Jen Myers
Listen to Your (and All) Mothers
Avatar for Jen Myers jenmyers
0
220
Cartoon Creativity
Avatar for Jen Myers jenmyers
0
250
How To Not Be an Expert
Avatar for Jen Myers jenmyers
1
310
How to Start Coding from Any Level
Avatar for Jen Myers jenmyers
0
280
Shepherding Unicorns
Avatar for Jen Myers jenmyers
2
350
Owning It
Avatar for Jen Myers jenmyers
0
330
Developers Can't Design (2013)
Avatar for Jen Myers jenmyers
6
540
How to Not Be an Expert
Avatar for Jen Myers jenmyers
8
610
Redesigning the Interface
Avatar for Jen Myers jenmyers
4
900

Other Decks in Design

See All in Design
クリエイティブディレクター 両角 高寛 の自己紹介
Avatar for GYRO両角 morogyro
0
130
デザインツールを開く前に その画面は誰に何と言わせたい？受託UIデザイナーが顧客解像度を高める 「打ち合わせの場での確かめ方」
Avatar for @Garyuten garyuten
1
220
Accelerating performance improvement based on a software review evaluation matrix
Avatar for kitanosirokuma kitanosirokuma
0
300
Warner Bros. Discovery 2025 Box Office Booklet
Avatar for Sam Bird samb1rd
0
130
I.A. como meio, não como fim. Como avaliar o valor entregue?
Avatar for Viviane Delvequio videlvequio
0
470
「おすすめ」はなぜ信用されないのか - 信頼を築くUI/UX設計
Avatar for ryu ryu1013
0
260
“なんとなくFigma”から一歩先へ。AI時代も活きるWeb制作フロー
Avatar for Ayumi Suzuki ayumidesign
0
220
(2026 FlowCon Keynote) Sociotechnical Architecture Finding Flow
Avatar for xinyao xinyao
0
120
凡庸を落とすハーネス
Avatar for Hiromi Maeo hiromimaeo
2
830
Edmonton River Slidedeck
Avatar for Edmonton River edmontonriver
0
270
Design dependencies
Avatar for Teba_eleven teba_eleven
0
170
【CEDEC2026】『Shadowverse: Worlds Beyond』続編開発におけるUIデザイン・アニメーション演出の「超進化」 ～継承と挑戦を両立するデザイン手法～
Avatar for Cygames, Inc. cygames
PRO
3
5.1k

Featured

See All Featured
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
31
6.2k
More Than Pixels: Becoming A User Experience Designer
Avatar for Michelle Schulp Hunt marktimemedia
3
520
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4.2k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
128
18k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.3k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2.1k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
Avatar for David Neal reverentgeek
1
590
Designing for Performance
Avatar for Lara Hogan lara
611
70k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8.3k
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto WADA twada
PRO
120
120k
Designing Powerful Visuals for Engaging Learning
Avatar for Mike Taylor tmiket
1
540
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
21
1.6k

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/