There are some design principles so deeply rooted in human psychology that you may not even know they’re there. I call them phantom guides.

In a nutshell, phantom guides are the collective psychological phenomena that drives our subconscious and attention to the precise point where the designer wants it to be. It’s fueled by psychological predictions of human behavior, backed with mindfully constructed compositions.

Sometimes it might not be appropriate to use such visuals in your design, but you can always substitute complex photos with flat colors. For example, the color red psychologically corresponds with fire and blood, which are clues to danger. So a big, red button will get more attention than a turquoise one.

Gestalt laws are your best friend

Gestalt laws state that our minds tend to look for certain features in a composition—similarity, proximity, closure, symmetry, common fate, and continuity—to identify a message. This is the reason hierarchically similar functions and properties in a user interface, like navigation elements, get placed close together, appear and function similarly, and work as a whole.

As famous gestalt psychologist Kurt Kolfka once stated: “The whole is other than the sum of the parts.” The whole represents an independent existence rather than just a collection of parts.

In this respect, web grid systems are also good supporters of gestalt laws since they align all elements in respect to each other and to the composition, eventually defining a meaningful whole.

Use easily recognizable forms

When we’re presented with a visual, we instantly search our memory for similar forms with the same features. We either recognize it as something we know by similarity in shape, color, and working behavior, or we label it as a new thing we need to figure out.

New information requires more thinking—and none of your users want to spend time figuring things out. Keeping things simple and easily recognizable will attract more attention where it’s needed. If your UI elements have different forms than their real-life counterparts or behave differently than general expectations, users will have hard time recognizing the function of it, which requires excessive use of their limited cognitive resources. Giving clues to how your objects function will increase the rate of user interaction. Hover effects and shadows are some common examples of this.

But if you’re deliberately aiming for an irregular or unexpected look and to direct someone’s attention to a specific point, designing that one element in an unusual way (as a contrast to the others) will get attention as a side effect of the unknown/unexpected.

Nice example from Google AdWords.

Make cost and benefit clear

When we analyze a task, we look for the relationship between the difficulty of the task and the reward of completion. If the task is too hard and the reward is too small, why would we do it?

Motivational factors also greatly affect our perception of rewards. Since people are more motivated intrinsically than extrinsically, hints of a greater cause or an opportunity of mastery or self-improvement will have greater impact, rather than hints of money or any other extrinsic reward.

The optimum balance between cost and benefit changes in every design problem, but as designers we must present the optimum amount so that an average user can willingly interact with it—without feeling overwhelmed. For example, displaying a progress bar motivates people to finish a form.

Clarifying the benefits of the product or the proposition reduces the amount of declines.

Jam Study supports Hick’s Law on this issue. Limiting the number of options to 4 or fewer will greatly increase your conversion rates. Showing too many options on a pricing table will paralyze users’ ability to compare and analyze the optimum choice and may lead to abandoning the process all together. If you really need to present more options, categorizing the options and making a subset of choices can help.

Making a “featured” or a “popular” list can reduce the number of items shown and increase the probability of sale.

Present information both visually and verbally

One of the most effective ways to present an idea involves using the Dual-Coding Theory, which says we have an easier time remembering something if representations of both visual and verbal stimuli are used in unison. This is commonly seen in feature list pages where both icons and texts are used together to make it easier for the reader to process and remember. This blog structure is also an example.

And rather than placing all the information in a single block and expecting the user to take it all in on one sitting, try to divide copy into steps or a bulleted list. Since learning is a high-energy process, people prefer to see information presented in small pieces with even more clicks to get there. Also progressively presenting the information when user requires it will maintain focus. Accordion and collapsible UI elements and on-the-fly Ajax calls are some of the good supporters of progressive information presentation.

Phantoms are your friend

Phantoms have always been an iconic part of every culture, symbolizing our inner fears and joys. Since we’re designing for human interaction, in order to be successful we absolutely must have an understanding of what drives us.

Author

Baki BektasBaki Bektaş is UX/UI designer for JotForm, a leading online form creation platform.