<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>00&#039;s UX Adventure &#187; ux</title>
	<atom:link href="http://www.uegeek.com/tag/ux/feed" rel="self" type="application/rss+xml" />
	<link>http://www.uegeek.com</link>
	<description>Be a reader. Be a doer.</description>
	<lastBuildDate>Sun, 01 Jan 2012 06:35:47 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>咬文嚼字之 什么是交互设计</title>
		<link>http://www.uegeek.com/ixd/df_interaction_design</link>
		<comments>http://www.uegeek.com/ixd/df_interaction_design#comments</comments>
		<pubDate>Sat, 19 Feb 2011 11:20:15 +0000</pubDate>
		<dc:creator>00</dc:creator>
				<category><![CDATA[交互设计]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[IxD]]></category>
		<category><![CDATA[ux]]></category>

		<guid isPermaLink="false">http://www.uegeek.com/?p=643825</guid>
		<description><![CDATA[“咬文嚼字”系列的目的，是为了记录对一些基本概念或常见词语的理解。概念其实比我们想象中要重要，因为无效的沟通往往有一个特点：双方对基本概念的理解根本就不同。 —————————————————————————————————————— 虽然冒着成为书呆子和学究的风险，但还是有必要想一想什么叫做“交互设计”（百度百科上的词条实在不太好理解&#62;&#60;），毕竟每天都要听/说上个十几回。下面是一些不成熟的想法，欢迎拍打~ 让我们先来对这个词做一下拆解：神马是设计？神马是交互？神马是人机交互？神马是交互设计？神马是好的交互设计？ 什么是设计？ 00的理解：设计是将问题的解决方案进行可视化 设计和艺术（art）最显著的区别在于目的不同 设计：为了解决问题、传递信息、促进沟通 艺术：为了自我表达、激发灵感、引起情感共鸣 两者还有其他方面的差异 设计：表达的是对问题和服务对象的理解 艺术：表达的是对艺术家自己、对外在世界的理解 设计：更多是将已经存在的东西更好地联系起来、表现出来 艺术：更多是从无到有的创造 与其将设计与艺术做比较，不如类比设计与规划（plan）：两者都是基于问题的解决方案，以及解决方案的实施。设计侧重于可视化，规划侧重于系统化和操作性。 什么是交互？ 00的理解：交互是两个实体之间的关系（relation）、行为（behavior）和响应（action &#38; reaction） 这两个实体的特征分别是什么？ 它们的关系是什么？ 它们的关系是否会变化及如何变化？ 它们会有哪些独立行为及相互行为？ 这些行为之间如何响应？ 相互行为对它们分别有怎样的影响？ …… 什么是人机交互？ 人机交互指系统和使用者之间的互动关系（wiki） 什么是交互设计？ 我们来看看一些交互设计的定义吧~ 1. Interaction design (IxD) defines the structure and behavior of interactive systems. (wiki) 交互设计，又称互动設計，(Interaction Design, 缩写 IxD 或者 IaD),是定义、设计人造系统的行为的设计领域。人造物，即人工制成物品，例如，软件、移动设备、人造环境、服务、可佩带装置以及系统的组织结构。交互设计在于定义人造物的行为方式,即人工制品在特定场景下的反应方式)相关的界面。（wiki） 2. Interaction designers strive to create [...]]]></description>
			<content:encoded><![CDATA[<div id="_mcePaste">“咬文嚼字”系列的目的，是为了记录对一些基本概念或常见词语的理解。概念其实比我们想象中要重要，因为无效的沟通往往有一个特点：双方对基本概念的理解根本就不同。</div>
<div>——————————————————————————————————————</div>
<div>虽然冒着成为书呆子和学究的风险，但还是有必要想一想什么叫做“交互设计”（<a href="http://baike.baidu.com/view/426920.htm" target="_blank">百度百科上的词条</a>实在不太好理解&gt;&lt;），毕竟每天都要听/说上个十几回。下面是一些不成熟的想法，欢迎拍打~</div>
<div>
<p>让我们先来对这个词做一下拆解：神马是设计？神马是交互？神马是人机交互？神马是交互设计？神马是好的交互设计？</p>
</div>
<h3>什么是设计？</h3>
<h4><a href="http://www.uegeek.com/" target="_blank">00</a>的理解：<span style="color: #993300;">设计是将问题的解决方案进行可视化</span></h4>
<div id="_mcePaste">设计和艺术（art）最显著的区别在于目的不同</div>
<div>
<ul>
<li>设计：为了解决问题、传递信息、促进沟通</li>
<li>艺术：为了自我表达、激发灵感、引起情感共鸣</li>
</ul>
</div>
<div>两者还有其他方面的差异</div>
<div>
<ul>
<li>设计：表达的是对问题和服务对象的理解</li>
<li>艺术：表达的是对艺术家自己、对外在世界的理解</li>
</ul>
</div>
<div>
<ul>
<li>设计：更多是将已经存在的东西更好地联系起来、表现出来</li>
<li>艺术：更多是从无到有的创造</li>
</ul>
</div>
<div>与其将设计与艺术做比较，不如类比设计与规划（plan）：两者都是基于问题的解决方案，以及解决方案的实施。设计侧重于可视化，规划侧重于系统化和操作性。</div>
<h3>什么是交互？</h3>
<h4><a href="http://www.uegeek.com/" target="_blank">00</a>的理解：<span style="color: #993300;"><strong>交互是两个实体之间的关系（relation）、行为（behavior）和响应（action &amp; reaction）</strong></span></h4>
<div id="_mcePaste">
<ul>
<li>这两个实体的特征分别是什么？</li>
<li>它们的关系是什么？</li>
<li>它们的关系是否会变化及如何变化？</li>
<li>它们会有哪些独立行为及相互行为？</li>
<li>这些行为之间如何响应？</li>
<li>相互行为对它们分别有怎样的影响？</li>
<li>……</li>
</ul>
</div>
<h3>什么是人机交互？</h3>
<div>人机交互指系统和使用者之间的互动关系（<a href="http://zh.wikipedia.org/zh/%E4%BA%BA%E6%9C%BA%E4%BA%A4%E4%BA%92" target="_blank">wiki</a>）</div>
<h3>什么是交互设计？</h3>
<div id="_mcePaste">
<div id="_mcePaste">
<div>我们来看看一些交互设计的定义吧~</div>
</div>
<div>1.</div>
<div>
<blockquote>
<div>Interaction design (IxD) defines the structure and behavior of interactive systems. (<a href="http://en.wikipedia.org/wiki/Interaction_design" target="_blank">wiki</a>)</div>
</blockquote>
<blockquote>
<div>交互设计，又称互动設計，(Interaction Design, 缩写 IxD 或者 IaD),是定义、设计人造系统的行为的设计领域。人造物，即人工制成物品，例如，软件、移动设备、人造环境、服务、可佩带装置以及系统的组织结构。交互设计在于定义人造物的行为方式,即人工制品在特定场景下的反应方式)相关的界面。（<a href="http://zh.wikipedia.org/wiki/%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" target="_blank">wiki</a>）</div>
</blockquote>
</div>
<div id="_mcePaste">2.</div>
<div>
<blockquote>
<div>Interaction designers strive to create useful and usable products and services. Following the fundamental tenets of user-centered design, the practice of interaction design is grounded in an understanding of real users—their goals, tasks, experiences, needs, and wants. Approaching design from a user-centered perspective, while endeavoring to balance users’ needs with business goals and technological capabilities, interaction designers provide solutions to complex design challenges, and define new and evolving interactive products and services.</div>
</blockquote>
<div>(<a href="http://www.uxbooth.com/blog/complete-beginners-guide-to-interaction-design/" target="_blank">The Interaction Design Association (IxDA) </a>)</div>
</div>
<div id="_mcePaste">3.</div>
<blockquote>
<div>IxD is about shaping our everyday life through digital artifacts.  We not only design what it looks like, but also how it behaves, and we&#8217;re designing the quality of the way we interact with the system.</div>
</blockquote>
<div>(Gillian Crampton Smith)</div>
<div>4.</div>
<div>
<blockquote>
<div>技术为中心的观点：将原材料塑造出人们喜欢使用的产品；</div>
<div id="_mcePaste">行为学派观点：定义人造物、环境和系统的行为；</div>
<div id="_mcePaste">社会交往设计的观点：利用产品来促进人与人之间的沟通</div>
</blockquote>
<div>(<a href="http://book.douban.com/subject/4881989/" target="_blank">Dan Saffer</a>)</div>
</div>
<div>5.</div>
</div>
<blockquote>
<div>交互设计是指设计人和产品或服务互动的一种机制</div>
</blockquote>
<div>（<a href="http://www.slideshare.net/ixdlab/ss-5451190" target="_blank">via</a>）</div>
<div>
<div>
<p>还是挺晕吧？从这些定义我们大致可以了解，交互设计是关于系统、人的行为、互动、产品的机制定义。</p>
</div>
<div>
<ul>
<li>因为IxD是设计的一种，so，它的目标是要<strong>解决问题</strong>，利用提供的材料在特定的环境下解决特定的问题。</li>
<li>因为设计有目的有对象（人/受众），so，设计要基于对人的理解，而对IxD而言，更重要是要<strong>基于对人的目标和行为模式的理解</strong>。</li>
<li>因为IxD是为实体间的互动进行设计，so，它天生具有场景性，人与系统是在一定的环境、条件下发生关系、进行互动。</li>
</ul>
</div>
</div>
<h4><a href="http://www.uegeek.com/" target="_blank">00</a>对交互设计的理解：</h4>
<h4><span style="color: #993300;">根据用户的目标和期望，对用户与系统交互过程中的行为方式和所感知、接触的元素进行定义、规划和设计，以平衡用户与系统利益的方式，引导交互行为容易、有效、愉悦地完成</span>。</h4>
<div id="_mcePaste">
<p>上面提及的都是广义的交互设计，我们平时谈论更多的交互设计是人机界面交互设计（HCIID：Human-Computer Interface Interaction Design），而我们的工作领域主要是<strong>互联网用户界面交互设计</strong>（IUIID：Internet User Interface Interaction Design），这里的界面主要包括web界面、移动设备界面、客户端界面。</p>
</div>
<div>
<p>还需要说明的是，正如体验实际上是不能被“设计”（只能为更佳的体验进行设计）的，<strong>行为也是不能被“设计”的</strong>，但是我们可以设计交互方式（怎样的交互行为可行？），以引导行为的发生，进而达到目的。</p>
</div>
<h3>什么是好的交互设计？</h3>
<h4><a href="http://www.uegeek.com/" target="_blank">00</a>的理解：好的交互设计提供有用（useful）和可用（usable）的解决方案，能最有效地传达信息，激发、帮助用户高效地完成某个任务，并且在这个过程中感觉满意、愉悦。</h4>
<h3>简而言之</h3>
<div>
<p>嚼了半天，我们是不是可以这样理解：</p>
<h4>交互设计本质上是为使用者提供贴心、周全的服务而做的设计方面的所有努力</h4>
</div>
<p><img class="alignnone" src="http://pic.yupoo.com/uegeek/ARo9BFv6/dey6l.gif" alt="" width="89" height="77" /></p>
<div>by <strong><a href="http://www.uegeek.com/" target="_blank">00</a></strong></div>
<p><a class="a2a_button_sina_weibo" href="http://www.addtoany.com/add_to/sina_weibo?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;linkname=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" title="Sina Weibo" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/sina_weibo.png" width="16" height="16" alt="Sina Weibo"/></a><a class="a2a_button_delicious" href="http://www.addtoany.com/add_to/delicious?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;linkname=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" title="Delicious" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/delicious.png" width="16" height="16" alt="Delicious"/></a><a class="a2a_button_google_reader" href="http://www.addtoany.com/add_to/google_reader?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;linkname=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" title="Google Reader" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/reader.png" width="16" height="16" alt="Google Reader"/></a><a class="a2a_button_evernote" href="http://www.addtoany.com/add_to/evernote?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;linkname=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" title="Evernote" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/evernote.png" width="16" height="16" alt="Evernote"/></a><a class="a2a_button_instapaper" href="http://www.addtoany.com/add_to/instapaper?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;linkname=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" title="Instapaper" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/instapaper.png" width="16" height="16" alt="Instapaper"/></a><a class="a2a_button_email" href="http://www.addtoany.com/add_to/email?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;linkname=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" title="Email" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/email.png" width="16" height="16" alt="Email"/></a><a class="a2a_button_printfriendly" href="http://www.addtoany.com/add_to/printfriendly?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;linkname=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" title="PrintFriendly" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/printfriendly.png" width="16" height="16" alt="PrintFriendly"/></a><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.uegeek.com%2Fixd%2Fdf_interaction_design&amp;title=%E5%92%AC%E6%96%87%E5%9A%BC%E5%AD%97%E4%B9%8B%20%E4%BB%80%E4%B9%88%E6%98%AF%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1" id="wpa2a_2">Share it!</a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uegeek.com/ixd/df_interaction_design/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>良好网络广告体验的“FACT”法则</title>
		<link>http://www.uegeek.com/ue/fact_rule_of_better_online_ads</link>
		<comments>http://www.uegeek.com/ue/fact_rule_of_better_online_ads#comments</comments>
		<pubDate>Sun, 25 Jul 2010 13:44:26 +0000</pubDate>
		<dc:creator>00</dc:creator>
				<category><![CDATA[行业杂谈]]></category>
		<category><![CDATA[ad]]></category>
		<category><![CDATA[ux]]></category>

		<guid isPermaLink="false">http://www.uegeek.com/?p=643660</guid>
		<description><![CDATA[广告，已经成为在线生活的一部分，当我们关注网站和产品的用户体验时，广告不应该被忽视。 说起广告，不少设计师会眉头一皱：多少次，自己在设计时一个作品时，对每一个细节都力求完美：风格、布局、用色、对比、平衡……结果产品上线后，旁边有一个大大的广告位，充满声光电效果的flash动画让人无“语”伦比。而在跟用户的面对面交流中，用户对广告大都抱持一种理解的态度，但总免不了提到“广告再少点儿”的期望。 我们都有过被设计粗糙、广告满天飞的网站所折磨的经历，在大家的印象中，广告与用户体验总是以一种此消彼长的关系出现。但是，当广告不可避免地成为在线体验的一部分的时候，我们不应再简单地将它与体验对立起来，陷入在非此即彼的争论中，而应该更深入地思考两者之间的关系：如何平衡广告与用户体验的关系， 如何提升广告本身的用户体验、如何通过广告提升网站/产品的用户体验，这些都是成功产品要解决的关键问题。 1.网络广告的分类和市场表现 首先简要回顾一下网络广告的一些基本知识。 关于网络广告的分类，并没有一个绝对权威的统一标准，很多资料提到的分类和描述都不一样，我们关心的主要还是常见的广告形式。 网络广告常用的计费方式包括 CPM（Cost Per Thousand Impression）：按每1000次广告展示进行计费。 CPC（Cost Per Click）：每点击成本，以点击一次广告进行计费。 CPA（Cost Per Action）：每行动成本，按广告投放实际效果计费。 CPR（Cost Per Response）：每回应成本，以浏览者的每一个回应计费。 CPS（Cost Per Sale）：以实际销售产品数量来计费。 CPP（Cost Per Purchase）：每购买成本，按产品购买行为进行计费。 CPL（Cost Per Leads）：以搜集潜在客户名单多少来计费。 近年来，网络广告（尤其是传统横幅广告）的点击效果不断下降，传统网络广告形式正逐渐被搜索广告、富媒体广告所取代。 2.网络广告研究的一些启发 网络广告的体验，应与广告和受众接触的整个过程相关。但以往研究主要关注“到达”和“注意”这两部分的效果。 现在对广告的研究，会更全面地考察用户与广告互动的整个过程：从接触情境（用户动机、模式和信息处理过程）到广告展现（类型、形式、要素），再到广告效果。而对广告效果的评估，除了关注用户的点击行为，还开始重视用户在接触广告的过程和结果中，有哪些认知和态度方面的因素，会对广告效果产生影响。这有助于我们更深入地了解广告和用户体验的关系。 Nielsen结合他人和自己的研究给出了十个最不受欢迎的广告设计要素，弹窗广告高居榜首。而其他包含以下特征的广告，也容易引起消极情绪和挫败感，用户可能会主动忽略： 干扰目的、打断操作 欺骗性质 侵略式 用户无法控制 另外，眼动研究揭示了一种重要的现象：横幅广告或看起来像广告的信息（例如红色的大字体）往往被用户忽略，也就是Banner Blindness。 3.良好网络广告体验的“FACT”法则 那么，如何对广告进行优化，以创造更好的在线广告体验呢？ 让我们从以下四个方面着手： ①Form-形式 什么是好的广告形式？ 与网站设计风格尽可能一致 内容相关、位置合适 富有创意和视觉吸引力 互动性 可预知操作结果 如何引人注意？ 表达具体、直白 提供可操作的选择 与目的或当前主题相关 [...]]]></description>
			<content:encoded><![CDATA[<p>广告，已经成为在线生活的一部分，当我们关注网站和产品的用户体验时，广告不应该被忽视。</p>
<p>说起广告，不少设计师会眉头一皱：多少次，自己在设计时一个作品时，对每一个细节都力求完美：风格、布局、用色、对比、平衡……结果产品上线后，旁边有一个大大的广告位，充满声光电效果的flash动画让人无“语”伦比。而在跟用户的面对面交流中，用户对广告大都抱持一种理解的态度，但总免不了提到“广告再少点儿”的期望。</p>
<p>我们都有过被设计粗糙、广告满天飞的网站所折磨的经历，在大家的印象中，广告与用户体验总是以一种此消彼长的关系出现。但是，当广告不可避免地成为在线体验的一部分的时候，我们不应再简单地将它与体验对立起来，陷入在非此即彼的争论中，而应该更深入地思考两者之间的关系：如何平衡广告与用户体验的关系， 如何提升广告本身的用户体验、如何通过广告提升网站/产品的用户体验，这些都是成功产品要解决的关键问题。</p>
<h3>1.网络广告的分类和市场表现</h3>
<p>首先简要回顾一下网络广告的一些基本知识。</p>
<p>关于网络广告的分类，并没有一个绝对权威的统一标准，很多资料提到的分类和描述都不一样，我们关心的主要还是常见的广告形式。</p>
<p><img class="alignnone" title="在线广告分类" src="http://pic.yupoo.com/uegeek/826319a67507/uwfjouhq.jpg" alt="" width="707" height="303" /></p>
<p><span id="more-643660"></span></p>
<p>网络广告常用的计费方式包括</p>
<ul>
<li>CPM（Cost Per Thousand Impression）：按每1000次广告展示进行计费。</li>
<li>CPC（Cost Per Click）：每点击成本，以点击一次广告进行计费。</li>
<li>CPA（Cost Per Action）：每行动成本，按广告投放实际效果计费。</li>
<li>CPR（Cost Per Response）：每回应成本，以浏览者的每一个回应计费。</li>
<li>CPS（Cost Per Sale）：以实际销售产品数量来计费。</li>
<li>CPP（Cost Per Purchase）：每购买成本，按产品购买行为进行计费。</li>
<li>CPL（Cost Per Leads）：以搜集潜在客户名单多少来计费。</li>
</ul>
<p>近年来，网络广告（尤其是传统横幅广告）的点击效果不断下降，传统网络广告形式正逐渐被搜索广告、富媒体广告所取代。</p>
<p><img class="alignnone" title="ad_market_share" src="http://pic.yupoo.com/uegeek/803329a677ee/zitrbe4l.jpg" alt="" width="545" height="278" /></p>
<h3>2.网络广告研究的一些启发</h3>
<p>网络广告的体验，应与广告和受众接触的整个过程相关。但以往研究主要关注“到达”和“注意”这两部分的效果。</p>
<p><img class="alignnone" title="adprocess" src="http://pic.yupoo.com/uegeek/931529a67ac4/d2iliule.jpg" alt="" width="600" height="153" /></p>
<p>现在对广告的研究，会更全面地考察用户与广告互动的整个过程：从接触情境（用户动机、模式和信息处理过程）到广告展现（类型、形式、要素），再到广告效果。而对广告效果的评估，除了关注用户的点击行为，还开始重视用户在接触广告的过程和结果中，有哪些认知和态度方面的因素，会对广告效果产生影响。这有助于我们更深入地了解广告和用户体验的关系。</p>
<p>Nielsen结合他人和自己的研究给出了<a href="http://www.useit.com/alertbox/20041206.html" target="_blank">十个最不受欢迎的广告设计要素</a>，弹窗广告高居榜首。而其他包含以下特征的广告，也容易引起消极情绪和挫败感，用户可能会主动忽略：</p>
<ul>
<li>干扰目的、打断操作</li>
<li>欺骗性质</li>
<li>侵略式</li>
<li>用户无法控制</li>
</ul>
<p>另外，眼动研究揭示了一种重要的现象：横幅广告或看起来像广告的信息（例如红色的大字体）往往被用户忽略，也就是<strong>Banner Blindness</strong>。</p>
<p><img class="alignnone" title="banner blindness" src="http://pic.yupoo.com/uegeek/290259a67f7b/h18y612r.jpg" alt="" width="598" height="364" /></p>
<h3>3.良好网络广告体验的“FACT”法则</h3>
<p>那么，如何对广告进行优化，以创造更好的在线广告体验呢？</p>
<p>让我们从以下四个方面着手：</p>
<p><img class="alignnone" title="fact" src="http://pic.yupoo.com/uegeek/832579a68140/rt6isv9e.jpg" alt="" width="600" height="363" /></p>
<h4>①Form-形式</h4>
<p>什么是好的广告形式？</p>
<ul>
<li>与网站设计风格尽可能一致</li>
<li>内容相关、位置合适</li>
<li>富有创意和视觉吸引力</li>
<li>互动性</li>
<li>可预知操作结果</li>
</ul>
<p>如何引人注意？</p>
<ul>
<li>表达具体、直白</li>
<li>提供可操作的选择</li>
<li>与目的或当前主题相关</li>
<li>不像推销</li>
</ul>
<p>最能吸引眼球的设计要素有哪些？</p>
<ul>
<li>纯文本</li>
<li>脸部</li>
<li>身体部位</li>
<li>形似内容的广告</li>
</ul>
<p>要注意些什么？</p>
<div id="_mcePaste">
<ul>
<li>不使用弹窗广告</li>
<li>帮助用户识别、理解和快速定位广告区域</li>
<li>不要同时出现过多的广告类型</li>
<li>根据不同的页面的特点，在合适位置安排不同类型的广告</li>
<li>善用文字广告</li>
<li>提供个性化/定向/智能广告</li>
<li>建立并执行广告规范</li>
</ul>
</div>
<p><span style="color: #800000;"><strong>总之，“形式”方面，要注意平衡和协调，玄妙之处就在于“像”广告与“不像”广告之间。</strong></span></p>
<h4>②Affection-情感</h4>
<p>下面是苹果公司在NYT网站投放的一个广告组合：左栏是头发再生广告，右栏广告中用PC的人跟秃顶的广告演员在做眼神交流，而用Mac的人则跟顶部的苹果用户体验广告在做眼神沟通。一组简单的广告变得妙趣横生。</p>
<p><img class="alignnone" title="applead" src="http://pic.yupoo.com/uegeek/578509afa1c0/medium.jpg" alt="" width="500" height="430" /></p>
<p>广告反映的不应只是赤裸裸的推销与被推销的关系。通过情感要素来打动用户，而不仅仅是骇人的感官效果，效果会超乎想象。比如下面的杜蕾斯广告：</p>
<p><img class="alignnone" title="durexad" src="http://pic.yupoo.com/uegeek/334579afa1b3/5u4t8g73.jpg" alt="" width="353" height="498" /></p>
<p><span style="color: #800000;"><strong>总之，“情感”方面，要让广告容易被人接受，传递的不仅仅是商品信息，还有用户所关心的价值。</strong></span></p>
<h4>③Content-内容</h4>
<ul>
<li>提供有用信息，帮助用户完成任务</li>
</ul>
<p>广告本质上也是一种信息，这些信息是否对用户有用，是否能成为他完成任务比不可少的一部分，决定了用户对广告的态度和互动深度。</p>
<p><img class="alignnone" title="ipadad" src="http://pic.yupoo.com/uegeek/598379afa861/medium.jpg" alt="" width="500" height="154" /></p>
<ul>
<li>跟踪历史浏览行为和兴趣推送匹配广告</li>
</ul>
<p>让用户感觉到广告是与自己有关的（前提是用户不认为这触犯了其浏览隐私）。</p>
<ul>
<li>提供用户真正关心的广告内容，如促销信息</li>
</ul>
<p><img class="alignnone" title="applepromote" src="http://pic.yupoo.com/uegeek/085929afa5b8/medium.jpg" alt="" width="500" height="189" /></p>
<ul>
<li>将产品置于生活场景/真实情境中</li>
</ul>
<p>广告之所以“太广告”，往往是因为脱离了我们熟悉的场景。在广告中提供真实的生活场景，或者将商品置于自然的情境下，效果会更佳。</p>
<p><span style="color: #800000;"><strong>总之，“内容”方面，提供有用的信息，让广告和用户能形成互动。</strong></span></p>
<h4>④Timing-时机</h4>
<p>广告出现的时机重要吗？太重要了！过去我们往往会忽视这个要素。</p>
<p>用户在网络使用的不同态度和行为模式之下，对广告的接受程度可能存在差异：</p>
<ul>
<li>就态度而言，以被动模式（如网页弹窗广告、电视节目中插播的广告）接触的广告容易引起反感；以主动模式（如订阅邮件广告、报纸分类广告）接触的广告容易被接收。</li>
<li>就行为而言，用户在目的明确的搜索模式下接触广告，会倾向于将其视为干扰因素而忽略；在随意的浏览模式下，注意到广告的机会则大大增加。</li>
</ul>
<p><img class="alignnone" title="adtime" src="http://pic.yupoo.com/uegeek/084229afa1c0/qgk2l3v6.jpg" alt="" width="700" height="235" /></p>
<p>用户从进入网站到离开，会根据自己的目标完成一系列任务。在每一个小任务进行的过程中，用户的注意力主要集中在当前操作上，这时候如果强行插入广告，容易产生消极的体验。所以要注意分析用户使用网站/产品主要的任务流，不要在主要任务上打断、干扰用户。可以多采用一些间隙广告（Interval ad），任务节点广告（Post-task ad），情境辅助广告（Contextual Approaches），精准广告（Target Audiences），以确保不会在用户对内容的注意力处于峰值时受到广告的干扰。</p>
<p><img class="alignnone" title="level" src="http://pic.yupoo.com/uegeek/759049afa572/ur4jpfjf.jpg" alt="" width="700" height="249" /></p>
<p><span style="color: #800000;"><strong>总之，“时机”方面，</strong></span><span style="color: #800000;"><strong>尽可能根据用户目标，在恰当的位置、时机展示广告</strong></span><span style="color: #800000;"><strong>。</strong></span></p>
<p>上面介绍的就是良好广告体验值得关注的四个方面：F-形式，A-情感，C-内容，T-时机。其实称不上“法则”，只是便于理解和记忆，取了“FACT”的名字。</p>
<p>广告与用户体验，是一个有趣且具有实用价值的话题，在这里抛砖引玉，希望听听大家的想法 ：）</p>
<p>00</p>
<p>2010.7.25</p>
<p><a class="a2a_button_sina_weibo" href="http://www.addtoany.com/add_to/sina_weibo?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;linkname=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" title="Sina Weibo" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/sina_weibo.png" width="16" height="16" alt="Sina Weibo"/></a><a class="a2a_button_delicious" href="http://www.addtoany.com/add_to/delicious?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;linkname=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" title="Delicious" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/delicious.png" width="16" height="16" alt="Delicious"/></a><a class="a2a_button_google_reader" href="http://www.addtoany.com/add_to/google_reader?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;linkname=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" title="Google Reader" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/reader.png" width="16" height="16" alt="Google Reader"/></a><a class="a2a_button_evernote" href="http://www.addtoany.com/add_to/evernote?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;linkname=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" title="Evernote" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/evernote.png" width="16" height="16" alt="Evernote"/></a><a class="a2a_button_instapaper" href="http://www.addtoany.com/add_to/instapaper?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;linkname=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" title="Instapaper" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/instapaper.png" width="16" height="16" alt="Instapaper"/></a><a class="a2a_button_email" href="http://www.addtoany.com/add_to/email?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;linkname=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" title="Email" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/email.png" width="16" height="16" alt="Email"/></a><a class="a2a_button_printfriendly" href="http://www.addtoany.com/add_to/printfriendly?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;linkname=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" title="PrintFriendly" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/printfriendly.png" width="16" height="16" alt="PrintFriendly"/></a><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.uegeek.com%2Fue%2Ffact_rule_of_better_online_ads&amp;title=%E8%89%AF%E5%A5%BD%E7%BD%91%E7%BB%9C%E5%B9%BF%E5%91%8A%E4%BD%93%E9%AA%8C%E7%9A%84%E2%80%9CFACT%E2%80%9D%E6%B3%95%E5%88%99" id="wpa2a_4">Share it!</a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uegeek.com/ue/fact_rule_of_better_online_ads/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>读书笔记-应需而变：设计的力量</title>
		<link>http://www.uegeek.com/reading/note_subject_to_change</link>
		<comments>http://www.uegeek.com/reading/note_subject_to_change#comments</comments>
		<pubDate>Sat, 22 May 2010 10:27:20 +0000</pubDate>
		<dc:creator>00</dc:creator>
				<category><![CDATA[读书笔记]]></category>
		<category><![CDATA[note]]></category>
		<category><![CDATA[strategy]]></category>
		<category><![CDATA[ux]]></category>

		<guid isPermaLink="false">http://www.uegeek.com/?p=643592</guid>
		<description><![CDATA[“预测未来的最佳方法是创造未来”──彼得 德鲁克 1  产品=体验 彻底地转变你和用户之间的关系，是在市场上获得成功的关键。 设计作为一种活动，包含以下要素： 同理心：设计必须满足人们的某种目的，所以需要理解人如何与产品互动 解决问题 思维能力和原型能力 发现可选方案 不能简单地通过增加特性来吸引用户，还必须真实、深刻地了解用户和他们的能力、需求、期望。 . 乔帮主的“技术-特性（产品）-体验”产品进化论确实经典。一项新技术，能让一家企业在市场上立足，但是技术可以被扩散和学习，更新换代很快，竞争对手终究会模仿。随后，如果将技术“变现”成为满足人们某些需求的具体feature（特性），可以在日渐成熟的市场中保有竞争力。但是特性同样易于模仿和复制。只有能为用户提供独特体验的产品，才能牢牢抓住用户和市场。 2  体验=战略 “体验”是在这些要素中出现的： 动机：人们为什么会使用你的产品，希望从中得到什么 期望：根据经验对事物怎样运行进行联想 能力：对产品怎样形成认知以及实际上怎样交互 沉浸：怎样长时间使用产品 文化：一些规范框架、行为方式，以及信任机制 我们平常谈论的用户体验，往往集中在比较狭窄的“产品使用体验”这个具体层面。如果将视角切换到上面几个方面，思路会更加开阔，有助于我们思考如何产生、为什么会产生某些体验。 战略是权衡──有目的地选择不同于竞争对手的策略。战略是懂得取舍──这样才能在某些方面优于对手。 战略，其实就是事先对已见之事和未知之数进行的思考，以做出如何优化资源配置的决策，从而达到某些目的。因为已见（例如国外成功的商业模式、竞争对手的尝试），所以总想着拿来主义，只要做到人有我优就万事大吉了；因为未知，所以想起来都是可做的，很简单、很美好、很激动。但是，战略最困难的不是知道“可以做什么”，而是明白“不能做什么”，尤其是“能做但不去做什么”。从来没有一个产品能讨地球上每个人的欢心，尤其当门户模式日渐式微，随web2.0和长尾呼啸而来的碎片化越来越明显的时候，战略的本质——先“舍”后“得” 就显得更为重要，在无数选择的诱惑下保持专注，才能笑到最后。 “创造那种值得在营销中放第一位的产品和服务”── Seth Godin 必须不断问自己：“如何针对重点用户的重点需求提供一种独特的价值？” 功能的对抗不是一种战略，而是同化，抹平与对手之间的差异。就像是竞争对手在设计你的产品一样。没有可识别的差异，体验将变得平庸。 想一想在平常的生活、工作中，我们最容易记住哪类人呢？往往不是脾气最好、人缘最好的人，反而是那些个性鲜明，有脾气、有气场的人~~ 产品也一样，该有的功能一个不少，不一定能够让人一眼就记住、一用就喜欢。必需想明白自己到底要表现出什么“性格”、“脾气”，一款产品才能有自己的特色和方向，才有可能设计出不平庸的体验。 经常，产品团队没有一个共同的愿景，最多有一个待满足的需求规格说明。 体验战略本质上是一种愿景，表达的是期望用户能拥有的体验。 体验战略由外而内通过用户的动机、行为和情境来引导产品、服务或者系统开发，最终满足人们的期望。 如果我们自己都没法清晰描述出希望用户获得怎样的体验，那么一切都是空谈。（可是，如何去了解、总结？由谁描述？如何在团队中达成共识？需要具体到什么层面？） 3  理解人们的新方式 同理心：知道、感觉到、代入式地体验其他人的感觉、想法、经历。同理心能帮助我们抓住驱动行为发生的原理机制。 人因（human factor）：任务-目标法让我们聚焦在人们的行为过程，但只是基本，不能包含体验的方方面面。 无论“绵羊论”、“经济理性人”、“任务-目标”法，它们过于简化了用户，降低了复杂度，尝试通过通用法则来面对不确定的市场和社会化的世界。缺少了情感、文化和情境。 用户不喜欢在使用产品时多思考，并不代表用户“低端”、“懒”，谁愿意在浪费时间的同时又饱受折磨呢？ 我们需要重新认识我们的用户： 1）他们是谁？——识别目标用户 2）他们的任务、目标、偏好？——深入了解目标和需求 3）他们有怎样的行为？需要怎样的激励？——探究行为模式，更好地进行引导和设计交互过程 一旦有了任务、目标和偏好，就有了讨论行为、动机和意义的机会。我们应该从本质上去理解是什么在驱动人们在特定的情境下做特定的事。 4  抓住复杂性 培养同理心 用户研究+市场研究&#8211;&#62;设计研究 定量研究：对趋势的理解及预测； 定性研究：聚焦于体验、情形、行为等问题，更关注“过程”。 “研究报告的效果与它的厚度成反比” [...]]]></description>
			<content:encoded><![CDATA[<p><span style="font-family: 'Times New Roman'; line-height: normal; font-size: normal;"> </span></p>
<blockquote>
<p style="text-align: center;">“预测未来的最佳方法是创造未来”──彼得 德鲁克</p>
</blockquote>
<p style="text-align: center;"><a href="http://book.douban.com/subject/3665205/"><img class="aligncenter" style="border: 0px initial initial;" title="subject to change" src="http://img2.douban.com/lpic/s3722651.jpg" alt="" width="212" height="307" /></a></p>
<h3>1  产品=体验</h3>
<blockquote>
<div id="_mcePaste">彻底地转变你和用户之间的关系，是在市场上获得成功的关键。</div>
<div id="_mcePaste">设计作为一种活动，包含以下要素：</div>
<div id="_mcePaste">
<ul>
<li>同理心：设计必须满足人们的某种目的，所以需要理解人如何与产品互动</li>
<li>解决问题</li>
<li>思维能力和原型能力</li>
<li>发现可选方案</li>
</ul>
</div>
<div id="_mcePaste">不能简单地通过增加特性来吸引用户，还必须真实、深刻地了解用户和他们的能力、需求、期望。</div>
</blockquote>
<div><span style="color: #ffffff;">.</span></div>
<p>乔帮主的“技术-特性（产品）-体验”产品进化论确实经典。一项新技术，能让一家企业在市场上立足，但是技术可以被扩散和学习，更新换代很快，竞争对手终究会模仿。随后，如果将技术“变现”成为满足人们某些需求的具体feature（特性），可以在日渐成熟的市场中保有竞争力。但是特性同样易于模仿和复制。只有能为用户提供独特体验的产品，才能牢牢抓住用户和市场。</p>
<div><span id="more-643592"></span></div>
<h3>2  体验=战略</h3>
<div id="_mcePaste">“体验”是在这些要素中出现的：</div>
<blockquote>
<div id="_mcePaste">动机：人们为什么会使用你的产品，希望从中得到什么<br />
期望：根据经验对事物怎样运行进行联想<br />
能力：对产品怎样形成认知以及实际上怎样交互<br />
沉浸：怎样长时间使用产品<br />
文化：一些规范框架、行为方式，以及信任机制</p>
</div>
</blockquote>
<p>我们平常谈论的用户体验，往往集中在比较狭窄的“产品使用体验”这个具体层面。如果将视角切换到上面几个方面，思路会更加开阔，有助于我们思考如何产生、为什么会产生某些体验。</p>
<blockquote>
<div><strong>战略是权衡──有目的地选择不同于竞争对手的策略</strong>。战略是懂得取舍──这样才能在某些方面优于对手。</div>
</blockquote>
<p>战略，其实就是事先对已见之事和未知之数进行的思考，以做出如何优化资源配置的决策，从而达到某些目的。因为已见（例如国外成功的商业模式、竞争对手的尝试），所以总想着拿来主义，只要做到人有我优就万事大吉了；因为未知，所以想起来都是可做的，很简单、很美好、很激动。但是，战略最困难的不是知道“可以做什么”，而是明白“不能做什么”，尤其是<span style="color: #ff0000;"><strong><span style="color: #800000;">“能做但不去做什么”</span></strong></span>。从来没有一个产品能讨地球上每个人的欢心，尤其当门户模式日渐式微，随web2.0和长尾呼啸而来的碎片化越来越明显的时候，战略的本质——先“舍”后“得” 就显得更为重要，在无数选择的诱惑下保持专注，才能笑到最后。</p>
<blockquote>
<div>“创造那种值得在营销中放第一位的产品和服务”── Seth Godin</div>
<div>必须不断问自己：“如何针对重点用户的重点需求提供一种独特的价值？”</div>
<div><strong>功能的对抗不是一种战略，而是同化，抹平与对手之间的差异</strong>。就像是竞争对手在设计你的产品一样。没有可识别的差异，体验将变得平庸。</div>
</blockquote>
<p>想一想在平常的生活、工作中，我们最容易记住哪类人呢？往往不是脾气最好、人缘最好的人，反而是那些个性鲜明，有脾气、有气场的人~~ 产品也一样，该有的功能一个不少，不一定能够让人一眼就记住、一用就喜欢。必需想明白自己到底要表现出什么“性格”、“脾气”，一款产品才能有自己的特色和方向，才有可能设计出不平庸的体验。</p>
<blockquote>
<div>经常，产品团队没有一个共同的愿景，最多有一个待满足的需求规格说明。</div>
<div id="_mcePaste">体验战略本质上是一种愿景，表达的是期望用户能拥有的体验。</div>
<p>体验战略由外而内通过用户的动机、行为和情境来引导产品、服务或者系统开发，最终满足人们的期望。</p></blockquote>
<p>如果我们自己都没法清晰描述出希望用户获得怎样的体验，那么一切都是空谈。（可是，如何去了解、总结？由谁描述？如何在团队中达成共识？需要具体到什么层面？）</p>
<h3>3  理解人们的新方式</h3>
<blockquote>
<div id="_mcePaste">同理心：知道、感觉到、代入式地体验其他人的感觉、想法、经历。同理心能帮助我们抓住驱动行为发生的原理机制。</div>
<div id="_mcePaste">人因（human factor）：任务-目标法让我们聚焦在人们的行为过程，但只是基本，不能包含体验的方方面面。</div>
<div id="_mcePaste">无论“绵羊论”、“经济理性人”、“任务-目标”法，它们过于简化了用户，降低了复杂度，尝试通过通用法则来面对不确定的市场和社会化的世界。缺少了情感、文化和情境。</div>
</blockquote>
<div id="_mcePaste">用户不喜欢在使用产品时多思考，并不代表用户“低端”、“懒”，谁愿意在浪费时间的同时又饱受折磨呢？</div>
<div id="_mcePaste">我们需要重新认识我们的用户：</div>
<div>1）他们是谁？——识别目标用户</div>
<div>2）他们的任务、目标、偏好？——深入了解目标和需求</div>
<div>3）他们有怎样的行为？需要怎样的激励？——探究行为模式，更好地进行引导和设计交互过程</div>
<div>一旦有了任务、目标和偏好，就有了讨论行为、动机和意义的机会。我们应该从本质上去理解<strong>是什么在驱动人们在特定的情境下做特定的事</strong>。</div>
<h3>4  抓住复杂性 培养同理心</h3>
<div id="_mcePaste">用户研究+市场研究&#8211;&gt;<strong>设计研究</strong></div>
<div id="_mcePaste">定量研究：对趋势的理解及预测；<br />
定性研究：聚焦于体验、情形、行为等问题，更关注“过程”。</div>
<blockquote>
<div>“研究报告的效果与它的厚度成反比”</div>
<div id="_mcePaste">真正有效的研究工作必需具备可行性和持久性。</div>
<div>1.混合使用多种方法：通过定性研究获得一个丰富的感性认识后，可通过问卷来考量行为和态度的普遍性。</div>
<div id="_mcePaste">2.将研究整合入设计流程：让企业员工对研究信任。让其他人参与到研究过程中，是最好的能培养同理心的方式。</div>
<div id="_mcePaste">3.创建真正有用的交付物：如persona。让沟通变得高效并促进同理心的培养。</div>
<div id="_mcePaste">4.制作原型：如故事板、概念图或者功能运作系统等。</div>
</blockquote>
<h3>5  停止设计“产品”</h3>
<p>“停止设计产品”，意思是不要仅仅提供feature，不要仅仅提供满足一个或几个具体需求的产品，而应该去思考：<strong>怎样才能使用户离不开我们的产品</strong>？如果我们提供的是垄断性质的必需品，又或者完全没有人能够提供比我们更有竞争力的产品，而且没有任何形式的替代品，那么我们就不必去思考这个问题。但现实往往比想象的要残酷，如果回避这个问题，可能永远也找不对方向。</p>
<blockquote>
<div>人们想达成什么目的？这种活动如何融入人们的生活？针对这些期望，我能如何传达？</div>
</blockquote>
<div>这几个问题，可以帮助我们思考产品的核心竞争力所在。</div>
<div><span style="color: #ffffff;">.</span></div>
<div>到底怎么才能将用户固化下来，成为产品的“粉丝”呢？</div>
<div>例一：M记</div>
<div><strong>○持续满足具体需求</strong></div>
<div>吃汉堡薯条能填饱肚子~</div>
<div><strong>○提供良好的体验</strong></div>
<div>干净的环境、高效的服务，无营养但味道还行的食物~</div>
<div><strong>○形成情感依赖</strong></div>
<div>看到大大的“M”字、看到红黄色的经典搭配、看到麦当劳叔叔，就能勾起小时候去M记过生日的回忆~</div>
<div><strong>○成为生活方式的一部分</strong></div>
<div>忙碌而高节奏的都市生活，没有精力和时间去过健康绿色的生活，去M记将就将就吧~</div>
<div><span style="color: #ffffff;">.</span></div>
<div><span style="color: #ffffff;">.</span></div>
<div><span style="color: #000000;">例二：苹果</span></div>
<div>苹果的例子就更经典了。乔帮主打造了一个数字媒体生态系统，从设备到软件，从产品到服务，从设计到体验，目标用户大抵都逃不出他的手掌心：</div>
<div style="text-align: center;"><a href="http://www.uegeek.com/"><img class="alignnone" style="border: 0px initial initial;" title="acquire-manage-play" src="http://pic.yupoo.com/uegeek/3195195b0a34/medium.jpg" alt="" width="500" height="374" /></a></div>
<div id="_mcePaste">数字消费品可以从三大在线商店获得，媒体管理由通过iTunes高效完成，而iTunes让iPod、iPhone等保持简单优雅。</div>
<div id="_mcePaste">将整个产品or服务作为一个大的系统，各个部分有定义好的相对窄的功能，保持在某一个领域的专注。带有食物链上下游关系特征的产品线一旦形成，系统的效应就能显现出来。当然，并不是说系统中所有部分都需要自己创建，重要的是让自己成为所处生态系统中的一环。</div>
<h3>6  设计竞争力</h3>
<blockquote>
<div id="_mcePaste">优秀的体验需要系统性协调。优秀体验面临的最大障碍可能很简单：</div>
<div id="_mcePaste">1.新的：找到旧问题的新解决办法</div>
<div id="_mcePaste">2.足够吸引人，合人心意而不仅仅是新奇</div>
<div id="_mcePaste">3.与众不同且难以模仿</div>
</blockquote>
<blockquote>
<div>优秀用户体验的核心：<strong><span style="color: #800000;">为真实用户需求提供一种有差异化的协调系统</span></strong>。</div>
<div id="_mcePaste">SPARC计划： See─Plan─Act─Refine─Communicate</div>
<div id="_mcePaste">体验，最终是存在于用户的意识中，是一种对与企业交互的主观感受。</div>
</blockquote>
<h3>7  敏捷方法</h3>
<blockquote>
<div id="_mcePaste">瀑布模型不够敏捷。提前准确了解项目的所有需要，通常是不可能的。</div>
<div id="_mcePaste">敏捷方法：</div>
<div id="_mcePaste">
<ul>
<li>高度迭代的流程，缩短研发周期；</li>
<li>将用户融入研发流程；</li>
<li>创建更小型的工作小组；</li>
<li>重视正确性和及时性。</li>
</ul>
</div>
<div id="_mcePaste">准确、恰当地完成原型，是敏捷方法成功的关键。</div>
</blockquote>
<h3>8  不确定的世界</h3>
<blockquote>
<div id="_mcePaste">形成一种创新的、敏捷的及专注与体验的方法，是关键的商业实践。</div>
<div id="_mcePaste">持续不断地设想出可能性和将新创意融入体验，是保证领先的秘诀。</div>
</blockquote>
<div><span style="color: #ffffff;">.</span></div>
<div><span style="color: #ffffff;">.</span></div>
<div>EOF</div>
<div>by 00</div>
<p><a class="a2a_button_sina_weibo" href="http://www.addtoany.com/add_to/sina_weibo?linkurl=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" title="Sina Weibo" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/sina_weibo.png" width="16" height="16" alt="Sina Weibo"/></a><a class="a2a_button_delicious" href="http://www.addtoany.com/add_to/delicious?linkurl=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" title="Delicious" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/delicious.png" width="16" height="16" alt="Delicious"/></a><a class="a2a_button_google_reader" href="http://www.addtoany.com/add_to/google_reader?linkurl=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" title="Google Reader" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/reader.png" width="16" height="16" alt="Google Reader"/></a><a class="a2a_button_evernote" href="http://www.addtoany.com/add_to/evernote?linkurl=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" title="Evernote" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/evernote.png" width="16" height="16" alt="Evernote"/></a><a class="a2a_button_instapaper" href="http://www.addtoany.com/add_to/instapaper?linkurl=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" title="Instapaper" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/instapaper.png" width="16" height="16" alt="Instapaper"/></a><a class="a2a_button_email" href="http://www.addtoany.com/add_to/email?linkurl=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" title="Email" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/email.png" width="16" height="16" alt="Email"/></a><a class="a2a_button_printfriendly" href="http://www.addtoany.com/add_to/printfriendly?linkurl=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" title="PrintFriendly" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/printfriendly.png" width="16" height="16" alt="PrintFriendly"/></a><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.uegeek.com%2Freading%2Fnote_subject_to_change&amp;title=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E5%BA%94%E9%9C%80%E8%80%8C%E5%8F%98%EF%BC%9A%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%8A%9B%E9%87%8F" id="wpa2a_6">Share it!</a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uegeek.com/reading/note_subject_to_change/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>读书笔记-用户体验的要素</title>
		<link>http://www.uegeek.com/ue/note_the_elements_of_user_experience</link>
		<comments>http://www.uegeek.com/ue/note_the_elements_of_user_experience#comments</comments>
		<pubDate>Sun, 28 Mar 2010 13:24:43 +0000</pubDate>
		<dc:creator>00</dc:creator>
				<category><![CDATA[行业杂谈]]></category>
		<category><![CDATA[读书笔记]]></category>
		<category><![CDATA[note]]></category>
		<category><![CDATA[ux]]></category>

		<guid isPermaLink="false">http://www.uegeek.com/?p=643569</guid>
		<description><![CDATA[用户体验的要素—以用户为中心的Web设计 1.用户体验为什么如此重要 用户体验不但关注产品将被用来做什么，而且关注产品如何工作。 【换一种说法是否更好：我们不但要了解产品被用来做什么，也要了解它如何工作，才能知道它是如何影响用户体验的】 用户体验指“产品如何与外界发生联系并发挥作用”，也就是人们如何“接触”和“使用”它。 【这种定义是否过于具象化，主要关注交互和行为的过程，而不包含感受、情绪、情感？】 拥有更多的“产品特性”，只能保持短时间的竞争优势。随着功能不断膨胀，网站越来越复杂、笨重、难用，最后就失去了吸引力。仅有功能是不够的，必需用一种能够帮助人们理解和接受的方式呈现出来。 【什么是用户体验？（太大，需要另外讨论）什么是好的用户体验？】 好的体验是协调一致、直观明了、愉快的体验。成功的用户体验就是能事先知道用户的期望。 2.用户体验包含哪些要素 要考虑用户有可能采取的每一个行动的每一种可能性，并且去理解在这个过程的每一个步骤中用户的期望值。 【如何考虑全面？如何估计期望值？】 根据网页的双重性，划分为： 描述软件界面类型的网页，关注任务，操作被纳入一个过程，网站是工具； 作为超文本信息空间的网页，关注信息和信息的意义，网站是用户可以穿越的信息空间。 【其实就是功能层面/表现和内容层面/表现？】 表现层&#8211;surface 由图片、文字等组成的视觉呈现。视觉设计（Visual Design） 框架层&#8211;skeleton 内容的设计布局。信息设计（Information Design），促进理解的信息表达方式；软件&#8211;界面设计（Interface Design），安排好用户与系统功能产生互动的界面元素；信息空间&#8211;导航设计（Navigation Design），允许用户在信息架构中穿行。 结构层&#8211;structure 系统结构和导航，功能的组合方式。软件&#8211;交互设计，定义系统如何响应用户的请求；信息空间&#8211;信息架构，内容元素的分布。 范围层&#8211;scope 特性和功能。软件&#8211;创建功能规格（Functional Specification），对产品功能组合的详细描述；信息空间&#8211;内容需求（Content Requirement），对内容元素要求的详细描述。 战略层&#8211;strategy 经营者对网站的期望目标（Site Objective）；用户想从网站得到什么（User Need），他们想达到的目标将怎样满足他们所期待的其他目标。 【每一层都是根据它下面那个层面来决定的。目标→功能/特性→架构/导航→交互→视觉。如此划分用户体验的要素，是站在供给方即网站和设计者的角度出发的。】 3.战略层：网站目标和用户需求 战略应该是设计用户体验流程中的起点。回答“我们为什么要建这个网站？”网站失败最常见的原因，是没有人试图回答两个非常基本的问题： 我们要从这个网站得到什么？ (Site Objective) 用户要从这个网站得到什么？ (User Need) 【Asking a question before solving it】 网站目标需要有成功标准(Success Metric)，可追踪的指标。 如果想要用户喜欢并使用我们的产品，必须要了解“他们是谁”以及“他们的需求是什么”。 【1.who they are [...]]]></description>
			<content:encoded><![CDATA[<p>用户体验的要素—以用户为中心的Web设计</p>
<p><a href="http://www.uegeek.com/"><img class="alignnone" title="the-elements-of-user-expericence" src="http://www.mdong.org/wp-content/uploads/2008/12/the-elements-of-user-expericence.jpg" alt="" width="236" height="308" /></a></p>
<h3><strong>1.用户体验为什么如此重要</strong><strong> </strong></h3>
<blockquote><p>用户体验不但关注产品将被用来做什么，而且关注产品如何工作。</p>
</blockquote>
<p>【换一种说法是否更好：我们不但要了解产品被用来做什么，也要了解它如何工作，才能知道它是如何影响用户体验的】</p>
<blockquote><p>用户体验指“产品如何与外界发生联系并发挥作用”，也就是人们如何“接触”和“使用”它。</p>
</blockquote>
<p>【这种定义是否过于具象化，主要关注交互和行为的过程，而不包含感受、情绪、情感？】</p>
<blockquote><p>拥有更多的“产品特性”，只能保持短时间的竞争优势。随着功能不断膨胀，网站越来越复杂、笨重、难用，最后就失去了吸引力。仅有功能是不够的，必需用一种能够帮助人们理解和接受的方式呈现出来。</p>
</blockquote>
<p>【什么是用户体验？（太大，需要另外讨论）什么是好的用户体验？】</p>
<blockquote><p>好的体验是协调一致、直观明了、愉快的体验。成功的用户体验就是能事先知道用户的期望。</p>
</blockquote>
<h3><strong>2.用户体验包含哪些要素</strong></h3>
<blockquote><p>要考虑用户有可能采取的每一个行动的每一种可能性，并且去理解在这个过程的每一个步骤中用户的<strong>期望值</strong>。</p>
</blockquote>
<p>【如何考虑全面？如何估计期望值？】</p>
<p><span id="more-643569"></span></p>
<p>根据网页的双重性，划分为：</p>
<blockquote><p>描述软件界面类型的网页，关注任务，操作被纳入一个过程，网站是工具；</p>
<p>作为超文本信息空间的网页，关注信息和信息的意义，网站是用户可以穿越的信息空间。</p>
</blockquote>
<p>【其实就是功能层面/表现和内容层面/表现？】</p>
<p><img class="alignnone" src="http://www.ue-seo.cn/images/ue5.jpg" alt="" width="273" height="500" /></p>
<blockquote><p><strong><span style="color: #993300;">表现层&#8211;surface</span></strong> 由图片、文字等组成的视觉呈现。视觉设计（Visual Design）</p>
<p><span style="color: #993300;"><strong>框架层&#8211;skeleton</strong></span> 内容的设计布局。信息设计（Information Design），促进理解的信息表达方式；软件&#8211;界面设计（Interface Design），安排好用户与系统功能产生互动的界面元素；信息空间&#8211;导航设计（Navigation Design），允许用户在信息架构中穿行。</p>
<p><span style="color: #993300;"><strong>结构层&#8211;structure</strong></span> 系统结构和导航，功能的组合方式。软件&#8211;交互设计，定义系统如何响应用户的请求；信息空间&#8211;信息架构，内容元素的分布。</p>
<p><span style="color: #993300;"><strong>范围层&#8211;scope</strong></span> 特性和功能。软件&#8211;创建功能规格（Functional Specification），对产品功能组合的详细描述；信息空间&#8211;内容需求（Content Requirement），对内容元素要求的详细描述。</p>
<p><span style="color: #993300;"><strong>战略层&#8211;strategy</strong></span> 经营者对网站的期望目标（Site Objective）；用户想从网站得到什么（User Need），他们想达到的目标将怎样满足他们所期待的其他目标。</p>
</blockquote>
<p>【每一层都是根据它下面那个层面来决定的。目标→功能/特性→架构/导航→交互→视觉。如此划分用户体验的要素，是站在供给方即网站和设计者的角度出发的。】</p>
<h3><strong>3.战略层：网站目标和用户需求</strong><strong> </strong></h3>
<p>战略应该是设计用户体验流程中的起点。回答“我们为什么要建这个网站？”网站失败最常见的原因，是没有人试图回答两个非常基本的问题：</p>
<blockquote><p><strong> </strong><strong>我们要从这个网站得到什么？</strong><strong> (Site Objective)</strong></p>
<p><strong> </strong><strong>用户要从这个网站得到什么？</strong><strong> (User Need)</strong></p>
</blockquote>
<p>【Asking a question before solving it】</p>
<blockquote><p>网站目标需要有成功标准(Success Metric)，可追踪的指标。</p>
<p>如果想要用户喜欢并使用我们的产品，必须要了解“<strong>他们是谁</strong>”以及“<strong>他们的需求是什么</strong>”。</p>
</blockquote>
<p>【1.who they are  2.what they need  3.what they like】</p>
<h4>如何确定用户需求？</h4>
<p><strong> </strong><strong>用户细分（</strong><strong>User Segmentation</strong><strong>）</strong><strong> </strong></p>
<p>将用户划分为更小的群组，每一群用户都是由具有某些共同关键特征的用户组成。</p>
<p>【维度是什么？哪些特征对我们而言是重要的？】【细分之后需要排定需求的优先级？】</p>
<blockquote>
<ul>
<li>人口统计学（demographic）标准</li>
<li>心理描绘图（psychographic）</li>
<li>用户对技术和网页本身的观点：如每周花多少时间使用？喜欢跟计算机打交道吗？</li>
<li>用户对网站相关的知识：新手or熟手</li>
<li>用户的社会或专业角色，如学生、白领</li>
</ul>
<p>当不同群体目标矛盾时：要么选择针对单一用户群设计，而排除其他用户群；要么为执行相同任务的不同用户群提供不同的方式。</p>
</blockquote>
<p><strong> </strong><strong>可用性和用户研究</strong><strong> </strong></p>
<blockquote>
<ul>
<li>可用性：寻求使产品更容易使用的方法</li>
<li>用户研究：收集必要信息来认识用户是谁，然后才能知道用户需要什么。问卷、访谈、焦点小组，适于收集用户的普遍观点与感知；测试和现场调查，适于理解具体的用户行为，以及和网站的交互信息。</li>
<li>现场调查（Contextual Inquiry）：用于了解<strong>在日常生活情境中</strong>的用户行为。</li>
<li>任务分析（Task Analysis）：仔细地了解用户完成任务的精确步骤。认为每一个用户与网站的交互行为都发生在执行某一任务的环境中。</li>
<li>用户测试（User Testing）</li>
<li>卡片排序法（Card sorting）：用于探索用户如何分类或组织各种信息元素。帮助我们了解用户对网站信息的看法。</li>
<li>人物角色（Personas）：能够代表<strong>整个真实用户需求</strong>的虚构人物。从用户研究中提取出可成为样例的虚构人物。帮助我们更好地理解用户需求。</li>
</ul>
</blockquote>
<h3><strong>4.范围层：功能规格和内容需求</strong><strong> </strong></h3>
<blockquote><p>我们的现状：不停地增加产品的功能特性。有固定的工作流程，但是没有日程安排，没有里程碑，项目看不到尽头。<strong>因为根本就没有人知道这个项目的范围，又怎么能知道它应该在什么时候结束呢</strong>？</p>
<p>范围蠕变（scope creep）像滚雪球，每一个额外的要求看上去并没有增加太多的工作量，但当它们汇集到一起的时候，整个项目就会失去控制的膨胀，结束时间遥遥无期。</p>
</blockquote>
<p><strong>功能和内容</strong><strong> </strong></p>
<p>软件开发中，范围层确定的是功能需求或功能规格（functional specification）文档。功能需求是项目初期阶段的需求，描述系统应该做什么；功能规格是在末期的规格说明，描述系统真正完成了什么。内容需求的更新频率介于用户期望值和有效资源之间的一个合理的中间值。</p>
<p><strong><br />
</strong></p>
<h3><strong>5.结构层：交互设计与信息架构</strong><strong> </strong></h3>
<p><strong>结构层定义</strong><strong> </strong></p>
<blockquote><p>交互设计，关注于描述“可能的用户行为”，关注将影响用户执行和完成任务的选项，同时定义“系统如何配合与响应”这些用户行为，为用户设计结构化体验；信息架构，关注如何将信息表达给用户的选项，涉及多学科，包括组织管理、分类、顺序排列，内容呈现相关的学科。</p>
<p>两者都强调一个重点：确定各个将要呈现给用户的选项的模式和顺序。理解用户、用户的工作方式和思考方式。</p>
</blockquote>
<p><strong>信息架构</strong></p>
<blockquote><p>信息架构把一个结构应用到设定好的“内容需求清单”，着重于设计组织分类和导航的结构，让用户可以高效率、有效地浏览。作用是指引、教育、通知、说服用户。</p>
<p>创建分类体系的方法：至上而下&#8211;从对网站目标与用户需求的理解进行结构设计；自下而上&#8211;从对内容和功能需求分析开始，逐渐构建能反映网站目标和用户需求的结构。</p>
</blockquote>
<p>【至上而下适合前期规划和设计，至下而上适合对已有网站进行总结梳理】</p>
<p><strong>结构方法</strong></p>
<p><strong> </strong></p>
<p>信息架构的基本单位是节点（node）。常见的结构类型：</p>
<blockquote>
<ul>
<li>层级结构（hierarchical structure）/树状结构/中心辐射结构（hub-and-spoke structure）：父级/子级关系</li>
<li>矩阵结构（matrix structure）：允许用户在节点之间沿着两个或更多的“维度”移动。能帮助需求不同的用户。</li>
<li>自然结构（organic structures）：对探索一些列关系不明确或一直在演变的主题很适合。</li>
<li>线性结构（sequential structures）：顺序是关键。</li>
</ul>
</blockquote>
<p><strong><br />
</strong></p>
<h3><strong>6.框架层：界面设计、导航设计和信息设计</strong><strong> </strong></h3>
<blockquote><p>结构层定义了网站用什么方式来运行，是一个较大的架构和交互的设计；</p>
<p>框架层定义了用什么样的功能形式来实现，关注点几乎都在不同的页面和页面组件上。</p>
<p>界面设计（interface design）——框架和界面控件的设计，可交互元素的布局。【让用户真正接触具体功能，可以do sth】</p>
<p>导航设计（navigation design）——用于呈现信息的界面形式，引导用户移动的元素的安排。【让用户可感知网站的结构，可以go to somewhere】</p>
<p>信息设计（information design）——呈现有效的信息沟通，考虑传达给用户的信息要素的排布。【传达想法给用户，用户可以know sth】</p>
</blockquote>
<p>【对设计者而言，IA是结构，导航是结构可视化。对用户而言，IA是隐性的，可感知；导航是显性的，可使用】</p>
<table border="1" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="189" valign="top"><strong> </strong></td>
<td width="189" valign="top"><strong>Designer</strong></td>
<td width="189" valign="top"><strong>User</strong></td>
</tr>
<tr>
<td width="189" valign="top"><strong>IA</strong></td>
<td width="189" valign="top">structure</td>
<td width="189" valign="top">invisible, feel</td>
</tr>
<tr>
<td width="189" valign="top"><strong>Nav.</strong></td>
<td width="189" valign="top">structure   visualization</td>
<td width="189" valign="top">visible,    use</td>
</tr>
</tbody>
</table>
<p><strong>界面设计</strong><strong> </strong></p>
<blockquote><p>让用户一眼就能看到最重要的东西。一个良好的界面是要组织好用户最常采用的行为，同时让这些界面元素用最容易的方式获取和使用。</p>
</blockquote>
<p>【如何确定哪些是用户最常采用的行为？】</p>
<blockquote><p>设计网页界面完全就是做这样一些事：为用户想完成的任务选择正确的界面元素，通过一种能迅速理解和易于使用的方式，把他们放置到页面上去。</p>
<p>“哪个功能应该在那些页面上完成”，是结构层的交互设计的主要工作；“这些功能在页面上如何被实现”，则是界面设计范围内的事。</p>
</blockquote>
<p><strong>导航设计</strong><strong> </strong></p>
<blockquote><p>目标：①提供用户一种在网站间跳转的方法；②传达元素和他们所包含内容之间的关系；③传达内容和当前浏览页面之间的关系。</p>
<p>Navigation System</p>
<ul>
<li>全局导航global navigation，提供了覆盖整个网站的通路。</li>
<li>局部导航loval navigation，提供在这个架构中到“附近地点”（父级、兄弟级、子级）的通路。</li>
<li>辅助导航supplementary navigation，提供全局导航或局部导航不能快速到达的相关内容的快捷途径。</li>
<li>上下文导航contextual navigation/inline navigation，嵌入页面自身内容的一种导航。</li>
<li>友好导航courtesy navigation，作为一种便利途径来使用，如联系信息、反馈表单和法律声明等。</li>
<li>远程导航remote navigation，如网站地图（通常不会显示超过两个层级的导航）和索引表。</li>
</ul>
</blockquote>
<p><strong>信息设计</strong><strong> </strong></p>
<blockquote><p>用一种能反映用户的思路和支持他们完成任务和目标的方式来分类和排列信息元素。信息设计和导航设计结合到一起，执行的是一个重要的功能——指示标识（wayfinding）。帮助用户很快的得到一个心理图像，在哪儿，能去哪儿，哪条路离目标更近。</p>
</blockquote>
<p><strong>线框图</strong><strong> </strong></p>
<blockquote><p>线框图是整合在结构层的全部三种要素的方法：通过安排和选择界面元素来整合界面设计；通过识别和定义核心导航系统来整合导航设计；通过放置和排列信息组成部分的优先级来整合信息设计。</p>
</blockquote>
<h3><strong>7.表现层：视觉设计</strong><strong> </strong></h3>
<blockquote><p>设计应该强化结构，使用户可用的选项清楚明了。</p>
<p>评估视觉设计简单方法：视线首先落在什么地方？那个设计要素第一时间吸引了注意力？它们对于战略目标是很重要的吗？用户第一时间注意到的与他们的目标是背道而驰的吗？</p>
</blockquote>
<p>表现层需要考虑对比和一致性，配色方案和排版(color palette，typography)，设计和成品和风格指南。</p>
<p><strong> </strong></p>
<h3><strong>8.要素的应用</strong><strong> </strong></h3>
<blockquote><p>改善用户体验其实就是大量收集亟待解决的非常细微的问题，思考清楚这些问题到底属于哪个层次，它的改变对其上层、下层会有哪些连锁反应。</p>
<p><strong>创建任何一种用户体验的挑战是</strong><strong>“</strong><strong>比用户自己更准确的理解他们的需求</strong><strong>”</strong><strong>。</strong></p>
</blockquote>
<p>[End of note  by <a href="http://www.uegeek.com/" target="_blank">00</a>]</p>
<p><a href="http://www.jjg.net" target="_blank">Jesse James Garrett</a>提出用户体验要素已有10年之久了，这个模型逻辑清晰，简单易理解，为我们提供了一个思考的框架，在用户体验概念与产品设计的实践之间架起了桥梁。</p>
<p>下面是JJG在今年UX London接受访谈时回顾 <a href="http://www.jjg.net/elements/pdf/elements.pdf" target="_blank">The elements of user experience</a> 的一段话：</p>
<h4>It’s been a decade since you released the Elements of User Experience diagram. What’s it like looking back on it now, and would you change anything?</h4>
<div><span style="color: #800000;">Jesse James Garrett</span>: There really isn’t much in Elements I’ve felt the need to change. Everything there is still important. I’ve been surprised by the durability of the Elements model, because I created it to solve a problem that seemed to be particular to that moment in the evolution of the field. Everybody had to explain everything about UX, because the practice was so new. What I didn’t count on was that ten years later, there would still be so many people to educate!</div>
<div id="_mcePaste">But even among experienced practitioners, I think it’s been a valuable touchstone, to establish a common frame of reference for discussions about our work. I love the various riffs on Elements people have put out over the years, from George Olsen in 2003 to Richard Dalton in 2007 to David Sherwin in 2010. Some people have thought I’d be upset by what they’ve done, but it’s actually really gratifying to see people pick it up and do their own thing with it. It’s a tool, it’s no good if it’s not useful to you, so you should reshape it to your purposes.</div>
<p>更多的访谈内容，请围观<a href="http://johnnyholland.org/2010/03/24/an-interview-with-jesse-james-garrett/" target="_blank">这里</a>。</p>
<p><a class="a2a_button_sina_weibo" href="http://www.addtoany.com/add_to/sina_weibo?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" title="Sina Weibo" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/sina_weibo.png" width="16" height="16" alt="Sina Weibo"/></a><a class="a2a_button_delicious" href="http://www.addtoany.com/add_to/delicious?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" title="Delicious" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/delicious.png" width="16" height="16" alt="Delicious"/></a><a class="a2a_button_google_reader" href="http://www.addtoany.com/add_to/google_reader?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" title="Google Reader" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/reader.png" width="16" height="16" alt="Google Reader"/></a><a class="a2a_button_evernote" href="http://www.addtoany.com/add_to/evernote?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" title="Evernote" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/evernote.png" width="16" height="16" alt="Evernote"/></a><a class="a2a_button_instapaper" href="http://www.addtoany.com/add_to/instapaper?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" title="Instapaper" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/instapaper.png" width="16" height="16" alt="Instapaper"/></a><a class="a2a_button_email" href="http://www.addtoany.com/add_to/email?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" title="Email" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/email.png" width="16" height="16" alt="Email"/></a><a class="a2a_button_printfriendly" href="http://www.addtoany.com/add_to/printfriendly?linkurl=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;linkname=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" title="PrintFriendly" rel="nofollow" target="_blank"><img src="http://www.uegeek.com/wp-content/plugins/add-to-any/icons/printfriendly.png" width="16" height="16" alt="PrintFriendly"/></a><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.uegeek.com%2Fue%2Fnote_the_elements_of_user_experience&amp;title=%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0-%E7%94%A8%E6%88%B7%E4%BD%93%E9%AA%8C%E7%9A%84%E8%A6%81%E7%B4%A0" id="wpa2a_8">Share it!</a></p>]]></content:encoded>
			<wfw:commentRss>http://www.uegeek.com/ue/note_the_elements_of_user_experience/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

