<?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>交互设计禅意花园-Alite Design Studio &#187; 用户体验</title>
	<atom:link href="http://www.alitedesign.com/archives/category/%e7%94%a8%e6%88%b7%e4%bd%93%e9%aa%8c/feed" rel="self" type="application/rss+xml" />
	<link>http://www.alitedesign.com</link>
	<description>生活中发现的点滴,其实都是设计中的细节</description>
	<lastBuildDate>Mon, 30 Aug 2010 03:40:19 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>电子商务搜索LIST页面用户体验设计</title>
		<link>http://www.alitedesign.com/archives/188</link>
		<comments>http://www.alitedesign.com/archives/188#comments</comments>
		<pubDate>Sat, 15 May 2010 04:54:02 +0000</pubDate>
		<dc:creator>Alite Yu</dc:creator>
				<category><![CDATA[用户体验]]></category>
		<category><![CDATA[搜索LIST页面]]></category>
		<category><![CDATA[用户体验设计]]></category>
		<category><![CDATA[电子商务垂直搜索]]></category>

		<guid isPermaLink="false">http://www.alitedesign.com/?p=188</guid>
		<description><![CDATA[创建专业的电子商务垂直搜索，以及把原有的信息聚合平台转型为在线采购批发交易平台。根据服装和小商品的行业特点及交易需要，对原有的零批(小额批发)搜索进行改版，改造为适合服装和小商品的搜索频道，便是这次改版的商业目标。在Alibaba CEO 与中文站老大的授意下，我们搜索产品线的产品经理与用户体验设计师们进行了长达半年的准备工作。 项目组成员将对现有的功能需求，信息架构，视觉色彩，用户体验等，做多视角、多纬度的分析。力求在1688.com上线后，推出另一个电子商务垂直搜索用户体验盛宴。
 <a href="http://www.alitedesign.com/archives/188">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>[版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:<a href="http://www.alitedesign.com/">http://www.alitedesign.com/</a></p>
<h3>改版背景</h3>
<p>创建专业的电子商务垂直搜索，以及把原有的信息聚合平台转型为在线采购批发交易平台。根据行业特点及交易需要，对原有的零批(小额批发)搜索进行改版，改造为适合行业搜索交易频道，便是这次改版的设计目标。我们搜索产品线的产品经理与用户体验设计师们进行了长达半年的准备工作。 项目组成员将对现有的功能需求，信息架构，视觉色彩，用户体验等，做多视角、多纬度的分析。力求在1688.com上线后，推出另一个电子商务垂直搜索用户体验盛宴。</p>
<h3>功能需求取舍</h3>
<p> <a href="http://www.alitedesign.com/wp-content/uploads/2010/05/功能需求取舍.bmp"><img class="alignnone size-full wp-image-224" title="功能需求取舍" src="http://www.alitedesign.com/wp-content/uploads/2010/05/功能需求取舍.bmp" alt="" /></a></p>
<p>在项目中，我们从市场运营那里采集了大量需求，那怎么把这些需求归类整理，挑选出我们目标用户迫切需要的功能点呢？总体来说：<strong>以娱乐的心态取舍功能需求，只给最需要的不给最强悍的。</strong></p>
<p>来自运营的需求，来自用户的需求，往往多种多样，可以用千奇百怪来形容，那么如何配合产品规划师、产品经理找到用户最迫切的需求呢？</p>
<p><span id="more-188"></span></p>
<p>头脑风暴可以让产品设计团队成员产生很多创意。当收集到大量需求时，其中可能有主要需求与次要需求，客观判断哪些是首先要完成的，哪些是可以放到2期来做的，并制定标准需求优先级与对应时间节点，这样可以保证项目按期完成。</p>
<p>最让人头疼的往往是取舍功能需求，我们应该以什么标准，什么心态来应对呢？最好通过创建一个纸上原型或观察用户的操作，来制定取舍标准，并确保标准里涵盖以下基础点：</p>
<ul>
<li><strong>用户档案</strong>-描述用户的具体特点。特别注意用户在使用网站时的任何问题，如物理限制。（抛弃与用户的特点不匹配的需求）</li>
<li><strong>文本环境分析</strong>-研究用户的日常任务、工作流程模式、工作环境和概念框架。这有助于你理解为什么用户对正在测试的网站做出如此反应。（抛弃与用户操作环境不匹配的需求）</li>
<li><strong>可用性目标设定</strong>-需要制订质量具体化的目标，它能体现从用户档案中搜集到的需求。测试在某个阶段用户能否完成任务，如果用户受到限制，那就应该重新设定用户的目标。（抛弃与用户目标不匹配的需求）</li>
<li><strong>平台功能和约束</strong>-必须确定界面或产品的功能和限制，以界定可用性需求的范畴。这一信息会受用户可用性需求的影响。（抛弃与平台技术能力不匹配的需求）</li>
<li><strong>通用设计指南</strong>-必须使用公认的设计准则来设计你的界面。参照网页设计指南制作出来的网页才能在网页浏览器上表现正常。（抛弃与用户体验设计指南不匹配的需求）</li>
</ul>
<p>产品（交互）体验设计师在做互动设计之前，除了要对需求把关外还要消除项目关系人之间的分歧，满足用户的期望、工程师的期望、销售与市场人员的期望、经理的期望。最后寻找一个各方都能够接受的平衡点，具体阐述请参看：<a title="交互设计师怎样和产品团队合作" href="http://www.alitedesign.com/archives/41">交互设计师怎样和产品团队合作</a>。</p>
<h3>交互设计优化</h3>
<p><a href="http://www.alitedesign.com/wp-content/uploads/2010/05/从设计图到原型的诞生过程.bmp"><img class="alignnone size-full wp-image-203" title="从设计图到原型的诞生过程" src="http://www.alitedesign.com/wp-content/uploads/2010/05/从设计图到原型的诞生过程.bmp" alt="" /></a></p>
<p>从设计图到原型的诞生，是一个复杂而又有趣的过程。首先我们怎么完成复杂的设计图呢？前期的市场调研与需求分析为我们提供了第一手好资料，接下来我们要把这些资料逐条分析并提炼需求要点。在头脑风暴讨论中，交互设计师要与产品设计师、需求分析师等一起参加设计图创建的讨论。在讨论中确定商业需求范围、产品需求逻辑、产品规范等，最后总结出一份过程文档。它可能是BRD或FRD，它将是纸上原型的设计指导书。</p>
<p>当交互设计师拿到这个过程文档后，就可以创建设计图中的逻辑架构图和任务操作流程图了。在创建逻辑架构图时，可以选择Camp Tools或Illustrator制作，当然也有人选择Mind Manage制作。不管选用哪一种制作工具只要能把逻辑架构表达清晰即可，这里就不再赘述每种工具的使用方法和优缺点了。同时，交互设计师要始终以信息架构的原则来创建逻辑架构图，确保逻辑信息的完整性、表达信息的一致性、架构信息的简洁性等。在创建任务操作流程图时，通常选择Visio制作。在用Visio制作过程中，重在表达功能点之间的交互，我们可以用Visio中提供的流程图形与流程符号，来表达设计中的关键功能与关键节点。</p>
<p>在经过纸上原型设计之后，交互设计师要与产品规划师、可用性工程师迅速沟通，优化纸上原型。交互设计师会根据纸上原型确定的功能点与信息框架，通过Axure制作出低保真的交互设计原型DEMO。在制作Axure交互设计原型DEMO时候，应该注意的以下几点原则：</p>
<ol>
<li>用Axure页面导航结构去构建信息架构。</li>
<li>页面的命名要有统一的规范标准。例如：一级页面，二级页面，过程页面（状态页、结果页）等都要有统一的标准。</li>
<li>避免纠结复杂的交互控件实现。要记得Axure是快速原型实现工具，并且网上已经有很多成型的<a href="http://www.acleandesign.com/" target="_blank">Axure交互设计模板</a>可以直接调用。</li>
<li>少一点色彩与布局，多一点标注与说明。把色彩与布局的问题留给视觉思考吧，多些减少沟通成本并可消除歧义的注释吧。</li>
<li>Axure交付物也要注意可读性、可及性。把你的交互产出物移交给视觉和前端的时候，记得让他们能很容易看懂你想传达的东西。</li>
<li>交互设计原型不是必须生成HTML文件并能动态交互。不一定要能动态展示，但必须要能完整清楚传达出你的交互过程。</li>
</ol>
<p>最后，请交互设计师们把自己当成真正的产品设计师，你们对产品与项目的责任不低于项目（产品）经理。</p>
<h3>视觉色彩优化</h3>
<p><a href="http://www.alitedesign.com/wp-content/uploads/2010/05/视觉色彩优化.bmp"><img class="alignnone size-full wp-image-228" title="视觉色彩优化" src="http://www.alitedesign.com/wp-content/uploads/2010/05/视觉色彩优化.bmp" alt="" /></a><a href="http://www.alitedesign.com/wp-content/uploads/2010/05/视觉色彩优化.bmp"></a></p>
<p>IBM一直被人们称蓝色巨人（Big Blue)：信任、可靠。可口可乐是红色：活力、热情。颜色不仅仅作为这些公司的标识，还把它们加以理想化了。</p>
<p>不可否认，色彩改变了我们对于所见事物的反应“颜色”。不同的配色方案，给人以不同的感受，或顽皮、或深沉；或冷淡、或热情；或别致、或邋遢；或充满活力、或安静；或阴郁、或活泼；或端庄、或幼稚；或朴实、或浪漫；或专业、或业余；或炽热、或阴森。色彩选择，决定了人们在第一眼看到网站时的感觉。因此，色彩是Web设计者手中最普遍，也是最强大的工具。我们说“<strong>设计=解决问题</strong>”，而视觉设计，就是“<strong>用视觉语言去解决逻辑问题</strong>”。</p>
<p>在2002年，一个研究小组得到了一些有趣的发现。斯坦福Web可信性项目开始了解是什么因素让人们对网站产生信任或者不信任，而很多因素在他们的发现中都很明显：公司声誉、客户服务、出资人，还有广告，这些都会让用户决定该网站是否值得信任。但是最重要的因素——在他们列表中排在第一位的——却是网站的视觉风格和美感。</p>
<p>交互设计领域著名的大师，Donald Norman，总结说：“积极的情感增强了创造性和广度优先的思考，而负面的情感集中在认知上，增强深度优先处理并把干扰降到最少；积极的情感让人们更能容忍一些困难，在寻找解决方案的时候变得更灵活而有创造性。”当人们开始喜欢某些界面的时候，它们事实上会变得更可用。</p>
<p>电子商务垂直搜索LIST页面的视觉优化，风格上我们通常会支持品牌。目标上传达出一种强烈的品牌信息，如“阿里巴巴的橙色系列，“1688的Logo”。但是品牌识别不止是图标和广告词。它遍布在阿里巴巴项目产品设计、阿里巴巴的网站，以及阿里巴巴的材料中——事实上，品牌对配色方案的选择、字体、图形、词汇表，体现在各个方向。</p>
<p>视觉设计师制作了内容相同而风格不同的上百个界面，然后产品规划与设计团队成员集体投票，选择一个最合适的风格定位。在设计与选择的过程中，如果我们很了解目标用户，那么他们的内在反应和情感反应是可以预见的，并且可以预见的程度还相当惊人。答案就在于实际情况下很多因素的结合：</p>
<ul>
<li>颜色-让色彩更具有可读性，少一点颜色，多一点价值。</li>
<li>排版-根据字体的选择，文字颜色的选择，再看内在的、情感上的因素来布局。</li>
<li>规模-避免空间过度拥挤。</li>
<li>角度和形状-尖锐的角度、线交叉点或多个线条汇聚的地方，使用这些焦点把用户的眼光引导到你希望的地方去。</li>
<li>重复出现的视觉主题-角落处理模式可以给用户带来视觉旋律。</li>
<li>文本-选择形散，神不散的字体与文本颜色。</li>
<li>图片-节制性的使用装饰性图片，在功能性GUI里谨慎使用，因为会分散用户注意力。</li>
<li>文化因素-如果要表达明显的文化含义，考虑下将要面对的受重。</li>
</ul>
<p>针对<a href="http://search.china.alibaba.com/business/k-%B2%A5%B7%C5%C6%F7_n-y.html?button_click=top" target="_blank">电子商务搜索LIST页面</a>用户体验设计，视觉优化不是万能的，但是没有视觉优化阶段是万万不能的。</p>
<h3>前端代码优化</h3>
<p><a href="http://www.alitedesign.com/wp-content/uploads/2010/05/前端代码优化.bmp"><img class="alignnone size-full wp-image-225" title="前端代码优化" src="http://www.alitedesign.com/wp-content/uploads/2010/05/前端代码优化.bmp" alt="" /></a></p>
<p>文件越大，用来下载和显示页面的时间就越长。请记住：文件总体积，指的是构成Web页面的所有文件，包括：HTML、外部CSS、外部JavaScript、图像、声音以及视频在内的文件的大小。在这些文件中，HTML、CSS、以及JavaScript文件只是文本文件，因此，常常相当紧凑。而图像、声音，以及视频文件通常都很大，存在下载问题。</p>
<p>公共网站的页面大小，从每页小于20K到每页大于100K（包括页面的所有图形文件）。究竟应该有多大，即使是所谓的专家在这个问题上，也普遍存在着分歧。如果你的网站需要专业品质的图形，那么就不可能遵守“20K定律”。但是，如果目标受众的Internet连接速度慢，或者目标受众的耐性有限，你就不得不放弃那令人难以抗拒的漂亮图像，转而遵守关于“20K定律”的限制。怎么样为有限的文件体积做事先的规划呢？</p>
<ul>
<li>把大部分的CSS和JavaScript文件放入外部文件。只在网站第一次引用这些文件时，才进行下载。之后，网站上任何页面都可以重复使用这些文件，而无需再次下载。</li>
<li>重复使用不同页面的图形、音频和视频。因为这些文件也是在第一次时，才进行下载。</li>
<li>不要使用不必要的图形、动画或声音。无论是出于实用性的考虑，还是为了增强网站的吸引力，每个文件都应该有清楚的存在于网站上的理由。一个用于导航，大尺寸、具有吸引力的图像映射，同时具备了实用和美观两种用途，就像待售产品的照片一样。另一方面，应该去掉那些只起到填充空白作用的图形。</li>
<li>在可能的情况下，使用小尺寸图像，而不是大尺寸图像。因为在其他因素相同的条件下，与大尺寸图像相比，小尺寸图像的下载速度更快。例如：你可能使用一个平铺（重复）显示在背景上的小尺寸图像，代替单个的大尺寸背景图像。</li>
<li>尽量减少特殊导航按钮，每个按钮都具有独特的措辞和翻转效果，则需要下载100个不同的图像。相反地，50个文本链接（具有CSS提供的翻转效果），只需很小的下载代价。</li>
</ul>
<p>做为技术出身的交互设计师，可以不断探索新的技术带来的变革(例如：html5)。无论何时，页面打开速度是给用户的第一印象，也是提升用户对网站满意度的重要因素，并且前端代码的优化将会给用户带来舒适地操作体验！</p>
<h3>用户体验原则制定</h3>
<h3><a href="http://www.alitedesign.com/wp-content/uploads/2010/05/用户体验原则的制定.png"><img class="alignnone size-full wp-image-237" title="用户体验原则的制定" src="http://www.alitedesign.com/wp-content/uploads/2010/05/用户体验原则的制定.png" alt="" width="597" height="258" /></a></h3>
<p>在设计前我们要遵从一种通用性的用户体验设计原则，在设计后我们要能总结归纳出只适合此产品的用户体验规则。</p>
<p><strong>设计前设计思路：</strong></p>
<ol>
<li>以用户为中心的设计：设计必须是满足用户需求的、可行的，其次才是可产生商业价值的。</li>
<li>操作入口明确：任何一个产品都要有明确、合理的入口。</li>
<li>不歧视特殊人群：色盲、肢体残疾人士可以完成基本操作。</li>
<li>任务可被完成：任务在无外界影响下可以被完成。</li>
<li>问题可被解决：用户在任务中出现的问题，在无外界影响下可以被解决。</li>
<li>简洁自然，清晰易懂：用简洁、自然、用户可理解的形式表达信息。</li>
<li>突出重点，一目了然：用户的第一关注，将是设计中要表达的重点信息。</li>
<li>导航明晰、有效：导航明确清晰、有效，分类彼此独立、完全穷尽。</li>
<li>避免迷路：任何位置都能明确“我在那里？这里有什么？从这里能去哪里？”。</li>
<li>深广度平衡：单个页面上可见菜单项的数目与层级结构中级别的数目平衡。</li>
<li>习惯延续，必要延伸：用户的操作习惯必须延续，在用户可接受的范围之内适当延伸与引导。</li>
<li>符合用户心智模型：用户对功能的预期与实际操作的结果保持一致。</li>
<li>操作一致性：相同类型的命令或操作产生同样的效果。</li>
<li>及时、有效、友好：第一时间针对用户的操作作出有效、友好的反应。</li>
<li>避免出错：针对用户可能出现的错误，通过系统来避免错误的发生。</li>
<li>一次点击：尽可能减少完成任务所需要的操作次数。</li>
<li>别让我思考：用户的第一反应所产生的操作正确、有效。</li>
<li>最小记忆负担：避免用户需要记忆5条以上的数据。</li>
<li>最简化：帮助信息精简，准确描述，段落不超过3段，句子不超过30字。</li>
<li>适时帮助：当用户需要帮助的时候才提供帮助。</li>
<li>二倍、一个：方案设计数量增加两倍或减少到单位数量时，仍可适用该设计方案。</li>
<li>以简化繁：尽量使用简单、原生的交互方式解决复杂的用户交互行为。</li>
<li>符合栅格：页面布局符合栅格系统标准。</li>
<li>符合标准设计模式：交互控件符合DPL设计模式标准。</li>
</ol>
<p><strong>设计后体验原则：</strong></p>
<ol>
<li>启发式交互：让创新的界面具有教学功能。</li>
<li>速度第一：页面打开速度的重要意义已经超过了某些页面的普通功能。</li>
<li>即时有效：控件的反馈应该是即时的，而不是让用户去无限等待。</li>
<li>少即是多：操作起来足够的简单快速，页面功能也很强大。</li>
<li>个性化操作：满足交易型用户的口味，也可以同时满足浏览型用户的操作习惯。</li>
<li>可发现性：让一切应该在那时间看到的元素，一目了然吧。</li>
<li>简洁性：应用程序足够的干净，什么时候该出现，什么时候该消失，不给用户带来困扰。</li>
<li>差异化：这里的差异化指的是让用户能很容易辩识相同纬度的元素之间的差异，例如相关搜索的展示方式。</li>
</ol>
<p>其实，在设计前，我们会参考大量的通用性设计原则；在设计后，我们才会发现：对于项目有针对意义的原则也就很少的几条。这个时候需要靠设计师自己的逻辑归纳能力，把最重要最迫切的<a href="http://www.alitedesign.com/archives/168" target="_blank">用户体验设计原则</a>抽象出来。</p>
<h3>快速迭代与可用性测试</h3>
<p><a href="http://www.alitedesign.com/wp-content/uploads/2010/01/0.jpg"><img title="who-how-what启发式评估流程" src="http://www.alitedesign.com/wp-content/uploads/2010/01/0.jpg" alt="" width="574" height="313" /></a></p>
<p>在项目执行过程中，难免会有一些突发事件或需求变更，这时候我们需要一个严格的项目质量管理控制体系，来保证项目的质量的同时还要保证项目的进度。我们要通过快速迭代的方式来把之前的疏漏或错误进行修复，不要怕犯错误，应该勇于快速修正错误。一般快速迭代的开发机制是配合可用性测试（简约版启发式评估<strong>）</strong>同步进行的。</p>
<p>针对现有启发式评估流程上复杂，实现成本比较高的特点，进行的改进与精简，立足于机动性强，实现简单方便，灵活性更高的特点。我创新了一种简约版启发式评估的方法，适用于重要度和紧急度都高的项目。</p>
<p>根据<strong>who-how-what</strong>策略来快速开展简约版启发式评估，其中<strong>who-how-what</strong>为贯穿整个过程的主线,并且评估过程也分<strong>who-how-what</strong>三个部分，三个部分概括为6个字：准备-评估-报告。</p>
<p>具体可用性测试操作方法请参考：<a title="如何快速开展简约版启发式评估" href="http://www.alitedesign.com/archives/10">如何快速开展简约版启发式评估</a></p>
<h3>定性与定量结合的数据分析</h3>
<p> </p>
<p><a href="http://www.alitedesign.com/wp-content/uploads/2010/05/搜索数据指标对比.bmp"><img class="alignnone size-full wp-image-213" title="搜索数据指标对比" src="http://www.alitedesign.com/wp-content/uploads/2010/05/搜索数据指标对比.bmp" alt="" /></a></p>
<p><strong>1.       </strong><strong>搜索行为数变化</strong></p>
<p>零批搜索行为数环比上涨<strong>33.3%</strong>，零批搜索lpv环比上涨<strong>36.1%</strong>，搜索粘度环比上涨<strong>35%</strong></p>
<p><strong>2.       CTR</strong><strong>变化</strong></p>
<p>由于BD流量不稳定，对于CTR干扰较大，因此CTR分析中，以站内和SEO的数据为基准进行分析。</p>
<ul>
<li><strong>顶部搜索导航区</strong></li>
</ul>
<p>由于增加商品分类的导航入口、smart suggestion的应用、最近搜索记录三块的主要应用。<strong>CTR</strong><strong>由改版前</strong><strong>a%</strong><strong>提升到改版后的</strong><strong>b%</strong><strong>，提升了</strong><strong>207%</strong></p>
<ul>
<li><strong>类目区域</strong></li>
</ul>
<p>类目区改造为SN3.0版本，作为单独的项目，和搜索改版同时发布，<strong> CTR</strong><strong>由改版前</strong><strong>c%</strong><strong>提升到改版后的</strong><strong>d%</strong><strong>，提升了</strong><strong>139%</strong><strong>。</strong></p>
<ul>
<li><strong>快速筛选区</strong></li>
</ul>
<p>类目区域smart navigation效果显著，<strong>CTR</strong><strong>由改版前</strong><strong>e%</strong><strong>提升到改版后的</strong><strong>f%</strong><strong>，提升了</strong><strong>22%</strong></p>
<ul>
<li><strong>主数据区域</strong></li>
</ul>
<p>主数据区点击增长较明显的为标题、旺旺洽谈、图片，其中单日均值标题点击增长3.8W，图片点击增长1.9W、旺旺洽谈点击增长1W。<strong>CTR</strong><strong>由改版前</strong><strong>g%</strong><strong>提升到改版后的</strong><strong>h%</strong><strong>，提升了</strong><strong>8.9%</strong>。</p>
<p>可用性测试会产生大量的需要你检查的数据。测试完成后，你可能会得到下面一些数据：</p>
<ul>
<li>测试中的问题列表。</li>
<li>测试中关于时间、错误和其他性能测试数据，还包括调查问卷中的主观评分。</li>
<li>日志、笔记和调查问卷中测试者的评论。</li>
<li>测试团队的笔记记录。</li>
<li>测试参与者的背景资料数据。</li>
<li>测试过程的录像，可以从测试房间的多个角度获得。</li>
</ul>
<p>当将所有获得的数据都输入Excel完成后，就可以分析这些数据来发现一些趋势和问题。但是，问题也来了，正如马克.吐温所说，总存在着“谎言，可憎的谎言和数据”的问题，特别是对于一些推论性的数据而言，很容易造成数据误读。</p>
<p>一个有用的处理数据的技术是对其进行三角形化。这种方法可以清楚地看出整个数据中每组数据是如何影响其他各组数据的。三角形的每个顶点对应一种不同类型的数据：</p>
<ul>
<li>问题列表。</li>
<li>日志和调查问卷中的数值(定量）数据。</li>
<li>测试者的评论和测试团队的观察。</li>
</ul>
<p>根据可用性目标和测试前确定的数值标准来对数据进行检验，从而确定哪些问题位于三角形内部。</p>
<p>排除数据误读的方式，还有很多这里谈到的只是众多方式的冰山一角。对于电子商务搜索LIST页面用户体验优化，未来我们也不将止于此，好了接下来听听大家怎么说吧？</p>
<hr /><small>Copyright &copy; 2008<br /> This feed is for personal, non-commercial use only. <br /> The use of this feed on other websites breaches copyright. If this content is not in your news reader, it makes the page you are viewing an infringement of the copyright. (Digital Fingerprint:<br /> )</small>]]></content:encoded>
			<wfw:commentRss>http://www.alitedesign.com/archives/188/feed</wfw:commentRss>
		<slash:comments>69</slash:comments>
		</item>
		<item>
		<title>Microsoft ,Apple,Google用户体验设计原则</title>
		<link>http://www.alitedesign.com/archives/168</link>
		<comments>http://www.alitedesign.com/archives/168#comments</comments>
		<pubDate>Mon, 15 Mar 2010 06:54:05 +0000</pubDate>
		<dc:creator>Alite Yu</dc:creator>
				<category><![CDATA[用户体验]]></category>
		<category><![CDATA[Apple]]></category>
		<category><![CDATA[Google]]></category>
		<category><![CDATA[Microsoft]]></category>
		<category><![CDATA[用户体验设计原则]]></category>

		<guid isPermaLink="false">http://www.alitedesign.com/?p=168</guid>
		<description><![CDATA[Microsoft ,Apple,Google用户体验设计原则：微软的细致可以渗透到产品中的每一个环节，或组成人机界面的每一个像素，实在令人钦佩；苹果的轻巧不仅体现在它的工业设计上，更多的是它的操作系统和软件的用户体验层面；谷歌的简洁永远是它的产品特色，从谷歌网站的每个界面到浏览器chrome的用户体验与交互，都尽力把复杂问题设计得让用户感觉到最简单。  <a href="http://www.alitedesign.com/archives/168">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>[版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:<a href="http://www.alitedesign.com/archives/100">http://www.alitedesign.com/</a><br />
 </p>
<h3>细致的Microsoft</h3>
<p><strong>减少概念……增强信心 </strong></p>
<ul>
<li>你是不是引入了新的概念？为什么？真的必要吗？</li>
<li>你能去掉这些不需要的概念吗？</li>
<li>其中的区别有意义吗？</li>
<li>用户体验会延续同样的概念吗？</li>
</ul>
<p><strong>小的好或坏也很重要 </strong></p>
<ul>
<li>哪些重要的“小事”是经常会碰到的？</li>
<li>哪些小问题是你在着手解决的？</li>
<li>少做一些更好。</li>
<li>不要把小事从你的体验中去除。</li>
<li>为深思熟虑的细节制订计划。</li>
<li>修正小的错误。</li>
</ul>
<p><strong>看起来和用起来都很棒 </strong></p>
<ul>
<li>你的用户体验哪里最棒？它看起来有那么好吗？</li>
<li>用户第一眼看到的东西能够让人觉得它用户体验很棒吗？</li>
<li>用户体验符合期望吗？</li>
<li>用户很清楚能做什么吗？</li>
<li>是不是只提供了必要的步骤？</li>
</ul>
<p><span id="more-168"></span></p>
<p><strong>要解决的是让人分心的事，而不是可发现性 </strong></p>
<ul>
<li>减少令人分心的事情。</li>
<li>不要让功能自己之间进行竞争。</li>
<li>致力于新的功能。</li>
<li>下列方法不能解决糟糕的可发现问题：
<ul>
<li>在开始菜单上添加图标。</li>
<li>在桌面上放置图标。</li>
<li>在通知区域放置图标。</li>
<li>使用通知。</li>
<li>提供首次运行体验。</li>
<li>提供功能教程。</li>
</ul>
</li>
</ul>
<p><strong>旋钮和问题前的 UX </strong></p>
<ul>
<li>调低问题的音量。</li>
<li>只问一次。</li>
<li>不要要求配置来获取数据。</li>
<li>这个问题是不是已经问过了？</li>
<li>寻找合并统一的机会。</li>
</ul>
<p><strong>个性化，而非定制化 </strong></p>
<ul>
<li>这个功能是否能让用户自己来表述元素？</li>
<li>你是否能够区分个性化和定制化？</li>
<li>个性化是需要成为新的功能，还是可以利用现有的功能和信息（如用户的位置、背景图片或排列方式）？</li>
</ul>
<p><strong>体验的生命周期 </strong></p>
<ul>
<li>考虑下列各个阶段下的用户体验：
<ul>
<li>安装与生成</li>
<li>首次使用与定制</li>
<li>常规使用</li>
<li>管理与维护</li>
<li>卸载或升级</li>
</ul>
</li>
<li>以一个已经使用了 12 个月的用户身份来审视整个体验。它是否具有：
<ul>
<li>合理的内容</li>
<li>合理的“音量”</li>
</ul>
</li>
</ul>
<p><strong>为移动人士建造 </strong></p>
<ul>
<li>所有的 UX 原则对于 12 英寸和 20 英寸的屏幕都是等价适用的。</li>
<li>允许用户被打断。</li>
<li>考虑启动和中断（快速恢复，不要妨碍其他用户体验）。</li>
<li>考虑获取或失去连接。</li>
<li>性能永远是用户体验的杀手。</li>
</ul>
<p>ps:微软的细致可以渗透到产品中的每一个环节，或组成人机界面的每一个像素，实在令人钦佩。</p>
<h3>轻巧的Apple</h3>
<p><strong>注重设计过程 </strong></p>
<ul>
<li>在设计过程中引入用户交互的5个目标：
<ul>
<li>了解您的目标客户</li>
<li>分析用户的工作流</li>
<li>构造原型系统</li>
<li>观察用户测试</li>
<li> 制定观察用户准则 </li>
</ul>
</li>
<li>做出设计决定 
<ul>
<li>避免功能泛滥</li>
<li>80% 方案</li>
</ul>
</li>
<li>优秀软件的标准
<ul>
<li>高性能</li>
<li>易于使用</li>
<li>吸引人的界面</li>
<li>可靠</li>
<li>灵活</li>
<li>互操作性</li>
<li>移动性</li>
</ul>
</li>
</ul>
<p><strong>人机接口设计准则</strong></p>
<ul>
<li>人机接口设计准则：
<ul>
<li> 隐喻（尽量使用隐喻来描述程序的概念和功能，这样可以利用一些已有的概念和知识。）</li>
<li>反映用户的心智模型（用户的心智模型应该在产品的用户接口的设计中体现出来，主要体现在应用程序窗口的布局，工具栏上图标和控件的选择和组织，以及面板的功能等。）</li>
<li>隐式和显式操作（显示的操作清楚的表明了对一个对象操作的结果。隐式的操作通过一些可视化的线索或者上下文来表达结果。）</li>
<li>直接操作 （直接操作是隐式操作的一种，它会让用户觉得可以直接控制计算机显示的对象。）</li>
<li>用户控制一切（允许用户而不是计算机来启动和控制操作。）</li>
<li>反馈和交互（反馈和交互意味着通过合适的反馈以及和程序之间的交互从而让用户时刻知道现在发生了什么，而不仅仅是当事情出错时显示一个警告。）</li>
<li>一致性（在用户接口上的统一可以让用户使用从其他应用程序学到的知识和技巧。）</li>
<li> 所见即所得（用户应该可以找到程序的所有功能。）</li>
<li>容错性（提供充分的容错性以鼓励用户使用程序的各种功能─也就是说，大部分的操作都是很容易恢复的。）</li>
<li>感知的稳定性（为了给用户一个稳定的感知，对于对象以及实施在这些对象上的操作，Aqua接口提供了一个清晰的限制集合；为了不破坏用户对稳定性的体验，程序应该保留用户更改过的配置，例如窗口的大小和位置等；提供程序运行的状态和反馈让用户知道程序正在进行的任务，同样能提高感知的稳定性。）</li>
<li>整体美学（整体美学意味着信息经过良好的组织并且和视图设计一致。）</li>
<li>避免“模式”（尽可能的让用户在任何时候都能做他们想做的事情。避免使用模式对话框来将用户锁定在某个操作中，以至于在当前操作完成前用户不能做别的事情。）</li>
<li>管理程序的复杂性（开发一个易于使用的程序的最好办法就是设计得尽可能的简单。）</li>
</ul>
<li>设计的优先级</li>
<ul>
<li>满足最低限度的要求</li>
<li>发布用户期望的功能</li>
<li>让您的程序与众不同</li>
</ul>
</li>
</ul>
<p>ps:苹果的轻巧不仅体现在它的工业设计上，更多的是它的操作系统和软件的用户体验层面。 </p>
<h3>简洁的Google</h3>
<p> </p>
<p><a href="http://www.jonwiley.com/" target="_blank">Jon Wiley</a>- Google User Experience Designer 在一次专业分享中,提到了<strong>Google 的用户体验设计原则</strong>:</p>
<ul>
<li>1. 有用（Useful）：以用户为焦点，关注他们的生活、工作和梦想。</li>
<li>2. 快速（Fast）：争取节省每一个毫秒。</li>
<li>3. 简单（Simple）：简洁就是力量。</li>
<li>4. 魅力（Engaging）：能够唤起新手的好奇心，能够吸引资深用户。</li>
<li>5. 革新（Innovative）：勇于创新。</li>
<li>6. 通用（Universal）：全世界适用的设计。</li>
<li>7. 盈利（Profitable）：为现行的和将来的商业模式做好安排。</li>
<li>8. 优美（Beautiful）：外观具有视觉愉悦性，但是不会令用户分心。</li>
<li>9. 可信（Trustworthy）：值得用户信赖。</li>
<li>10. 人性（Personable）：加入人性化因素。</li>
</ul>
<p>ps:谷歌的简洁永远是它的产品特色，从谷歌网站的每个界面到浏览器chrome的用户体验与交互，都尽力把复杂问题设计得让用户感觉到最简单。</p>
<hr /><small>Copyright &copy; 2008<br /> This feed is for personal, non-commercial use only. <br /> The use of this feed on other websites breaches copyright. If this content is not in your news reader, it makes the page you are viewing an infringement of the copyright. (Digital Fingerprint:<br /> )</small>]]></content:encoded>
			<wfw:commentRss>http://www.alitedesign.com/archives/168/feed</wfw:commentRss>
		<slash:comments>50</slash:comments>
		</item>
		<item>
		<title>亚马逊购物用户体验分析</title>
		<link>http://www.alitedesign.com/archives/86</link>
		<comments>http://www.alitedesign.com/archives/86#comments</comments>
		<pubDate>Wed, 13 Jan 2010 03:29:20 +0000</pubDate>
		<dc:creator>Alite Yu</dc:creator>
				<category><![CDATA[用户体验]]></category>
		<category><![CDATA[亚马逊购物用户体验]]></category>

		<guid isPermaLink="false">http://alitedesign.com/?p=86</guid>
		<description><![CDATA[现在电子商务网站的设计,正面临着一系列的挑战,其中最主要的挑战是:我们尝试建立一种用户体验,来提高用户在线购物的可能性。 <a href="http://www.alitedesign.com/archives/86">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><strong> [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:</strong><a href="http://alitedesign.com/">http://www.alitedesign.com/</a> </p>
<p><a onclick="javascript:pageTracker._trackPageview('/outbound/article/203.208.39.132');" href="http://203.208.39.132/translate_c?hl=zh-CN&amp;sl=en&amp;tl=zh-CN&amp;u=http://www.webdesignerdepot.com/2009/10/an-analysis-of-the-amazon-shopping-experience/&amp;prev=hp&amp;rurl=translate.google.cn&amp;usg=ALkJrhiaKXTVIggsNW3XCHN3HNASM9tieg"></a><a href="http://alitedesign.com/wp-content/uploads/2010/01/thumb2.jpg"><img class="alignleft size-full wp-image-85" title="thumb2" src="http://alitedesign.com/wp-content/uploads/2010/01/thumb2.jpg" alt="" width="200" height="160" /></a> 现在电子商务网站的设计,正面临着一系列的挑战,其中最主要的挑战是:我们尝试建立一种用户体验<strong>,来提高用户在线购物的可能性</strong>。 </p>
<p>为了对抗网上激烈的竞争，消除网上多疑购物者的顾虑，设计人员可以采取一些措施来改善他们网上商城的可用性。 </p>
<p>自1995年以来， <a onclick="javascript:pageTracker._trackPageview('/outbound/article/203.208.39.132');" href="http://203.208.39.132/translate_c?hl=zh-CN&amp;sl=en&amp;tl=zh-CN&amp;u=http://www.amazon.com/&amp;prev=hp&amp;rurl=translate.google.cn&amp;usg=ALkJrhhRV6cTV7KO04C32fIBUx0HO9O2Xg">亚马逊</a>已经成为在电子商务B2C领域里,公认世界领导者。它的成功并非偶然，也不仅仅是在一个正确的地方与一个正确的时间的结果。 </p>
<p>亚马逊的成功是一个<strong>强大用户购物体验</strong>的直接结果。 </p>
<p>在本文中，我们将讨论大量有特色的<strong>亚马逊购物体验</strong> ，今天无论在原则上和实践上,都为许多的电子商务开发者,提供了值得仿效的模式。 </p>
<p><span id="more-86"></span></p>
<p><strong>双重目标明确</strong> </p>
<p>亚马逊购物体验开始，当然就在主页上，用户被从视觉上通知网站的双重目标： </p>
<p><strong>产品搜索和在线采购</strong> </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/01.jpg" border="0" alt="" width="510" height="335" /> </p>
<p>当您浏览亚马逊主页（在上面的截图），突出的是什么？永远是一片凌乱的布局，为数不多的简洁区块，有独特的元素立即捕捉用户的眼睛： <strong>在导航搜索的左上角，</strong>和靠近顶端的<strong>搜索/购物车控制器</strong> 。 </p>
<p>以下是相同的截图只不过通过使其他元素变灰，强调了它们两个区域: </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/02.jpg" border="0" alt="" width="510" height="335" /> </p>
<p>这些元素被强调了，我们看到亚马逊的简单双重目的是实现： </p>
<ul>
<li>用户可以快速查找和购买产品</li>
<li>卖方能够快速处理网上购物订单并获得利润</li>
</ul>
<p>因为亚马逊等众所周知的，只有极少数访问者不知道这两点（如：产品搜索和网上购物）都是可用的。 </p>
<p>但是，亚马逊的设计师和架构师团队已确保在网站的结构中,这两个元素是足够的突出和可用。 </p>
<p>设计师，客户，项目经理，和参与建设电子商务网站的开发人员，从一开始的用户体验(无论是第一次用户或回头客)都会遵循<strong>明确强调产品搜索和在线购买</strong>。 </p>
<p><strong>内容适合当前用户</strong> </p>
<p>一旦建立了网站的产品搜索与网上购物等功能，用户最有可能想利用这些特性的优势马上开始搜索。 </p>
<p>亚马逊使用Cookie来记录用户登录，而对用户的购物习惯进行跟踪并存储到服务器端。 </p>
<p>这是一个很好的提高，因为它<strong>动态地定制用户体验</strong>:以事先进行搜索，网页浏览，愿望清单添加，评价填写为基础，并达到最终购买目的。 </p>
<p><strong>相关产品显示</strong> </p>
<p>一个定制内容的例子展现在主页上，被修改的推荐内容取决于用户（无论是在或没有注册的）如何与产品搜索功能相互作用： </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/03.jpg" border="0" alt="" width="510" height="415" /> </p>
<p><strong>基于先前行为的推荐产品</strong> </p>
<p>只要浏览器的cookies保持不变,这种定制相同类型的内容就会在随后的访问中一连串出现： </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/04.jpg" border="0" alt="" width="510" height="356" /> </p>
<p>正如亚马逊那样，一个好的电子商务网站将跟踪客户端行为（在服务器端），以确保每个用户每次访问越来越适合他们的口味和习惯。 </p>
<p>这增加用户将进行购买的可能性，在某些情况下，将加快采购进程。 </p>
<p>更重要的是，它以更广泛的产品和配合他们感兴趣领域的服务公开给用户。 </p>
<p><strong>各种”为什么我们购物”的提示</strong> </p>
<p>亚马逊购物体验充斥着为何用户应该从亚马逊购买的提醒,而不是充斥着从其他来源（在线或其他方式）的提醒。 </p>
<p><strong>有几个例子所示，并在下面讨论。</strong> </p>
<p><strong>与市场零售价对比</strong> </p>
<p>上面显示每个产品都有不仅亚马逊优惠价格提供，而且还有MRSP（制造商建议零售价，或“定价”）。 </p>
<p>这个简单的功能是由于文案的撞击即时的被用户理解了。几乎每一个在亚马逊的产品都可以看到这样的情况。 </p>
<p>对用户（而不是在这么多字）来说，“这就是为什么你应该从我们这里购买此产品”。 这是一个简单但强大的销售诱因，毫无疑问它提高了亚马逊的收入。 </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/05.jpg" border="0" alt="" width="510" height="411" /> </p>
<p><strong>用户早先被通知“免费送货”</strong> </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/06.jpg" border="0" alt="" width="510" height="415" /> </p>
<p>另一个“为什么我们购物”很好的例子，就是在上面提醒显示的图片。当用户增加了一些产品到他们的购物车时，独特的黄色的大横幅在屏幕上方出现，并告诉用户：他们现在有资格取得免费送货服务。 </p>
<p>帮助横幅还包括所有的他们可能应用的限制规定的链接。 </p>
<p>从逻辑上讲，“免费送货通知”，应是在“航运选项一步”，但这一过程发生在该用户已经显示出了他们对购物篮中商品的购买承诺之后了。 </p>
<p>因此，一旦用户的购物车得到免费送货资格，就显示这种黄色横幅。同时他们将通过购买的可能性就会增加 。同样，实际上黄色横幅也说明了：“这是另一个从我们这里购物的很好理由”。 </p>
<p><strong>逼真的图书预览</strong> </p>
<p>其中购物者可能会放弃在网上购买机会的一个原因是，他们无法评估产品质量。 </p>
<p>但是，一个近距离预览的产品，这也是实际地比较手中持有的产品。将有助于消除一些，虽然不是全部疑虑。 </p>
<p><strong>“查找内部”功能</strong> </p>
<p>书是在亚马逊最常被购买的产品之一，所以毋庸置疑亚马逊的开发小组已经建立了一个关于“查找内部”内容的功能。 </p>
<p>“查找内部”的功能可以让购物者观看到书籍的某些部分：通常的封面，目录，第一页，索引和封底。 </p>
<p>这可能会非常有用，因为消费者能够一目了然，通过一个内容表或目录就知道一本书是否适合他们。 </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/07.jpg" border="0" alt="" width="510" height="415" /> </p>
<p>如出现在屏幕上面的图像和一些进一步的行动，“查找内部”的功能（这可找到不计其数的书籍）从任何网页（例如从拥有书籍封面缩略图的页面或从个别书籍的产品页面）访问。 </p>
<p>当鼠标Hover在书籍缩略图上时，产品页面将打开关于该书的可选章节菜单浮动框。 </p>
<p><strong>“内搜索”功能</strong> </p>
<p>对于“查找内部”功能的预览菜单上有一个小盒子标有“书内搜索”，它可以让用户搜索整本书，而不仅仅是部分章节预览。 </p>
<p>当用户从“查找内部”的菜单选择一项时，一个灯箱弹出，让用户预览的产品几乎是和你持有手中的书一样好。 </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/08.jpg" border="0" alt="" width="510" height="334" /> </p>
<p>如上所述，“内搜索”的功能也包括在灯箱，并提供了更多的功能。下面的图片展示了当用户执行搜索时展现状态的例子。 </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/09.jpg" border="0" alt="" width="510" height="415" /> </p>
<p>“内搜索”的功能，可以从书中的任何页面返回结果，但如果页面不能被预览就会通知用户不可用。 </p>
<p>现在的搜索引擎很智能，甚至能直观地判别单词的单复数，这是搜索的最佳实践。虽然我发现这个功能好像是一个婴儿车，当对一本书研究的时候,它仍然是一个很好的选择。 </p>
<p>电子商务开发人员完成这样一个在其网站的功能,今天可能没有预算或技术资源，但您可以确保在概念阶段的<strong>产品尽可能的给予曝光</strong>。 </p>
<p><strong>可定制的历史和推荐</strong> </p>
<p>早些时候，我们讨论了如何使“推荐产品”在亚马逊网站的某些部分出现。其中一些章节，以及浏览所有产品的查看历史记录都可以修改。 看一看下面的图片。 </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/10.jpg" border="0" alt="" width="510" height="367" /> </p>
<p>在“今天为您推荐”的下面,针对购物者亚马逊个人网页上列出的产品清单可以进行编辑。 </p>
<p>点击“修改这一建议”链接，将显示一个窗口，正好说明为什么推荐这个产品，并提供购物者去选择改变它的机会。 </p>
<p>通常一个被推荐的产品是以记录事先购买行为并跟踪购物习惯为基础的。这里购物者是可以告诉亚马逊不要推荐以那些因素为基础的产品。 </p>
<p>另一个可定制的功能是购物者已经浏览的所有产品历史记录。这个选项总是不容易被找到，但它会出现在该用户的个人页面的顶部。下面是一个用户的浏览历史的例子。 </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/11.jpg" border="0" alt="" width="510" height="415" /> </p>
<p>产品的显示顺序是从你最近一次(上一次)访问过的产品开始 ,而且每个项目都有一个“删除此产品”选项，类似于在购物车页面查找商品。 </p>
<p>当一个产品被删除，页面重新加载并更新清单。如果它是用AJAX做，此功能将更为高效，但它仍然是一个实用性的提高。 </p>
<p>在同一页的右侧栏，用户会看到一个列表是他们最近浏览的搜索条件和类别： </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/12.jpg" border="0" alt="" width="510" height="415" /> </p>
<p>点击“X”的每个项目旁边，在搜索条件和类别历史中，用户可以删除自己的任何项目。 这是一个客户端功能，因此结果是瞬间的：当他们删除一个产品时，用户不必等待整个页面的重新加载. </p>
<p>这些定制（或编辑）功能，确保购物体验不会给用户带来繁重的负担。如果他们收到的推荐，他们并不满意，用户可以修改它们，以改善今后的访问。 </p>
<p>电子商务开发人员可以按照这个例子，允许任何动态<strong>个性化用户尽可能为其定制内容</strong>。这可以确保用户不会感觉，好像内容正在通过广告或促销奖励强迫他们。 </p>
<p><strong>方便的导航元素</strong> </p>
<p>任何网上商店的成功，至关重要的一点，就是用户可以简单轻松地使用导航条。基本店铺分类，用户页面，购物车页面，采购页面等，像这样的任何购物体验点都可以轻松方便地被访问。 </p>
<p>在这方面亚马逊做了很好的工作，例如下方截图所示编号的部分。 </p>
<p><img src="http://www.blueidea.com/articleimg/2009/10/7101/13.jpg" border="0" alt="" width="510" height="343" /> </p>
<p>对“商店所有分类”按钮悬停（<strong>＃1</strong>）触发一个下拉菜单，显示了所有主要产品类别，让消费者轻松访问其他产品。导航元素的位置，恰恰是用户期望它被放在屏幕左上角LOGO下面的位置。 </p>
<p>在LOGO的旁边（<strong>＃2</strong>）有少数几个同样重要的链接，如登出的，个性化的推荐和用户的亚马逊个人页面。这一部分并不是非常突出，但出现的地方却是在顶部或上面与LOGO视觉平行的位置。 </p>
<p>下一个元素（<strong>＃3</strong>）部分有“购物车”和“愿望清单”。购物车功能的位置几乎没有什么变化,总是位于电子商务网站布局的右上角。 </p>
<p>每当用户浏览产品页面时，邀请他们加入自己的产品购物车或希望清单（<strong>＃4</strong>）。恰好这个位置是在亚马逊产品及产品细节的右边，用户可以很自然地找到此功能。 </p>
<p>最后，亚马逊邀请用户在亚马逊市场查看同一产品的”二手和新品”版本（<strong>＃5</strong>）。在其集市上销售的产品显然在短期内不能增加亚马逊的收入，但它可能获得长期的回报，因为仅知道此选项，可让许多购物者选择亚马逊作为其主要目标，甚至二手商品也是如此。 </p>
<p>亚马逊这样做是因为它很清楚的认识到：把用户的利益放在首位这对长远大有裨益。 </p>
<p>您还会注意到的这样的一个元素是其他五个中最为突出的一个，它具有艳丽的色彩，梯度和微妙的三维效果。 </p>
<p>这当然不是巧合：亚马逊希望在重要的地方引起用户的注意。 </p>
<p><strong>任何网站的成功关键点是导航元素的位置</strong>。就这一点而言，亚马逊竖立了很好的榜样，做到像用户期望的那样：确保在任何时间需要时，最重要的内容均可找到。 </p>
<p><strong>购物者应始终感觉舒适</strong> </p>
<p>对于电子商务网站这很重要，亚马逊在这一点做的很好。 </p>
<p>要增加用户进行购买的可能性，你必须在购物体验的每一个阶段， 确保他们是舒适的。亚马逊通过赋予客户在任何时候完全的控制，达到用户舒适的目的这样做很好。 </p>
<p><strong>易于筛选和用户评价比较</strong></p>
<p><img src="http://netdna.webdesignerdepot.com/uploads/amazon//compare-reviews.jpg" alt="Amazon Customer Reviews Easy to Compare" width="615" height="500" />  </p>
<p>上面的截图比较两种对立的客户评级和评论（所示两边“VS”图形）。用户还可以按等级过滤客户评论。为什么这样做会使他们感到舒服？因为用户将要花费自己辛苦赚得的美元，并应该让用户感到更舒适，能够<strong>方便地访问正面和负面评论</strong> 。  </p>
<p>通过获得有好有坏透彻的客户评论，使他们更加安心购买，并帮助他们做出明智的决定。  </p>
<p>用户不是迫于压力才购买商品的，而是认为是否购买产品的决策权是否完全掌握在自己手中。  </p>
<p><strong>额外的购物车选项</strong></p>
<p><img src="http://netdna.webdesignerdepot.com/uploads/amazon//cart-options.jpg" alt="Amazon Cart Options" width="615" height="500" />  </p>
<p>如上所述，在购物车页面包括一些选项，可以让用户感到舒适。首先，如果对于一次特定购买行为用户改变了主意，他们有权选择从购物车里删除它们。  </p>
<p>但删除(Delete)宁愿是最后一个行为，所以他们选择用先保存下来以后处理(Saving it for later)替代了去执行删除(Delete)。你可以称之为<em>“软删除”：</em>它会从购物车的产品中移出，但会保存在用户购物车页面上的物品清单里。在任何时候用户都可以很容易的再添加回购物车中。  </p>
<p><strong>在运送(航运)页面更改或删除产品</strong></p>
<p>在随后的购买步骤中，用户可以继续控制。看一看下一张图片。  </p>
<p>当选择运送选项时候，用户将看到该页面，这可能意味着他们已经承诺或接近承诺，购买该产品了。  </p>
<p><img src="http://netdna.webdesignerdepot.com/uploads/amazon/shipping-quantity2.jpg" alt="Amazon Shipping Options" />  </p>
<p>当选择的送货方式时，提供用户一个相当突出的按钮去<em>“更改数量或删除”。</em>鉴于以上的运送方式，用户很可能需要这些选项，因此，现在该按钮可以让用户得到帮助并使他放心使用。  </p>
<p><strong>提醒用户“继续”并不意味着“最终决定”</strong></p>
<p><img src="http://netdna.webdesignerdepot.com/uploads/amazon//before-final.jpg" alt="Amazon Cart Prior to Final Purchase" width="615" height="320" />  </p>
<p>在用户往购物车添加了产品，并选择了送货方式后，他们回顾了下他们的概要订单，并点击<em>“继续</em><em>”</em>按钮继续他们的购物。该按钮不是让他们确认订单，也不是他们实际购买的最后一个页面。  </p>
<p>为了确保用户知道这不是<em>“最后</em><em>”</em>一步，放在下方的<em>“继续”</em>按钮是一个有益的提醒，提醒他们把最终的订单放在最后汇总页面确认。  </p>
<p>电子商务开发人员可以通过学习亚马逊移情用户体验的例子，理解用户各项关注和忧虑，包括一个用户每个阶段可能的购物体验。  </p>
<p>开发人员应该<strong>加强购物体验</strong>，<strong>使用户感到舒适</strong>和可控。  </p>
<p>  </p>
<p><strong>结论</strong></p>
<p>在本文中我们没有办法可以涵盖所有亚马逊购物体验的优点。  </p>
<p>但是，我们已经讨论的几项应该足以帮助您了解，在亚马逊，工程师如何塑造了几项在线体验的强大功能。  </p>
<p>  </p>
<p><strong>亚马逊购物体验的经验教训</strong></p>
<ul>
<li><em><strong>一个电子商务的网站</strong></em><strong><em>的焦点</em></strong>， <em><strong>应是产品搜索和在线购买。</strong></em></li>
<li><em><strong>只要有可能，应该为每个用户提供个性化内容。</strong></em></li>
<li><em><strong>给予“为什么我们购物”的提醒<em><strong>创建</strong></em>销售奖励。</strong></em></li>
<li><em><strong>让用户尽可能多的接触到产品。</strong></em></li>
<li><em><strong>不要让用户感到有些产品/服务正在强迫他们购买。</strong></em></li>
<li><em><strong>在适当的时候可轻松地访问重要部分。</strong></em></li>
<li><em><strong>在任何时候让顾客感到舒服和可控。</strong></em></li>
</ul>
<p>亚马逊购物体验并不完美。它有它的缺陷，但这是另一篇文章的主题。但好的远远大于糟糕的。  </p>
<p>当然，技术和预算的限制，使一些电子商务的发展，变得遥不可及。但是，以下这些最佳实践的基本原则，在您项目的预算和规范内，您将能够实现可用性增强的各项功能。  </p>
<p>实行这些原则将确保您的网上商店提供贴心的体验给买家和卖家。</p>
<hr /><small>Copyright &copy; 2008<br /> This feed is for personal, non-commercial use only. <br /> The use of this feed on other websites breaches copyright. If this content is not in your news reader, it makes the page you are viewing an infringement of the copyright. (Digital Fingerprint:<br /> )</small>]]></content:encoded>
			<wfw:commentRss>http://www.alitedesign.com/archives/86/feed</wfw:commentRss>
		<slash:comments>11</slash:comments>
		</item>
		<item>
		<title>用户体验如何提升阿里巴巴的商业价值</title>
		<link>http://www.alitedesign.com/archives/82</link>
		<comments>http://www.alitedesign.com/archives/82#comments</comments>
		<pubDate>Tue, 12 Jan 2010 06:22:30 +0000</pubDate>
		<dc:creator>Alite Yu</dc:creator>
				<category><![CDATA[用户体验]]></category>
		<category><![CDATA[阿里巴巴的商业价值]]></category>

		<guid isPermaLink="false">http://alitedesign.com/?p=82</guid>
		<description><![CDATA[这是一个产品项目计划书吧?不是!难道是一个让千万淘宝卖家扬眉吐气的计划?呵呵,不全是!那难道是一个让上亿电子商务卖家变成真正旺铺的秘诀!恭喜您答对了! <a href="http://www.alitedesign.com/archives/82">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><strong>[版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:</strong><a href="http://alitedesign.com/">http://www.alitedesign.com/</a></p>
<p><a href="http://alitedesign.com/wp-content/uploads/2010/01/naver.gif"><img class="alignnone size-full wp-image-81" title="naver" src="http://alitedesign.com/wp-content/uploads/2010/01/naver.gif" alt="" width="575" height="388" /></a></p>
<p><span id="more-82"></span></p>
<p><a href="http://alitedesign.com/wp-content/uploads/2010/01/alibaba.gif"><img class="alignnone size-full wp-image-83" title="alibaba" src="http://alitedesign.com/wp-content/uploads/2010/01/alibaba.gif" alt="" width="575" height="388" /></a></p>
<p>这两副图片哪张更能勾起你买东西的欲望呢?相信大多数买家更喜欢看大图,实物图,产品细节图等.如果我们的卖家更能倾听下我们买家的心声.他们的产品会不会更受关注些呢?</p>
<p>阿里巴巴不会做这样一个平台,包括物流在内的一些由于电子商务所发展起来的新兴行业,也许物流并不能完全表现出这种情况.阿里巴巴的卖家需要这样一个平台:可以提供拍摄产品图片装饰服务-模特与实物原创,图片质量高,立意新颖.在更多的消费品行业中这种需求尤其明显,我们的卖家太需要把自己的产品好好装饰一下了.在很多的用户可用性测试中,更多的用户喜欢点产品图片质量高的.他们认为那样的产品更符合他们的期望值.</p>
<p>设想一下,如果更多的卖家把照片的质量都超越第一张图片的水平,还怕我们的买家不去关注卖家产品么?消费的驱动力除了外因更多的是卖家内因主导,找个时间把公司的产品图片好好装饰下吧.让我们的买家更多的了解你的产品,留住他短暂珍贵的记忆.</p>
<p>曾经萌生发起这样的一个项目,但是这也许是阿里巴巴并不擅长的领域.期望第三方市场早日成熟,尽快打通这大市场的氛围.让更多的人有机会可以在电子商务的舞台上尽显光辉.</p>
<hr /><small>Copyright &copy; 2008<br /> This feed is for personal, non-commercial use only. <br /> The use of this feed on other websites breaches copyright. If this content is not in your news reader, it makes the page you are viewing an infringement of the copyright. (Digital Fingerprint:<br /> )</small>]]></content:encoded>
			<wfw:commentRss>http://www.alitedesign.com/archives/82/feed</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
	</channel>
</rss>
