Upload
zumei-wu
View
768
Download
2
Embed Size (px)
DESCRIPTION
introduct
Citation preview
INTER
AC
TI
ON
DESI
GN The general process of a website development
Initiate a project
Identify needs
Competitive analysis
Code webpages
Graphic design
Interaction design
Build the website Evaluation
INTER
AC
TI
ON
DESI
GN
What is interaction design?
Traditional design pays attention to
• visual feeling --- graphic design, industrial design
Traditional design pays attention to
• tactile feeling --- human engineering
According to Norman in his emotional design, visual and tactile design are belong to one of the three design dimensions -- Visceral design.
The three design dimensions
Visceral design is about how things look, feel and sound. It brings sense surprise.
Visceral design > form Behavioral design > use & performanceReflective design > the meaning of things, self-
image
The three design dimensions
Simple explanations:
Visceral design pays attentions to user’s first feeling of the product, for example: beauty.
The three design dimensions
v.s.
Simple explanations:
Behavioral design pays attentions to user experience, such as usability and functional design.
The three design dimensions
Simple explanations:
Behavioral design pays attentions to user’s feeling after use this product, for example, user will feel satisfied and fun after use roller coaster .
The three design dimensions
Interaction design was mainly about the second dimension: behavioral design.
• Beautiful
• Practical
• Pleasant
A good design would contain these three dimensions, and make the product:
The three design dimensions
Definition of interaction design
interaction design is about defining the behaviour of artefacts, environments, and systems (for example, products).
Jodi Forlizzi & Robert Reimann
Unlike traditional design that focuses on style, interaction design first define behavioral process, and then try to find the most efficient way to convey this process.
A simple explanation of interaction design by myself:
Interaction design is to design interactive process between user and product based on investigation of user behavior, so that it could help user to achieve their goal easier and better.
INTER
AC
TI
ON
DESI
GN
Example of interaction design
Please try to point out the playing song inside this player.
?
?
?
?
In fact it is this song, but can you find it quickly ?
Please try to point out the playing song inside this player.
Compared to previous player, you could noticed the playing song quickly in this player.
The squint test (squint your eyes to check design work in blur)
There is three main parts in these players: play part, list part, recommendation part. It is obviously that the right one is more distinct.
Although the left player mimicked windows media player, it didn’t catch the distinct point.
Interaction design includes not only mini details, but also whole process such as flow chart, and translates it into wire flame.
会员,跳转页面进入深航页面,选择机票(头等舱和商务舱都无座),下一步
填写旅客信息和人数,显示机票价格,上一步 下一步
生成订单,上一步 财付通支付
Qq 会 员登 录 验证 ,弹 出登录框
非会员,弹出框中提示,更换 qq 号码 成为会员( 弹 出 框 可 以 关闭)
Qq 会员登录验证
进入活动首页,点击预定或者查询
Definition:
User experience (UX) is the way a person feels about using a product, system or service.
User experience
The objective of interaction design is to support better user experience.
According to Alan Cooper, user experience design contains three aspects: form , content , behavior. Interaction design is part of it.
Content Information architects
Copywritersanimators
Sound designers
BehaviorInteraction designers
Form Graphic designers
Industrial designers
Interaction design methodsCard Sortingit is tool to observe how users categorize information, which could help you organize the website information.-------------------------------------------------Contextual InterviewsIt is a user research method that applies ethnographic observation and one-on-one interviewing to understand the task procedures that users follow to reach their goals.-------------------------------------------------Focus GroupsA Moderator facilitates a small group of participants for discussion, so that you could understand users’ ideas, attitudes and needs.-------------------------------------------------Heuristic Evaluation Heuristic evaluation involves having a small set of evaluators examine the interface and judge its compliance with recognized usability principles.
Individual InterviewsIndividual interviews typically refer to talking with one user at a time , which c can give you a deep understanding of the people who come to your site. -------------------------------------------------- Parallel DesignSeveral people create an initial design from the same set of requirements. This process helps to generate many different, diverse ideas and ensures that the best ideas from each design are integrated into the final concept.--------------------------------------------------PersonasA persona is a fictional person who represents a major user group for your website site, which could help the team focus on the users’ goals and needs.--------------------------------------------------PrototypingIt is a draft version of a Web site, which could be used for testing before investing time and money into development .
Interaction design methods
SurveysIt is a way to conduct online or paper questionnaires among users to collect their responses of the web site.--------------------------------------------------Task AnalysisIt means learning about specific task users must do to meet those goals and what steps they take to accomplish those tasks.--------------------------------------------------Usability TestingUsability testing is a technique used to evaluate a product by testing it with representative users. In the test, these users will try to complete typical tasks while observers watch, listen and takes notes.--------------------------------------------------Use Cases Use cases describe the interaction between a primary actor (the initiator of the action) and the system itself.--------------------------------------------------
Interaction design methods
INTER
AC
TI
ON
DESI
GN
THANKS, THE END….
Zumei 2012-09-28