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

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
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
200
Cartoon Creativity
Avatar for Jen Myers jenmyers
0
250
How To Not Be an Expert
Avatar for Jen Myers jenmyers
1
300
How to Start Coding from Any Level
Avatar for Jen Myers jenmyers
0
270
Shepherding Unicorns
Avatar for Jen Myers jenmyers
2
330
Owning It
Avatar for Jen Myers jenmyers
0
320
Developers Can't Design (2013)
Avatar for Jen Myers jenmyers
6
520
How to Not Be an Expert
Avatar for Jen Myers jenmyers
8
600
Redesigning the Interface
Avatar for Jen Myers jenmyers
4
860

Other Decks in Design

See All in Design
全員がアウトプットを出せる時代、 誰を採用する?
Avatar for NishaMe nishame
0
540
CULTURE DECK／Marketing Director
Avatar for M-HAND,Inc. mhand01
0
1.2k
Spacemarket Brand Guide
Avatar for Spacemarket spacemarket
2
600
図じゃなく言語で描く - Common Ground for Design AI Operations.
Avatar for Kazuki Ikeda kazukiikeda
2
820
「デザイン」の自分ごと化から始める、デザインピープルのふるまい
Avatar for mewmo mewmo
0
230
20251128_武蔵野美術大学InnovationDay_参加型の未来
Avatar for Kimura Atsunobu a2k
1
110
モビリティプラットフォームの未来を築くクラウド基盤
Avatar for Hajime KOSHIRO kossykinto
0
270
図面資産×AI 眠れる資産を起こす挑戦
Avatar for 青野正寛 aonomasahiro
0
110
UI/UX & Web Design Portfolio 2025｜Madoka Kumagai
Avatar for Madoka madoka_portfolio
4
230
Connpass-Xperia_Camera_App_by_HCD.pdf
Avatar for ソニー株式会社 sony
1
610
「見せる」登壇資料デザインの極意
Avatar for takanorip takanorip
3
780
hicard_credential_202601
Avatar for hicard hicard
0
230

Featured

See All Featured
Collaborative Software Design: How to facilitate domain modelling decisions
Avatar for Kenny Baas-Schwegler baasie
1
200
Test your architecture with Archunit
Avatar for Yoan thirion
1
2.2k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
72
12k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
Avatar for Akash Hashmi akashhashmi
0
340
From Legacy to Launchpad: Building Startup-Ready Communities
Avatar for Dug Song dugsong
0
200
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
120
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
59
6.5k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
Avatar for Kenny Baas-Schwegler baasie
0
540
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
2.8k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
140
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
Avatar for Ryan Jones ryanjones
0
130
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
Avatar for Tech SEO Connect techseoconnect
PRO
0
160

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/