DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Refcards Trend Reports
Events Video Library
Over 2 million developers have joined DZone. Join Today! Thanks for visiting DZone today,
Edit Profile Manage Email Subscriptions Moderation Admin Console How to Post to DZone Article Submission Guidelines
View Profile
Sign Out
Refcards
Trend Reports
Events
View Events Video Library
Zones
Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks

Integrating PostgreSQL Databases with ANF: Join this workshop to learn how to create a PostgreSQL server using Instaclustr’s managed service

[DZone Research] Observability + Performance: We want to hear your experience and insights. Join us for our annual survey (enter to win $$).

Monitoring and Observability for LLMs: Datadog and Google Cloud discuss how to achieve optimal AI model performance.

Automated Testing: The latest on architecture, TDD, and the benefits of AI and low-code tools.

Related

  • Brain-Computer-Interface (BCI)
  • One Billion Neurons on a Desktop Computer
  • Procrastination — Agile to the Rescue
  • Neuralink Reveals Their Brain-Machine Interface

Trending

  • Auto-Scaling DynamoDB Streams Applications on Kubernetes
  • LLMs for Bad Content Detection: Pros and Cons
  • Docker and Kubernetes Transforming Modern Deployment
  • Scalable Rate Limiting in Java With Code Examples: Managing Multiple Instances

Visual Perception and Its Influence in UX Design

Even though it is usually regarded as secondary to a product's functionality, the UX is just as important. After all, perception is everything.

Betina R user avatar by
Betina R
·
Jan. 22, 18 · Analysis
Like (4)
Save
Tweet
Share
4.90K Views

Join the DZone community and get the full member experience.

Join For Free

Though working in UI development, there are certain things that we need to consider from the UX aspect as well. One of them being visual perception, which influences the human interaction with the UI. There are many ways in which human perception varies, especially in the way we observe different visual information. First, we’ll start from knowing what visual perception is. 

Visual Information

Visual information are images or videos that contains data other than plain text. Visual Information could carry colour, emotion, culture, an inspirational concept or a complex explanation.

Visual Perception

Ideally, the input to the eye is the same, while the difference is with the way human brain processes that visual information. This ability of our brain to process information is called visual perception. Visual information can reach people across languages/platforms. Research states that human brain takes only 13 milliseconds to process an image. That is, 60,000 times faster than text. Visualisation can be a greater way to convey an information to even non-readers or dyslexic.

For instance, every one of us must have come across people who do not read newspapers, yet skim across only pictures in them. Some people even scan through pictures of magazines to find the topics that interests them. Basically, our brain tries to know the story from the images itself without having to read all that text under that topic. This process is called visual perception.

Let us see some of these processes influencing the real world, that influence UX design as well.

Top-Down Processing

Visual perceptions are simply a combination of what we see, and our past experience or knowledge, says Richard L Gregory, a British psychologist, through one of his studies in perception and illusion. According to Gregory, our brain processes present visual information with ease or difficulty based on past knowledge. This is called top-down processing. According to his study, 90% of the data observed though our eyes are lost even before it reaches our brain. Thus, our brain only has to make up from the other 10% of the received visual data and the past knowledge it has stored.

Top-Down Processing in UX

When user searches something on the UI, the brain automatically processes that search into colours, images and categories related to that information. So, it is important to set a theme that compliments your information and follow certain hierarchy which can be easily traced.

Colour Palettes

Psychologists found that adding colour to a visual information not only processes the data with ease but also helps the brain remember them better. Thomas Sanocki and Noah Sulman, psychologists from the university of South Florida, studied how colour usage on a visual is processed by human brain. It was found that colour relation has strong influence over the brain on holding a memory longer and with ease, and results showed that human brain finds similar colour palettes as harmonious/more balanced, unlike dissimilar colour palettes. Also, the patterns were remembered longer when the elements were built/aligned more systematically.

Colour Palettes in UX

It is always recommended to use colours that compliments the visual information. Using harmonious colour palettes for complex UI results in a more pleasant UI experience. Whereas dissimilar colour palettes can be used to differentiate visual information from the background. We can also use dissimilar colour palettes to create colour dominance and grouping wherever required. However, to encourage prolonged usage, it is not advisable to use disharmonious colour palettes that are too harsh for users’ eyes.

Binocular Rivalry

It is seen that when two different elements are presented to each eye, instead of the two elements being superimposed, only one element is seen at a time suppressing the other and vice versa randomly as long as the eyes keep seeing that information. This process is called binocular rivalry.  

Binocular Rivalry in UX 

Basically, binocular rivalry prevents users from focusing on important information in a UI. For instance, if content is cluttered the user will not be able to differentiate important information from the other contents. Another instance is where icons within the same UI are different in terms of colour/design, which might confuse the user, making it difficult to accomplish the task.

Typography

In a study conducted by Kevin Larson(Microsoft) and Rosalind W. Picard(MIT), it was determined that typography could influence users’ ease of learning and mood. Given a magazine with two different typography to two different set of people, the people who were reading the magazine with good typography showed more interest and positive mood over the set of people who were given bad typography. People with good typography felt like they had more control and could easily navigate between contents than people with bad typography. People reading good typography were also able to accomplish the given task successfully during the session while none of the people who were reading bad typography could.

Typography in UX

For our brain to process the visual information more effectively it is important to use more readable font types. Using sufficient white space between visual contents and texts could enhance readability and focus.

Perceived Affordances

The concept of affordance was initially proposed by James Gibson, a perpetual psychologist in late 70s, while it was introduced to interaction design by Don Norman in late 80s in his book “Psychology of Everyday Things.” Perceived affordance is a term used where human brain perceives how things work. For instance, you know you will fall off a cliff and need to be careful when you see one. Qin Zhu and Geoffrey P. Bingham in one of their studies in human perception and performance found that perception of affordance can only be learned through practice. However, basic affordances do not need learning says James Gibson.

Perceived Affordances in UX

 In UX design, affordance is convention. When we create a button, the user should feel the affordance to click on it for action. Poor affordance is when the user is not sure if a button is clickable or not, or if the user is not sure what a UI element does when interacted upon. Similarly, every action element in a UI should follow perceived affordance in an interaction design. Affordance helps create intuitive design.

Final Analysis

Human brain is wired to recognise or learn from images. Through centuries, we evolved through images, while letters and words came later. Visual perception is constructive. Every action in a design needs to be comprehensive. It is through visual information from the user interface that the user takes his/her cue to advance towards completing a task without any misperception. Hence, using suitable icons/images, colour palettes, typefaces, hierarchy, white space and affordance to lead the user measures the success of a UX design.

Interaction design Brain (computer virus)

Opinions expressed by DZone contributors are their own.

Related

  • Brain-Computer-Interface (BCI)
  • One Billion Neurons on a Desktop Computer
  • Procrastination — Agile to the Rescue
  • Neuralink Reveals Their Brain-Machine Interface

Comments

Partner Resources

X

ABOUT US

  • About DZone
  • Send feedback
  • Careers
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 3343 Perimeter Hill Drive
  • Suite 100
  • Nashville, TN 37211
  • support@dzone.com

Let's be friends: