UID: Lesson 01 - Introduction To Interaction Design

welcome to
USER INTERACTION DESIGN
INTRODUCTION TO INTERACTION DESIGN

Lecturer
Itamar Medeiros (Brazil)
BA in Industrial Design;
PgDip in Information Design;
1 /38

Expertise
Multimedia/Web Design,
Photography, Information Design
and Human-Computer Interaction.
CLASSROOM RULES
itamar medeiros

Answer to commands promptly;
No food, no drinks, no games in class;
Always keep your mobile in silent mode;

2 /38
No electronic devices during classtime;

Bring only class related material to class;
Speak English only during instruction.

LESSON 01: INTRODUCTION TO
INTERACTION DESIGN

learning outcome
Students will understand the difference
between designing objects and
designing interaction.
3 /38

INTERACTION DESIGN

content
An overview of the course module program
and expectations.
Defining what is interaction design and

introduction to its applications. 4 /38

INTERACTION DESIGN

materials needed for the course
A sketchbook
A pen or pencil
Glue
5 /38
Scissors

An Internet connection
VISUAL COMMUNICATION
& INTERACTION DESIGN

Early in the growth of the Web, many
graphic designers with backgrounds in
print media* migrated into Web design.
Print Media: Media consisting of paper and ink, reproduced in a printing
process that is traditionally mechanical and photochemical; Written 6 /38
advertising that may be included in everything from newspapers and

magazines to direct mail, signs, and billboards. http://www.google.com/
search?hl=en&q=define%3Aprint+media&btnG=Google+Search

They discovered that the specifics of good
graphic design in print don't always
work so well on the Web*: designers
came to realize that creating effective
Web sites requires solutions to some 7 /38
problems very different from those

addressed by graphic design.
Web: Short for “World Wide Web”; A computer network consisting of a

collection of internet sites that offer text and graphics and sound and
animation resources through the hypertext transfer protocol.http://
www.google.com/search?hl=en&q=define%3Aweb&btnG=Search

Designers such keep in mind the differences
between designing an object* is different
then designing interaction*.
8 /38

ACTIVITY #1
designing objects

1. Consider the following problem:
If a school were to ask you to design a
student, what kind of data/information
would you need to produce that card?
9 /38
2. Make a list of the requirements for that

card, ranking them in order of
importance.

object | 物体
A tangible and visible entity. In visual
communication, we have as examples
posters, packages, logos, brochures, etc.
可触和可见的实物。在视觉传播中，我们可见 10/38
的例子：海报、包装、标志、小册子.


interaction | 互动
An experience that allows two-way
communications on a timely if not real-time
basis, as opposed to an experience in which
information flows only one way on a batch or
scheduled basis; 11/38

建立在如果非实时即及时为基础的一种允许双
向沟通的体验。相对而言，单向沟通体验指
在其中仅仅存在基于批量或者定时为基础的
单向信息流动。
INFORMATION REVOLUTION

One of the most important skills for almost
everyone in the next decade and beyond
will be those that allow use to create
valuable, compelling and empowering
information and experiences for others. 12/38

To do this, we must learn existing ways of
organizing and presenting data and
information and develop new ones.
13/38

Shedroff, N., 2005, “Unified Field of Theory of Design”, viewed 23 February 2006,
http://www.nathan.com/thoughts/unified/4.html
creating experiences

Traditional visual communication has been
primarily associated with producing
messages which are, in most cases not
interactive. Interactivity should not be
confused with animation in which 14/38
objects may move on a screen.


15/38


16/38


Interactivity is concerned with being part of
the action of a system or performance
and not merely watching the action
passively.
17/38

18/38


what is the difference?
Interaction Design
A field and approach to designing
interactive experiences*. These could be
in any medium (such as live events or
performances, products, services, etc.) and 19/38
not only digital media.

Interactive experiences, necessarily, require time as
an organizing principle (though not exclusively) and
Interactive Design is concerned with a user, customer,
audience, or participant's experience flow through time.

what is the difference?
TRADITIONAL USER INTERACTION
VISUAL COMMUNICATION DESIGN
COSTUMER USER ORIENTED

ORIENTED 20/38

marketing strategies user research
advertisement creating experiences
client-defined objectives user-centered
methodologies
INTERACTIVE EXPERIENCES
INTERACTION DESIGN

Think about what experiences are:
How do you create them?
How do you know when they are

21/38
successful?

What are the most satisfying experiences
you can remember?
INTERACTION DESIGN
definition of experience | 体验

The sensation of interaction with a
product, service, or event, through all
of our senses, over time, and on both
physical and cognitive levels.
22/38
通过我们的感官，长时间过程中，生理和

