Download presentation
Presentation is loading. Please wait.
Published byOscar Kelley Modified over 9 years ago
1
Interface design Multimedia and Web
2
Today’s Objectives Defined User Interface Design Introduce User-Center Design Design guidelines Check Web accounts FTPing
3
IS IT EASY TO DESIGN INTERFACES?
4
What do you think happens here?
5
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
6
How does this door open? Door number 1. Materials by CS 5115 USER INTERFACE DESIGN, IMPLEMENTATION AND EVALUATION, by Dr. Loren Terveen
7
How does this door open? Door number 2. Materials by CS 5115 USER INTERFACE DESIGN, IMPLEMENTATION AND EVALUATION, by Dr. Loren Terveen
8
Door #1 Door number 1 - again.
9
Door number 2 - again. Door #2
10
How does this door open? Door number 3.
11
No instructions needed. Door number 3. The door affords the act of pushing. We know to push outward by looking at it. Affordance!
12
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
13
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
14
Interfaces We often use things with which people are familiar to help them understand how controls can be used in the digital world.
15
Interfaces Command prompt? Direct Manipulation? Reduces cognitive load
16
OPEN Which of the following two items most looks like a button? Why?
18
Buttons look like physical buttons to make them easier to understand their purpose and function.
19
We make buttons look like physical buttons so they are easier to understand?
20
Physical design – raise Action – press and release and something happens
21
Why not?
22
Why not like this? Digital version.
23
Design interfaces Think about interfaces that implement web search. Evaluate from the perspective of knowing where and how to enter a search query.
24
We know what to do – minimalist design.
27
Don’t make me think! When I search CNN I get Web-wide results? But I want to search CNN.
28
Don’t make me think! So what’s the big deal?
29
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
30
Limited amount of time to convey message. Don’t waste time by making people think about the design.
31
CNN News is now the default (08-21-09)
32
Website examples Let’s look at a few websites.
33
Design interfaces: Examples http://www.sonicdrivein.com/home.jsp#/home http://www.staples.com (text size) http://www.staples.com
34
Design interfaces: Examples http://www.zincbistroaz.com/
35
Design interfaces: Examples http://www.bicsportsurfboards.com/
36
Design interfaces: Examples http://nfl.com/
37
Design interfaces: Examples http://www.webpagesthatsuck.tv/images/marshill.html
38
Design interfaces: Examples Should be able to look at a home page and figure out what the site is about within four seconds. http://www.webpagesthatsuck.tv/images/marshill.html http://www.marshill.org/ http://marshillglobal.com/marshillglobal.com
39
Design interfaces: Examples http:// www.3cgraphics.com / http:// www.3cgraphics.com / What is it about? What’s good/bad?
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.