How to not suck at design, a 5 minute guide for the non-designer.

Good design principles can be learned and exercised by anyone. This guide will give you a basic knowledge of practical design tips you can apply today (and impress your design friends).

Marc Hemeon
Apr 30, 2017 · 6 min read

If you don’t believe you can learn design, just remember what our legendary friend David Eric Grohl said about learning new things:

1. Use plenty of contrast

The background and font color should be different enough to not cause eyestrain. Typically black text on white backgrounds tends to be the most legible. Stay away from the light gray, yellows and greens. If you have to squint to read then you know you have a problem.

2. Almost Black is easier to read than Black

If you have the choice, try using the color #333333 RGB (51,51,51) instead of pure black for your text. Pure black on white jiggles for the eye and makes the letters hard to focus on.

3. Important Content First

Layout the most important information first to clearly support the primary use case of your app or website. Important content should be visible without zooming or scrolling or tapping.

Search is the core function of the app, folks use Pinterest to discover and browse.

Lets look at two more examples

Spotify (below, on the left) clearly is celebrating the album artwork and song title first and player controls second. Even though the player controls are secondary, Spotify gives more weight to the play and pause button over fast forward and reverse.

4. Align all the things

The fastest way to fix something that feels off or janky is to make sure the alignment is not off. When designers talk about the need to use a “grid” they are trying to alert the team to the issue of mis-alignment.

Fixing alignment is one of the easiest improvements we can make to any app or website and instantly makes an app or website look 10x better.

Lets look at another alignment example, this time from medium.com

Wonky alignment on the left creating a visual river, consistent alignment on the right
Bad alignment on the left, Fixed alignment on the right

5. Text size with spacing

We are not designing for ants.

Increasing font size will make your content much easier to read and digest coupled with some liberal line spacing.

Good text size vs bad text size from: https://developer.apple.com/design/tips/
Good spacing vs. bad spacing size from: https://developer.apple.com/design/tips/

6. Use a list view for results, if order is important

Most mobile and web apps have some type of search and there can be some healthy design debates on how to display the results.

How do Users View Search Results Presented in a Grid Layout? By C. Siu & B. Chaparro

7. Design in black and white first, add color later

Designing in black and white will keep the focus on solving and designing the core experience of your app.

8. Create comfortable design

Hand strain is a real issue, consider the graphic below from Luke Wroblewski’s amazing article: Responsive Navigation: Optimizing for Touch Across Devices.

Image Credit: Luke Wroblewski Responsive Navigation: Optimizing for Touch Across Devices

9. Borrow Color Palettes

Color is a bit of an elusive dark art. I highly recommend heading over to Dribbble and searching for “Color Palettes” or use a color palette generator like Coolors or Color Claim.

Save yourself the hours of endless debate and second guessing.

10. Use Apple and Google OS Conventions

Apple and Google have created incredible resources for anyone building software for Android or iOS.

Remember, design takes practice

Training your eye to look for the design issues takes a bit of time and practice, but you will find the above tips will go a long way to making anything you create better designed.

Startup Grind

Stories, tips, and learnings from and for startups around…

Startup Grind

Stories, tips, and learnings from and for startups around the world. Welcoming submissions re: startup education, tech trends, product, design, hiring, growth, investing, and more. Interested in submitting? Visit our submission form here: https://airtable.com/shrShpeN89HrzCzOB

Marc Hemeon

Written by

Artist. Father. Find me @hemeon

Startup Grind

Stories, tips, and learnings from and for startups around the world. Welcoming submissions re: startup education, tech trends, product, design, hiring, growth, investing, and more. Interested in submitting? Visit our submission form here: https://airtable.com/shrShpeN89HrzCzOB