认知水平上的对某种产品、服务或事件等
的交互而产生的感受.
INTERACTION DESIGN
aspects of interaction | 互动

Since our objective is to create interactive
experiences, let’s try to understand the
difference between passive experiences*
-- like watching television or reading a
book -- and interactive experiences -- 23/38

like being able to produce a television
show or add/modify the content of a
book.
Interactivity should not be confused with animation in which objects may

move on a screen. Interactivity is concerned with being part of the action of a
system or performance and not merely watching the action passively.
Passive Interactive

Feedback
Control
Sophisticated Navigation, High Audience Control
Creativity
Creation Tools, Creation Help
24/38
Productivity
Productivity Tools, Living Information

Communications
Adaptivity
Artificial Intelligence, Agents, etc…
ASPECTS OF INTERACTION
control and feedback | 控制与反馈

Aspects of interactivity defined by how
much control users have over the
outcome or the rate, sequence, or type
of action, and how much feedback
exists in the interface. 25/38

观众对某项行动的结果、频率、联系性或
种类的控制程度，以及该界面中反馈存在
的程度。
productivity and creativity | 效率与创意体验

Type of interaction that allows the user to
make, do, or share something
themselves: users must participate by
creating or manipulating instead of
merely watching and consuming. 27/38

创意体验允许用户、创立者或参与者自己
开发、制作及分享事物。创意产品与体验
需要其他人通过创造或操纵，而非观看或
消费的方式来参与其中。
communicative experiences | 交流式体验

Type of interaction that allow users to meet,
talk, share their personal stories and
opinions with other users of the system/
product.
29/38
会面他人、与之交谈、分享个人故事与观

点的机会总是被视为有价值的与有趣的，
由于他们的经历包含了两个或以上的人，
并包含了高层次的控制、。
USER INTERACTION DESIGN INTRODUCTION TO INTERACTION DESIGN
30/38
adaptive experiences | 适应性体验

Type of interaction based on technologies
that changes the experience based on
the behavior* of the user. These can
include agents*, modifying behaviors,
and artificial intelligence*. 31/38

适应性科技是指那些在用户、读者、消费
者或演员行为的基础上改变其体验的科
技，其中包括媒介体、修整性行为和人工
智能。

So, we come back to the question:
how does one create meaningful
experiences and interactions?
We must first revisit our goals* and 34/38
messages and reevaluate the kinds of

experiences we want our audience to
have. We must also ask them what their
needs* and wants* are with regard to
these experiences.
ACTIVITY #2
interactive products

1. Divide yourselves into groups
of 2 (two) people
2. In your groups, discuss

-- at least -- 3 (three) ideas 35/38
of possible interactive products

your group might implement as
their final project for the course.
Passive Interactive

Feedback
Control
Sophisticated Navigation, High Audience Control
Creativity
Creation Tools, Creation Help
36/38
Productivity
Productivity Tools, Living Information

Communications
Adaptivity
Artificial Intelligence, Agents, etc…
HOMEWORK [ GROUPS ]
interactive products

1. In your groups, create the concept of
-- at least -- 3 (three) ideas
of possible interactive products
your group might implement as
their final project for the course. 37/38

2. Find 5 (five) examples of similar
interactive products for each of the
concepts you’ve create:
15 (fifteen) screenshots.
HOMEWORK [ INDIVIDUAL ]
sketchbook

1. Choose 5 (five) words marked with
asterisks (*) you’ve seen in this class and
look up for their definitions in an
English dictionary;
38/38
2. Write the definitions of the words you’ve

chosen in a sketchbook, adding -- at
least -- 3 (three) pictures and 2 (two)
websites to help illustrate your
definitions; you should comment your
definitions and choices of pictures/
websites.

UID: Lesson 01 - Introduction To Interaction Design

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

UID: Lesson 01 - Introduction To Interaction Design

Uploaded by

Copyright:

Available Formats

welcome to

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

No food, no drinks, no games in class;

Always keep your mobile in silent mode;

No electronic devices during classtime;

USER INTERACTION DESIGN

Speak English only during instruction.

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

Defining what is interaction design and

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

advertising that may be included in everything from newspapers and

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

problems very diﬀerent from those

USER INTERACTION DESIGN

Web: Short for “World Wide Web”; A computer network consisting of a

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

2. Make a list of the requirements for that

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

objects may move on a screen.

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

not only digital media.

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

COSTUMER USER ORIENTED

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

How do you create them?

How do you know when they are

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN

Interactivity should not be confused with animation in which objects may

INTRODUCTION TO INTERACTION DESIGN

USER INTERACTION DESIGN