Sketches, Doodles, UI Patterns or Poodles? Conditioned Responses & User Interfaces: Part 1

Author by Damon Sanchez

In this day and age we’ve all seen amazing apps or web sites with great User Experiences.  In some cases we might not know why or how we remember the experience but it happens anyways.  Is it the mere dragging of a slider? Is it the correct amount of color? Is it that stand-out hero graphic… or some tiny sound effect that clicks or dings at just the right moment?

Successful User Experiences have a way about making us feel good about each other, and ourselves in that they almost compel us to interact with them repetitiously through visual association and before we know it, on some sub-conscious level we’ve ingested a company’s Branding magic.

Visual Language triggers a lot of the emotional responses that occur during an interactive experience, but like we’ve talked about in previous blog posts Branding and Design Aesthetics alone only account for part of the complete UX Process.

Blog_trifecta.png

Studies show that executing Need Fulfillment, Usability and Visual Aesthetics can provoke a Positive Emotion and that positive emotions are cognitively stored in our memories longer than typical memories.

OK Great… How Does Knowing The Core UX Essentials Help Us to Repeat UI Success?

 

User Interfaces rely on the common knowledge of the person using the interface.  What establishes the perception of good UI, is really based on conditioning.

While there are a multitude of studies and papers written on the subject pertaining to what UI Patterns work better than others, understanding classical conditioning typically sheds light on effective UI Patterns giving us a road map for repeatable UI awesomeness. 

In 1902 a Russian psychologist named Ivan Pavlov discovered through a series of tests what we now call classical conditioning.  The ideas put forth by Pavlov in-a-nut-shell have become a corner stone for the basic laws of learning

The theory essentially states that we have certain conditioned responses that we rely on in our environments, and that through a series of unconditional interactions we learn to associate a new response to a previously conditioned response.

Great… So What Does That Mean and How Does it Pertain to UI and UX?
 

The Pavlov’s Dog experiments give a glimpse of how repetition plays a role in how we interpret and perceive good User Interfaces

This notion is fairly easy to see running in the wild. 

Blog_6_Article_pictures.png

Think of the Hamburger menu.  Because we communally see the UI Pattern on a daily basis, we’ve been conditioned to expect the interaction when clicking the iconography of a cluster of lines.  This is pretty amazing in that by simply using the hamburger menu UI Pattern we automatically harness this sort or
communal Pavlovian conditioned response in our applications that ultimately could make a user feel more comfortable through visual association.

Obviously just putting the Hamburger menu in an application with little to no thought about how it relates to other UI Patterns or functionality would be bad, but the take away is that the Hamburger Menu UI Pattern is greater than the sum of its parts because it has communal buy in prior to it being added to an application.

OK… So How Do We Combine Multiple UI Patterns Into Our Applications?

Here is a diagram of other UI Patterns:

UI_Table_03.png

Notice that each UI Pattern, although it is not expressed in the table above affords a certain level of Common Knowledge and Cognitive Processing.  An example of seeing Cognitive Processing at work inside a UI Pattern could be a  Vote Promote Pattern which could be expressed by a simple thumbs up or thumbs down, where as a Calendar Picker Pattern is more complicated and thus requires more cognitive processing through clicking, sorting, tabbing, etc..

The concepts of Information Chunking and Conditioned Response really help to drive decisions when choosing certain UI Patterns over others. 

In my next blog post Part 2 of this series I’ll be talking about Communal UI Sketching or White boarding and the concept of Information Chunking in more depth and how the baggage of cognitive processing starts to degrade experiences in complex UI.