Interface design Multimedia and Web

Today’s Objectives Defined User Interface Design Introduce User-Center Design Design guidelines Check Web accounts FTPing

IS IT EASY TO DESIGN INTERFACES?

What do you think happens here?

Is it easy to design interfaces? Let’s see a simple interface  A door  A couple simple functions, open and close Materials by CS 5115 USER INTERFACE DESIGN, IMPLEMENTATION AND EVALUATION, by Dr. Loren Terveen

How does this door open? Door number 1. Materials by CS 5115 USER INTERFACE DESIGN, IMPLEMENTATION AND EVALUATION, by Dr. Loren Terveen

How does this door open? Door number 2. Materials by CS 5115 USER INTERFACE DESIGN, IMPLEMENTATION AND EVALUATION, by Dr. Loren Terveen

Door #1 Door number 1 - again.

Door number 2 - again. Door #2

How does this door open? Door number 3.

No instructions needed. Door number 3. The door affords the act of pushing. We know to push outward by looking at it. Affordance!

The design of the control tells us how to use it Door number 3. The door affords the act of pushing. We know to push outward by looking at it. Affordance! Clues about functionality

Design interfaces Instructions needed = Failure Door operation is simple and should be kept simple. The door design needs:  Visibility  Actions should be obvious  Design gives clues about it functionality

Interfaces We often use things with which people are familiar to help them understand how controls can be used in the digital world.

Interfaces Command prompt? Direct Manipulation? Reduces cognitive load

OPEN Which of the following two items most looks like a button? Why?

Buttons look like physical buttons to make them easier to understand their purpose and function.

We make buttons look like physical buttons so they are easier to understand?

Physical design – raise Action – press and release and something happens

Why not?

Why not like this? Digital version.

Design interfaces Think about interfaces that implement web search. Evaluate from the perspective of knowing where and how to enter a search query.

We know what to do – minimalist design.

Don’t make me think! When I search CNN I get Web-wide results? But I want to search CNN.

Don’t make me think! So what’s the big deal?

Don’t make me think! Users spend 27 seconds on a Web page. Users spend 1 minute 49 sec on a site. Nielsen & Loranger, 2006

Limited amount of time to convey message. Don’t waste time by making people think about the design.

CNN News is now the default ( )

Website examples Let’s look at a few websites.

Design interfaces: Examples (text size)

Design interfaces: Examples

Design interfaces: Examples

Design interfaces: Examples

Design interfaces: Examples

Design interfaces: Examples Should be able to look at a home page and figure out what the site is about within four seconds

Design interfaces: Examples / /  What is it about?  What’s good/bad?