Skip to Content
Designing effective interfaces
book

Designing effective interfaces

by Joel Marsh
October 2016
Beginner
20 pages
34m
English
O'Reilly Media, Inc.
Content preview from Designing effective interfaces

Chapter 1. Visual Weight (Contrast and Size)

This lesson is the first of five visual principles that will help you direct the user’s attention. Some parts of your design are more important than others, so we have to help users notice the important stuff.

The idea of visual weight is fairly intuitive. Some things look “heavier” than others in a layout. They draw your attention more easily. And that idea is valuable to a UX designer. Your job is to help users notice the things that matter. And it is equally important not to distract the users from their goals.

By adding visual “weight” to certain parts of your design, you increase the chance that a user will see them and you change where their eyes will go next. Remember: visual weight is relative. All visual principles are about comparing a design element to whatever is around it.

So, without further ado, I would like to introduce you to the stars of the UX Crash Course: The Rubber Ducks! *applause here*

Contrast

The difference between light things and dark things is called contrast. The more distinguishable a light thing is compared to a dark thing, the “higher” the contrast.

In UX, you want to give important things higher contrast, like the duck in the center. In this case, most of the image is light, so a dark duck is more noticeable. If the image were mostly dark, the lighter duck would be more noticeable.

If these were buttons, more ...

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Designing Mobile Interfaces

Designing Mobile Interfaces

Steven Hoober, Eric Berkman

Publisher Resources

ISBN: 9781491975459Errata Page