7 Practical Tips for Cheating at Design

Mar 5, 2018

Are you a designer? No? Then this will be interesting for you.

Seven simple ideas you can use to improve your designs today.

Remember them and use them whenever you need to create anything. These are good guidelines for a start.

1. Use color and weight to create hierarchy instead of size

Don’t rely too much on font size to control your hierarchy.

Try using color or font weight to do the same job.

Also, try and stick to two or three colors (dark for primary content, grey for secondary, lighter grey for stuff like copyright notice or footer.)

2. Don’t use grey text on colored backgrounds

Making text a lighter grey is a great way to de-emphasize it on white backgrounds, but it doesn’t look so great on colored backgrounds.

Making the text closer to the background color is what actually helps create hierarchy, not making it light grey.

3. Offset your shadows

Instead of using large blur and spread values to make box shadows more noticeable, add a vertical offset.

It looks a lot more natural because it simulates a light source shining down from above like we’re used to seeing in the real world.

4. Use fewer borders

While borders are a great way to distinguish two elements from one another, they aren’t the only way, and using too many of them can make your design feel busy and cluttered.

The next time you find yourself reaching for a border, try one of these ideas instead:

1. Use a box shadow

2. Use two different background colors

3. Add extra spacing

5. Don’t blow up icons that are meant to be small

Icons that were drawn at 16–24px are never going to look very professional when you blow them up to 3x or 4x their intended size. They lack detail, and always feel disproportionately “chunky.”

If small icons are all you’ve got, try enclosing them inside another shape and giving the shape a background color:

6. Use accent borders to add color to a bland design

One simple trick that can make a big difference is to add colorful accent borders to parts of your interface that would otherwise feel a bit bland.

It doesn’t take any graphic design talent to add a colored rectangle to your UI, and it can go a long way towards making your site feel more “designed.”

7. Not every button needs a background color

Every action on a page sits somewhere in a pyramid of importance. Most pages only have one true primary action, a couple of less important secondary actions, and a few seldom used tertiary actions.

When designing these actions, it’s important to communicate their place in the hierarchy.

Primary actions should be obvious. Solid, high contrast background colors work great here.
Secondary actions should be clear but not prominent. Outline styles or lower contrast background colors are great options.
Tertiary actions should be discoverable but unobtrusive. Styling these actions like links is usually the best approach.