01Overview

In 1968 Engelbart’s “Mother of All Demos” showed the mouse, hypertext, video conferencing and collaborative editing. In 1973 Xerox PARC’s Alto combined a bitmap screen, windows and Ethernet into the first modern personal workstation. In 1984 the Macintosh took the GUI to the public; in 1995 Windows 95 took it to the PC.

At the heart of the GUI is direct manipulation: the user sees an object, points at it, acts, and gets immediate feedback. That model later extended to touch (the 2007 iPhone), voice and gesture. HCI research keeps reminding us that an interface is not decoration but a design of cognitive load, feedback latency and accessibility.

02History

  1. 1968

    The Mother of All Demos

    The mouse and hypertext.

  2. 1973

    Xerox Alto

    Bitmap screen and overlapping windows.

  3. 1984

    Macintosh

    The GUI reaches the public.

  4. 1995

    Windows 95

    Graphical interfaces on the PC.

  5. 2007

    iPhone

    Multi-touch.

03Core concepts

Direct manipulation

Act on objects by pointing, dragging and gesturing.

Event loop

The UI thread keeps reading input events and updating the screen.

Usability

Efficiency, learnability and tolerance of error taken together.

04Hands-on

Do it once — it beats reading it ten times

Prototype the same task in two interfaces (command line and GUI) and measure time-to-completion on five people

05Self-check

Say it in your own words first, then open the answer. Whatever you cannot explain is what to review next.

Can you explain "Direct manipulation"?

Act on objects by pointing, dragging and gesturing.

Can you explain "Event loop"?

The UI thread keeps reading input events and updating the screen.

Can you explain "Usability"?

Efficiency, learnability and tolerance of error taken together.

What problem did it solve, and why was there nothing better at the time?

Go back to the history section: how was this done before, and what did it cost?

If you had to build it today, how would you break it down?

Use the hands-on task above: write a plan of at most three steps before you start.

06Key people

D

Douglas Engelbart

1925 – 2013

A pioneer of the mouse, hypertext and collaborative computing.

A

Alan Kay

1940 –

Smalltalk and the Dynabook vision.

07Further reading

  • The Design of Everyday ThingsDon Norman · 1988
  • Human–Computer InteractionDix et al. · 1993