UI Guidance Principles

Usability Explained Simply — FIT3175 at Monash University Notes

Deep Bhattacharyya
DeeplyDiligent Blog
3 min readJan 21, 2019

--

There Are 6 Guidelines for Good UI Design

Make sure you use these instead of just using your intuition

  • Theories: provides context — used for system design
  • Models: abstractions of theories/generalisations
  • Principles: application of theory in high level

Then on a low level:

  • Standards/Guide lines/Style Guides are consistent for whole organisation

Two Types of Usability Theories

  • Explanatory theories describe sequence of events
  • Predictive theories compare a metric between two proposed design

Four Areas of UI Design

  • Perceptual theory: how information is acquired (vision, hearing etc)
  • Cogintive theory: human memory (mnemonics)
  • Motor task performance (pointer movement)
  • Social interaction (how people communicate)

The Four Main Theories Of Usability

Attention

  • Selecting things to focus on
  • Can be selective (someone chooses to pay attention to one thing and ignores rest) or divided (multitasking)

Perception and recognition

  • How information is acquired (5 senses) and how we then experience it
  • Visual and auditory (in 3d space)
  • Also includes depth perception and haptic feedback for touch
  • Make sure visuals are clear, sounds are 3d and there is proper feedback
  • Gestalt principles: Way of organising elements on screen, grouping elements which do similar tasks

Memory

  • Store then -> recall or recognise
  • Context is important when recalling
  • We better remember things when we pay more attention

Why Is a GUI Better than the Command line?

  • Our memory can recognise much better than it can recall

How many items can we recall?

  • 7 ±2, but this only applies to recall (eg. git commands). We can recognise more than 100 things on screen at once (eg. buttons and icons).

Social Interactions

Social interactions are taken into account by usability experts to abstract human communication.

4 Areas of Focus

  • Human communication (Formal relationships)
  • Groups (can change a person’s behaviour)
  • Presence (tech should be easy to fit into people’s current lives)
  • Culture and identity (internet could impede diversity of thought)

What are Models?

Abstractions of the real world

There are many models used to abstract human computer interaction:

Information Processing Model:

  • Process: Input -> encoding -> comparison -> selecting a response -> executing -> output
  • Doesn’t consider external world

External Cognition:

  • Our Interpretation of external representations of reality (eg. Books, movies)
  • Aids to cognition are pens, calculator

Other Types of Aids Include:

  • Annotation (modifying existing representations using marks)
  • Computational offloading (a tool + representation is used to solve problem; eg. Calculator + math problem)
  • Cognitive tracing (rearranging letters: externally manipulating)

Norman’s 7 stage model

  • The stages:

What is the gulf of execution and evaluation?

  • Gulf of Execution is a mismatch between the user’s intentions and actions, whereas the gulf of evaluation

Norman’s Principles of Good Design

Discoverability:

  • users can use just by looking on screen (menus should be obvious)

Feedback:

  • Communicating results of an action after done

Conceptual Model Consistency

  • Design must be consistent with people’s mental models
  • (eg. Button functions like real one)

Affordance

  • Appearance of object ==suggests==> how it should be used

Signifiers

  • Signal things that could possibly be done
  • Not the same as affordance

Natural Mappings

  • Mapping from on screen -> real world

Constraints

  • Limit the actions that can be done, so users cant make as many errors

--

--

Deep Bhattacharyya
DeeplyDiligent Blog

Full Stack Developer at Learnmate, Australia's Largest Tutoring Agency. I love to share my passion in tech and finance. https://deeplydiligent.github.io/