The basics of user experience

The concept of UI and UX

The concept of User-Interface (UI) and User-Experience (UX) is often mixed up. UI; user interface is the bridge between technology and art. Below is further explanation of what UX really is.

Definition of UX

Nielsen Norman Group definition.

"User experience" encompasses all aspects of the end-user's interaction with the company, its services, and its products.

 

Aspects of user experience

Basic design- and principles on different aspects.

An illustrated human head with a missing puzzle to be added.

Psychology

The basic understanding of human behavior are important considerations. The design must aim for the best functionality with appealing aesthetics and satisfying interactions, applications must work with people's basic needs, desires, and habits.

Color

Colors can be more then just the look. Color itself is information. Based on the scenario colors are informative element in many ways. Color palettes are ways to work with a systematic concept using the same colors to keep consistency. Colors can highlight danger, general information, links, call to actions any many more.

Multiple questions mark with three of colour orange.

Content Balance

Size of elements in relation to each other are important to consider. Larger elements carry more significance. A good symmetry and balance of a application gives the user a calming and non-stressful experience. An easy say is: More options - more time to make decisions. Let the layout breath with limited options is a great principle for the user to be focused on the communication that you really wishes to communicate. Reduce options, reduce problems.

Contrast

Contrast is a great opportunity of highlighting elements. This is often used in relation to the users option of action, to either cancel or to go forwards. To establish a visual hierarchy by creating dominance and emphasis by giving a focal point more weight. We can highlight the most important elements on the page to guide users toward the most important actions.

Typography

Font size is different depending on tablets but also for the visitor - often older people wish to have larger text, due to their sight.

Font styles are abundant and can make or break the design of a page. You can choose fonts from different typeface families, but try to stick to just two (three at the very most), such as an exciting one for the title and a more classic, readable style for the body.

Consistency

To keep structure and focus on usability and cohesiveness. Keeping unity with colors, fonts, html-element, re-using components with clear heading structure. Make it easy for the user to understand how to use features and how to orient themselves on the site. Basic navigation and keep the text links obvious with clear action text and the same colors.

Information Architecture

Information Architecture is the art of organizing content and the science behind structuring information, and at the same time emphasizing the user experience.

Most visitors only notice the architecture when it's poor designed and stops people from finding the relevant information. A good information architecture enables visitors to navigate logically throughout the site, confident in finding the required information.

Accessibility

Internet is being used by all different ages, but also people with disabilities. Content that has been created with screen readers in mind is a very important initiative.

We need to remember that the internet is for everyone and the information within it. Common disabilities that are easy have in mind once developing an web page.

  • Hearing.
  • Visual impairment - Reading.
  • Visual impairment - Colours.

Curious about to know more about accessibility?

Follow this link: W3C guidelines on accessibility (New window)

Screen Readers

Keep in mind that people that are blind can not see the screen. Or some people with visual impairment can not see the content that you wish to show or highlight.

But also people with dyslexia or other type of cognitive and learning disabilities rely on this software tool, screen reader.

 

Methods

Here is some basic methods you can have in mind.

Click count

How many clicks are needed for the user to reach their goal.

Load notification

Notification of server request, while the client are loading the dynamic data. The user must be notified while the data is being proceeded.

Two basic behavior principles above are basic actions to do for a smoother journey.

How to accomplish, step by step.

Show an visual step by step guide on how to get from A to B. What is needed and what actions are required to be done from the user.