The psychology of brilliant digital design

Author

Scroll Down

Symbols are deep-rooted in our minds

What research reveals about compelling design

There’s an impressive body of psychological research on effective design principles. Results point to universal elements of human perception, ingrained in our DNA, that strongly affect what we recognize and respond to favorably. — For example, we relate best to classic symbols (e.g., Apple iPhone icons depicting email as an envelope; time represented by an analog clock; a cogwheel representing settings) because these now relatively archaic symbols are so deep-rooted in our minds’ ‘images vocabulary.’ Another example–black and white graphics resonate more powerfully in depicting the past when contrasted with color graphics representing the present. Makes intuitive sense. Yes?

Since the 1970s, marketing research has revealed a common icon/graphics vocabulary that most of us recognize as representing different categories of objects/actions (e.g., a sofa/couch icon is easily recognized as a symbol for furniture; a lamp not so much). Refining that visual vocabulary has included a renewed emphasis on classic standards, e.g., the now standard flat design, characterized by simplicity and clarity.

Flat design was a reaction against what many considered the overly ornate/complex 90s/early 2000s skeuomorphism. It included textures, luminous colors, dimensionality and other details that made digital icons/graphics look more like photographic representations of objects.

Linguistics and visual thinking

The key take-away here is that ‘language’ is not limited to verbal and written communication. In fact, all written language originated in pictorial representations of physical objects (e.g., hieroglyphics, cuneiform and early Chinese pictograms). Visual symbols/imagery are intrinsic to human nature. They inform our creative imaginations, which is embedded not only in visual perception, but hearing and touch, as well.

Speech and visual symbols (e.g., diagrams, maps and graphics) are complementary, strongly interdependent means by which we exchange information. It’s imperative that online platforms integrate these parallel modes of communication in a way that is both scientific and artful. Your online platforms need to embody the best of both.

Probable future design trends

None of this, however, addresses cultural/regional differences. Though visual symbols often have universal currency, each culture has its own variations. Given this, it’s likely that in the future, flat design will evolve by respecting cultural/regional differences with the reintroduction of carefully selected, small elements of skeuomorphism.

Another aspect of cultural variability emerges from how language modifies perception itself. For example, Arctic Inuit and Sami cultures have 180-300 distinctive nouns to describe snow. Many linguists theorize that having a more extensive vocabulary for different kinds or frozen precipitation result in greater perceptual acuity/sensitivity. This can be captured in varied visual symbols for snow that wouldn’t make sense to English speakers not sensitized by their environments to see such distinctions. Similarly, languages like Spanish and Italian identify objects as feminine/masculine. Visual symbols, then, are more relatable for people speaking Romance languages with design variations that integrate that awareness.

Next, I’ll describe additional design principles that help establish a stronger connection with your customers–often more complex and varied than businesses understand.

Factoring in what is cross-culturally appealing

Digital Design & Psychology

So far, I discussed psychological factors that determine the effectiveness of digital and print publication design. As OWDT’s Chief Creative Officer, my natural design talent has been sharpened and refined by university education in digital design, higher mathematics and the sciences. I’m especially fascinated by the interplay between perceptual/psychological factors and culture in developing leading-edge digital design.

Most website design companies limit their focus to an industry’s culture and specific demographic. We at OWDT take it several steps further by factoring in what is cross-culturally appealing to potential customers from one country and region to another.

Researching the client and their customers

We begin any project by developing a positive rapport with customers to determine their branding needs and objectives. We also research their evolving customer base in order to best showcase their services/products and catalyze future business development.

Only then do we design the optimal structure and design for each of their web pages. For example, the primary About Us Page objective may be to demonstrate service reliability, leading-edge technology, customer service excellence or some other factor.

Organization of information

Design also encompasses primary objectives that synch with a company’s brand and marketing strategy. A well-designed webpage takes the eye from left to right across the page coming to rest at a primary action link, which should have a larger font contrasted with generous white space.

Because people normally scan Internet text, ‘seeing’ not much more than 20% of the words–headings, taglines and bulleted items also require abundant white space and sharp color contrast to encourage action and facilitate smooth navigation.

Pictures and graphics

  • Human beings are pre-programmed to respond favorably to friendly faces. This is why OWDT designed websites often depict friendly people who project accessibility, kindness and confidence.
  • As with print, high contrast graphics with generous white space enhance comprehension and conversion rates.
  • Selection of colors is critical. Among significant factors–we never use the same color for dissimilar actions, e.g., different colors must be used for login and to purchase. Also, we avoid colors that are easily confused by the 8% of the male population and .5% of the female population who have standard colorblindness.

Proportions

  • Classical and Renaissance societies recognized the importance of rules of proportion that are innately pleasing to the eye. This includes the Golden Ratio (1.618), Hick’s Law (avoiding long lists of options, but categorizing options from a first page linked to additional pages for product selection), and Fit’s Law (creating larger target links).

In the next and final installment in this series, I’ll introduce more information on the psychology of color, The Rule of Thirds and a number of easy-to-understand Gestalt principles–all of which are integral to excellent design.

Benefit from larger font and more white space

Webpage composition guidelines

Decades of design and marketing research have revealed design principles that increase website and conversion rates and printed page marketing appeal.

These underscore the following requirements:

  • Keep It Simple–

Consistent with Hick’s Law, avoid overloading any webpage with too many decision links. This also means eliminating all distracting options or design elements. Less is indeed more in an era plagued with decision overload. This rule is consistent with one of science’s foundational principles: Occam’s Razor, which states that the simplest solution is usually the best.

  • Optimize Visual Hierarchy–

Top to bottom, left to right, provide different types of visual hierarchy that determine what readers see or overlook. For example, calls to action links should be to the right (after header information) and in a contrasting color. Value propositions benefit from larger font and more white space for better contrast. Unfortunately, far too many sites still don’t incorporate these related guidelines. For example, Home Page links are too often presented in small, unbolded type at the bottom of page, or, even worse, virtually invisible two-thirds of the way down the page.

  • Create a Hierarchy of Menus–

If your company provides a comprehensive list of services and/or products, congratulations! However, if you introduce that information with a long, all-inclusive gateway page menu this will reduce your conversion rate and sales. Instead, create a shorter intro page menu defining general categories, each of which links your potential customer to the complete list of the specific product or service options they’re interested in.

  • Size Objects and Links Carefully–

Fit’s Law stipulates that calls to action links need to be sized larger (20% bigger or small items is often enough). For example, Spotify makes it easier to hit the Play Button because it is larger, in a contrasting color, and towards the bottom of the page (which in this case is visually intuitive).

Crop Images in Accordance with the Rule of Thirds–If you divide any image you wish to post online into nine equal parts (2 equally spaced horizontal lines; 2 equally spaced vertical lines), be aware that the intersections of those lines map is where the eye goes. So, if, for example, you have 50% blue sky at the top of an image, crop the top of the image down to raise the horizon so that the eye is drawn to ground features that you want the viewer to notice.

Intuitive/subconscious elements of first impressions

Gestalt Psychology is based on the principle that the whole exists independently from/is greater than its parts.

Key Gestalt guidelines include:

  • Group Logically Related Issues Together–

Functionally related objects need to be placed together in some kind of recognizable order/pattern, as with related links. Similarly, by all means avoid grouping objects with dissimilar functions.

  • Observe the Law of Symmetry–

Most people strongly prefer symmetry to asymmetry. Consistent with the Rule of Thirds, the mind responds favorably to objects spaced out evenly around a center point. A related factor–we tend to see two unconnected symmetrical elements as one. This is consistent with The Law of Closure by which we fill in visual gaps (broken lines) to see whole objects.

More on color in design coming in future posts:

Selection of colors is critically important for so many reasons that I’ll be posting a series of articles exclusively devoted to this subject in the near future.