http://alite.aliued.cn 生活中发现的点滴,其实都是设计中的细节 Tue, 08 Jun 2010 07:08:26 +0000 http://backend.userland.com/rss092 en http://alite.aliued.cn已经升级为http://www.alitedesign.com 请各位好友进行连接更新。 If you enjoyed this article please consider staying updated via RSS. Links to your own social media pages could be added here. This entry was posted on 星期六, 四月 3th, 2010 at 01:32 and is filed under 交互设计. You can follow any responses to this entry through the RSS 2.0 ... http://alite.aliued.cn/archives/1199 http://alite.aliued.cn即将升级为http://www.alitedesign.com 请各位好友进行连接更新。 If you enjoyed this article please consider staying updated via RSS. Links to your own social media pages could be added here. This entry was posted on 星期六, 四月 3th, 2010 at 01:32 and is filed under 交互设计. You can follow any responses to this entry through the RSS ... http://alite.aliued.cn/archives/1161 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:http://www.alitedesign.com/ 上期回顾:交互设计模式(三)-Tagging(标签) 当人们进入一个全新环境时,他们需要对空间建立认知模型,要有个空间记忆的感觉。同样，当新用户来到全新、陌生的网站时，用户也希望有个类似站点地图的东西。但如果想让用户更加自如的使用网站，让用户毫无顾及的去尝试，不怕迷路，我们必须为用户建立起空间记忆模式。它犹如沙漠中迷途者手中的指南针与行驶在荒原上汽车装的GPS一样，那么在网站上空间记忆模式的应用有哪些表现呢？ 来自用户的抱怨 “我敢发誓，这个按钮一分钟以前还在这里。它哪里去了？” 当人们使用东西或文档时，他们经常通过回忆它们在哪里来再次找到它们，而不是它们的名字。很多网站把它们的表单按钮——确定、取消等——放在预定的位置上，部分原因是由于它们的空间记忆依赖性。在复杂的应用系统中，下面这些元素也可以由记忆它们的相对位置找到：工具条上的工具、层级结构中的对象等。因此，你应该小心使用像响应式展开（Responsive Disclosure）这样的模式。把某个东西添加到界面上通常不会引起麻烦，但是把控件重新排列会打乱空间记忆，从而难以找到。这得看具体情况，如果你不确定的话可以做一些用户测试。空间记忆和习惯之间的关系很密切。和习惯一样，空间记忆也是一个在应用中及在应用间保持一致性会带来好处的理由。人们会期望在类似的地方找到类似的功能表现。顺便说一句，网站导航菜单列表的顶部和底部都是很特别的区域，从认知的角度说，与处于菜单中间的项目相比，顶部和底部的项目会获得用户更多的注意力，记忆也更持久。如果他们发生改变，对用户的重新建立空间记忆势必会造成影响，请慎之。 用户浏览历史 Taobao.com 在淘宝list页面的右边栏，淘宝设置了用户最近浏览过的detail产品的历史记录。这种设计方式让用户可以轻松地追溯曾经浏览过的产品，并比较它们。 Amazon.com 产品的显示顺序是从你最近一次(上一次)访问过的产品开始 ,而且每个项目都有一个“删除此产品”选项，类似于在购物车页面查找商品。 当一个产品被删除，页面重新加载并更新清单。如果它是用AJAX做，此功能将更为高效，但它仍然是一个实用性的提高。 在亚马逊用户浏览历史记录页的右侧栏，用户会看到一个列表是他们最近浏览的搜索条件和类别：点击“X”的每个项目旁边，在搜索条件和类别历史中,用户可以删除自己的任何项目。这是一个客户端功能，因此结果是瞬间的：当他们删除一个产品时,用户不必等待整个页面的重新加载.这些定制（或编辑）功能，确保购物体验不会给用户带来繁重的负担。如果他们收到的推荐，他们并不满意，用户可以修改它们，以改善今后的访问。 通过以上的案例，我们知道淘宝与亚马逊都尽量考虑了用户的最原始需求：对浏览历史的跟踪和追溯，并且他们都给予了创新，淘宝把它与对比产品联系在一起，亚马逊把它和可定制的历史推荐系统联系在一起。用户可以轻松找到曾经关注过的产品，也不容易迷失在复杂的网站中。并且，让用户建立空间记忆模式的同时赋予更多的可用性价值。 Undo,Redo与返回，前进 IE浏览器 无论是软件中的撤消与重做，还是IE浏览器中的返回与前进按钮。全都是为用户能够快速返回到熟悉环境而设计。这样的空间记忆模式是如此贴心，使用网站的用户再也不用担心会迷路，即使这个网站的面包屑多么糟糕！可惜的是返回、前进是线性的循序操作，对于１到３步的返回、前进还是很方便的。但是对于４步以上就会很麻烦了。所以面包屑方式在某些时候可以跳跃方式的返回某个状态，这也许是其中为什么好多大型网站没有完全抛弃面包屑的一个小原因吧？当然还有其他原因这里不再赘述！ 其他空间记忆表现形式 搜索框历史输入记录 面包屑 筛选历史记录 以上只是在空间记忆模式中，表现形式的冰山一角而已。更多的空间记忆表现，只要我们平常愿意去观察我们身边的设计，也许会发现更多有意思的空间记忆。 总结： 当网站重构、首页改版需要交互设计师出Demo的时候，记得考虑下用户的空间记忆与操作习惯。在创新的同时，要兼顾老用户的操作习惯与思维方式，用户的操作环境经常处于一种“有序的混乱”状态，看起来乱糟糟的，但是用户可以很快找到他要的东西。 http://alite.aliued.cn/archives/1095 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:http://www.alitedesign.com/ 上期回顾:亚马逊购物用户体验分析 (二) 方便的导航元素 任何网上商店的成功，至关重要的一点，就是用户可以简单轻松地使用导航条。基本店铺分类，用户页面，购物车页面，采购页面等，像这样的任何购物体验点都可以轻松方便地被访问。 在这方面亚马逊做了很好的工作，例如下方截图所示编号的部分。 对“商店所有分类”按钮悬停（＃1）触发一个下拉菜单，显示了所有主要产品类别，让消费者轻松访问其他产品。导航元素的位置，恰恰是用户期望它被放在屏幕左上角LOGO下面的位置。 在LOGO的旁边（＃2）有少数几个同样重要的链接，如登出的，个性化的推荐和用户的亚马逊个人页面。这一部分并不是非常突出，但出现的地方却是在顶部或上面与LOGO视觉平行的位置。 下一个元素（＃3）部分有“购物车”和“愿望清单”。购物车功能的位置几乎没有什么变化,总是位于电子商务网站布局的右上角。 每当用户浏览产品页面时，邀请他们加入自己的产品购物车或希望清单（＃4）。恰好这个位置是在亚马逊产品及产品细节的右边，用户可以很自然地找到此功能。 最后，亚马逊邀请用户在亚马逊市场查看同一产品的”二手和新品”版本（＃5）。在其集市上销售的产品显然在短期内不能增加亚马逊的收入，但它可能获得长期的回报，因为仅知道此选项，可让许多购物者选择亚马逊作为其主要目标，甚至二手商品也是如此。 亚马逊这样做是因为它很清楚的认识到：把用户的利益放在首位这对长远大有裨益。 您还会注意到的这样的一个元素是其他五个中最为突出的一个，它具有艳丽的色彩，梯度和微妙的三维效果。 这当然不是巧合：亚马逊希望在重要的地方引起用户的注意。 任何网站的成功关键点是导航元素的位置。就这一点而言，亚马逊竖立了很好的榜样，做到像用户期望的那样：确保在任何时间需要时，最重要的内容均可找到。 购物者应始终感觉舒适 对于电子商务网站这很重要，亚马逊在这一点做的很好。 要增加用户进行购买的可能性，你必须在购物体验的每一个阶段， 确保他们是舒适的。亚马逊通过赋予客户在任何时候完全的控制，达到用户舒适的目的这样做很好。 易于筛选和用户评价比较 上面的截图比较两种对立的客户评级和评论（所示两边“VS”图形）。用户还可以按等级过滤客户评论。为什么这样做会使他们感到舒服？因为用户将要花费自己辛苦赚得的美元，并应该让用户感到更舒适，能够方便地访问正面和负面评论 。 通过获得有好有坏透彻的客户评论，使他们更加安心购买，并帮助他们做出明智的决定。 用户不是迫于压力才购买商品的，而是认为是否购买产品的决策权是否完全掌握在自己手中。 额外的购物车选项 如上所述，在购物车页面包括一些选项，可以让用户感到舒适。首先，如果对于一次特定购买行为用户改变了主意，他们有权选择从购物车里删除它们。 但删除(Delete)宁愿是最后一个行为，所以他们选择用先保存下来以后处理(Saving it for later)替代了去执行删除(Delete)。你可以称之为“软删除”：它会从购物车的产品中移出，但会保存在用户购物车页面上的物品清单里。在任何时候用户都可以很容易的再添加回购物车中。 在运送(航运)页面更改或删除产品 在随后的购买步骤中，用户可以继续控制。看一看下一张图片。 当选择运送选项时候，用户将看到该页面，这可能意味着他们已经承诺或接近承诺，购买该产品了。 当选择的送货方式时，提供用户一个相当突出的按钮去“更改数量或删除”。鉴于以上的运送方式，用户很可能需要这些选项，因此，现在该按钮可以让用户得到帮助并使他放心使用。 提醒用户“继续”并不意味着“最终决定” 在用户往购物车添加了产品，并选择了送货方式后，他们回顾了下他们的概要订单，并点击“继续”按钮继续他们的购物。该按钮不是让他们确认订单，也不是他们实际购买的最后一个页面。 为了确保用户知道这不是“最后”一步，放在下方的“继续”按钮是一个有益的提醒，提醒他们把最终的订单放在最后汇总页面确认。 电子商务开发人员可以通过学习亚马逊移情用户体验的例子，理解用户各项关注和忧虑，包括一个用户每个阶段可能的购物体验。 开发人员应该加强购物体验，使用户感到舒适和可控。 结论 在本文中我们没有办法可以涵盖所有亚马逊购物体验的优点。 但是，我们已经讨论的几项应该足以帮助您了解，在亚马逊，工程师如何塑造了几项在线体验的强大功能。 亚马逊购物体验的经验教训 一个电子商务的网站的焦点， 应是产品搜索和在线购买。 只要有可能，应该为每个用户提供个性化内容。 给予“为什么我们购物”的提醒创建销售奖励。 让用户尽可能多的接触到产品。 不要让用户感到有些产品/服务正在强迫他们购买。 在适当的时候可轻松地访问重要部分。 在任何时候让顾客感到舒服和可控。 亚马逊购物体验并不完美。它有它的缺陷，但这是另一篇文章的主题。但好的远远大于糟糕的。 当然，技术和预算的限制，使一些电子商务的发展，变得遥不可及。但是，以下这些最佳实践的基本原则，在您项目的预算和规范内，您将能够实现可用性增强的各项功能。 实行这些原则将确保您的网上商店提供贴心的体验给买家和卖家。 查看原文感谢BY Louis Lazaris http://alite.aliued.cn/archives/1060 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:http://www.alitedesign.com/ 上期回顾:亚马逊购物用户体验分析 (一) “查找内部”功能 书是在亚马逊最常被购买的产品之一，所以毋庸置疑亚马逊的开发小组已经建立了一个关于“查找内部”内容的功能。 “查找内部”的功能可以让购物者观看到书籍的某些部分：通常的封面，目录，第一页，索引和封底。 这可能会非常有用，因为消费者能够一目了然，通过一个内容表或目录就知道一本书是否适合他们。 如出现在屏幕上面的图像和一些进一步的行动，“查找内部”的功能（这可找到不计其数的书籍）从任何网页（例如从拥有书籍封面缩略图的页面或从个别书籍的产品页面）访问。 当鼠标Hover在书籍缩略图上时，产品页面将打开关于该书的可选章节菜单浮动框。 “内搜索”功能 对于“查找内部”功能的预览菜单上有一个小盒子标有“书内搜索”，它可以让用户搜索整本书，而不仅仅是部分章节预览。 当用户从“查找内部”的菜单选择一项时，一个灯箱弹出，让用户预览的产品几乎是和你持有手中的书一样好。 如上所述，“内搜索”的功能也包括在灯箱，并提供了更多的功能。下面的图片展示了当用户执行搜索时展现状态的例子。 “内搜索”的功能，可以从书中的任何页面返回结果，但如果页面不能被预览就会通知用户不可用。 现在的搜索引擎很智能，甚至能直观地判别单词的单复数，这是搜索的最佳实践。虽然我发现这个功能好像是一个婴儿车，当对一本书研究的时候,它仍然是一个很好的选择。 电子商务开发人员完成这样一个在其网站的功能,今天可能没有预算或技术资源，但您可以确保在概念阶段的产品尽可能的给予曝光。 可定制的历史和推荐 早些时候，我们讨论了如何使“推荐产品”在亚马逊网站的某些部分出现。其中一些章节，以及浏览所有产品的查看历史记录都可以修改。 看一看下面的图片。 在“今天为您推荐”的下面,针对购物者亚马逊个人网页上列出的产品清单可以进行编辑。 点击“修改这一建议”链接，将显示一个窗口，正好说明为什么推荐这个产品，并提供购物者去选择改变它的机会。 通常一个被推荐的产品是以记录事先购买行为并跟踪购物习惯为基础的。这里购物者是可以告诉亚马逊不要推荐以那些因素为基础的产品。 另一个可定制的功能是购物者已经浏览的所有产品历史记录。这个选项总是不容易被找到，但它会出现在该用户的个人页面的顶部。下面是一个用户的浏览历史的例子。 产品的显示顺序是从你最近一次(上一次)访问过的产品开始 ,而且每个项目都有一个“删除此产品”选项，类似于在购物车页面查找商品。 当一个产品被删除，页面重新加载并更新清单。如果它是用AJAX做，此功能将更为高效，但它仍然是一个实用性的提高。 在同一页的右侧栏，用户会看到一个列表是他们最近浏览的搜索条件和类别： 点击“X”的每个项目旁边，在搜索条件和类别历史中,用户可以删除自己的任何项目。 这是一个客户端功能，因此结果是瞬间的：当他们删除一个产品时,用户不必等待整个页面的重新加载. 这些定制（或编辑）功能，确保购物体验不会给用户带来繁重的负担。如果他们收到的推荐，他们并不满意，用户可以修改它们，以改善今后的访问。 电子商务开发人员可以按照这个例子,允许任何动态个性化用户尽可能为其定制内容 。这可以确保用户不会感觉,好像内容正在通过广告或促销奖励强迫他们。 如果您好奇心和求知欲未消请继续阅读亚马逊购物用户体验分析 (三) http://alite.aliued.cn/archives/1050 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:http://www.alitedesign.com/ 现在电子商务网站的设计,正面临着一系列的挑战,其中最主要的挑战是:我们尝试建立一种用户体验,来提高用户在线购物的可能性。 为了对抗网上激烈的竞争，消除网上多疑购物者的顾虑，设计人员可以采取一些措施来改善他们网上商城的可用性。 自1995年以来， 亚马逊已经成为在电子商务B2C领域里,公认世界领导者。它的成功并非偶然，也不仅仅是在一个正确的地方与一个正确的时间的结果。 亚马逊的成功是一个强大用户购物体验的直接结果。 在本文中，我们将讨论大量有特色的亚马逊购物体验 ，今天无论在原则上和实践上,都为许多的电子商务开发者,提供了值得仿效的模式。 双重目标明确 亚马逊购物体验开始，当然就在主页上，用户被从视觉上通知网站的双重目标： 产品搜索和在线采购 当您浏览亚马逊主页（在上面的截图），突出的是什么？永远是一片凌乱的布局，为数不多的简洁区块，有独特的元素立即捕捉用户的眼睛： 在导航搜索的左上角，和靠近顶端的搜索/购物车控制器 。 以下是相同的截图只不过通过使其他元素变灰，强调了它们两个区域: 这些元素被强调了，我们看到亚马逊的简单双重目的是实现： 用户可以快速查找和购买产品 卖方能够快速处理网上购物订单并获得利润 因为亚马逊等众所周知的，只有极少数访问者不知道这两点（如：产品搜索和网上购物）都是可用的。 但是，亚马逊的设计师和架构师团队已确保在网站的结构中,这两个元素是足够的突出和可用。 设计师，客户，项目经理，和参与建设电子商务网站的开发人员，从一开始的用户体验(无论是第一次用户或回头客)都会遵循明确强调产品搜索和在线购买。 内容适合当前用户 一旦建立了网站的产品搜索与网上购物等功能，用户最有可能想利用这些特性的优势马上开始搜索。 亚马逊使用Cookie来记录用户登录，而对用户的购物习惯进行跟踪并存储到服务器端。 这是一个很好的提高，因为它动态地定制用户体验:以事先进行搜索，网页浏览，愿望清单添加，评价填写为基础，并达到最终购买目的。 相关产品显示 一个定制内容的例子展现在主页上，被修改的推荐内容取决于用户（无论是在或没有注册的）如何与产品搜索功能相互作用： 基于先前行为的推荐产品 只要浏览器的cookies保持不变,这种定制相同类型的内容就会在随后的访问中一连串出现： 正如亚马逊那样，一个好的电子商务网站将跟踪客户端行为（在服务器端），以确保每个用户每次访问越来越适合他们的口味和习惯。 这增加用户将进行购买的可能性，在某些情况下，将加快采购进程。 更重要的是，它以更广泛的产品和配合他们感兴趣领域的服务公开给用户。 各种"为什么我们购物"的提示 亚马逊购物体验充斥着为何用户应该从亚马逊购买的提醒,而不是充斥着从其他来源（在线或其他方式）的提醒。 有几个例子所示，并在下面讨论。 与市场零售价对比 上面显示每个产品都有不仅亚马逊优惠价格提供，而且还有MRSP（制造商建议零售价，或“定价”）。 这个简单的功能是由于文案的撞击即时的被用户理解了。几乎每一个在亚马逊的产品都可以看到这样的情况。 对用户（而不是在这么多字）来说，“这就是为什么你应该从我们这里购买此产品”。 这是一个简单但强大的销售诱因，毫无疑问它提高了亚马逊的收入。 用户早先被通知“免费送货” 另一个“为什么我们购物”很好的例子，就是在上面提醒显示的图片。当用户增加了一些产品到他们的购物车时，独特的黄色的大横幅在屏幕上方出现，并告诉用户：他们现在有资格取得免费送货服务。 帮助横幅还包括所有的他们可能应用的限制规定的链接。 从逻辑上讲，“免费送货通知”，应是在“航运选项一步”，但这一过程发生在该用户已经显示出了他们对购物篮中商品的购买承诺之后了。 因此，一旦用户的购物车得到免费送货资格，就显示这种黄色横幅。同时他们将通过购买的可能性就会增加 。同样，实际上黄色横幅也说明了：“这是另一个从我们这里购物的很好理由”。 逼真的图书预览 其中购物者可能会放弃在网上购买机会的一个原因是，他们无法评估产品质量。 但是，一个近距离预览的产品，这也是实际地比较手中持有的产品。将有助于消除一些，虽然不是全部疑虑。 如果您兴趣未消请继续阅读亚马逊购物用户体验分析 (二) http://alite.aliued.cn/archives/1044 上期回顾:交互设计模式(二)-Pagination(分页,标记页数) [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:http://www.alitedesign.com/ Tagging(标签) 问题摘要 用户往往想通过流行或最详尽的主题来浏览内容。 实例 何时使用 当您的网站用户想要自己添加内容和可能更多的标签时。 当您的网站已超过10-20不同的标签,并且它们彼此都具有不同的重量后计数时。 注:当需要显示具有严格等级结构的类别时不要使用Tagging。 解决办法 标签云是标签的列表，其中每个标签的字体大小是大或更大取决于它的重量级(也就是热度)。在标签云的重量可以用三种不同方式表现: 1.大小反映了该标签已应用于单个项目的次数。 这种标签云可以帮助确定该项目的分布是如何被分类的。 2.大小代表了该标签已被应用的数量。 作为每个受欢迎的标签展示。 3.大小代表了以某种分类方式下，内容项目的数量。 标签是被用来作为内容项目进行分类的方法。 对于如何排序标签有几种专家意见，实例的方式排序标签是: 按字母顺序排列 随机 按重量 在语意上类似的标签组(相似的标签彼此相邻) 标签云帮助可视化语意环境，以及如何使某些类别比其他的拥有更大的重要性。它还有助于在给定的网站上找到内容是它想给公众的一种印象。以及展示哪些类别的内容是网站聚焦的。 综述 收集和共享数字对象 在过去的几年里，我们看到了一类关于收集，组织，分享，和标记数字对象的设计网站,并且它们已经开始泛滥了.这些对象可能是照片，演示文档，视频或其它任何可以代表数字的东西。Flickr（http://flickr.com），是第一个实施受欢迎标签的照片共享网站。让用户共享标签和演示文档。LibraryThing的用户可以在网上给图书加上TAG标签,同时YouTube的用户可以为上传的视频加上TAG标签。在Flickr上的照片标签,可以说是用户附加到照片上简短的文字作品。Flickr的用户通常会在照片上搜索特定标签或与特定标签属于特定用户的照片。Flickr的API可以检索用户和照片，您可以用它来构建特定的网址照片或照片组标记。 提升电子商务的体验 网上商店历来惯用层级式的分类方式来分离商品，但现在一些也开始试验标签的方式。标签在通过搜索和导航改进产品的“易找性”方面很有潜力。Etsy (http://www.etsy.com)，一个典型的工艺品网上商店，而它的核心导航部分竟然是用户提交的关键字组成，这使得网站导航的改变是以该网站用户正在提交商品的类目为基础的。Buzzillions.com（http://www.buzzillions.com）提供产品评论，人们的标签以“专业人士”，“优劣”和“良好”等表示。 Buzzillions.com评论比典型产品评论结构更好，它可以通过tag评论，帮助人们迅速对产品进行评估。因为他们使用标记，审查也相当灵活。例如，可以标记适合您气质的跑鞋，以一种您觉得有意义的方式。 最后，对于电子商务网站,标签是可以用来帮助社区发展的。例如Amazon.com 电子商务客户社区的建立基础在于他们频繁的使用产品上的标签。 同类模式图片展示 标签云只是些基础，更多新颖可视化上的一些扩展和尝试，比如说在标签间建立联系的分层标签;在时间轴上显示趋势等。详细请点这里。 http://alite.aliued.cn/archives/932 平常很少关注交互设计类的BLOG,只是看些交互设计方面的书籍,分析报告和论文.发现其实身边还是有很多有趣的交互设计BLOG为我们的工作和学习带来无限的乐趣. 下面是国外有趣的交互设计BLOG集锦: Pulse Laser Dan Saffer Functioning Form History of The Button Small Surfaces Office UI Blog Design Observer Wisdump Bokardo frogblog Creating Passionate Users Valleywag 希望以上资料能够帮助大家更便捷,更多地获取最新最好的研究材料.在后续的研究中我会把在交互设计BLOG中有趣的发现,以BLOG文章的形式与各位交互设计爱好者分享. http://alite.aliued.cn/archives/930 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明 :http://www.alitedesign.com/ Balloons(气球状提示) 问题摘要 气球状提示（Balloon）是一个小型的弹出窗口，用于通知用户出现非关键性问题或控件处于某种特殊情况。 实例 图1 注: 气球状提示由图标、标题、正文文本组成，且所有这些部分都是可选的。 注: 当用户试图提交操作的时候，任何未处理的问题都必须由其所有者用户界面来处理。 注: 气球状提示通常与文本框或其他使用文本框来改变值的控件一起使用，如组合框、列表视图、树形视图等等。 注: 保持控件之间的一致性.当发现不一致性出现时,气球状提示不再适用. 注: 如果其他类型的控件已经进行了很好的约束，就不再需要气球状提示来给出额外的反馈。 何时使用 注: 该信息描述的是一个问题或者特殊情况。 注: 当正在输入时或所有者控件失去焦点时,该问题或特殊情况能被立即检测到。 注: 这些问题并非很关键。 注: 对于那些特殊情况，本身是合法的，但很可能并不是用户期望的。 注: 该问题或特殊情况能用准确的语言进行描述。 注: 这些信息描述的并非是鼠标当前指向的控件。 注: 这些信息与用户当前的活动相关。在默认情况下，气球会在 10 秒后消失。 ... http://alite.aliued.cn/archives/837 上期回顾:交互设计模式(一)-前言 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明 :http://www.alitedesign.com/ 模式库 在模式库里,我将列出所有电子商务网站需要的模式.以下将罗列出经典常用的模式案例,我也试图让这些模式看起来更有趣味性与实用性。(Yahoo模式库也有对Pattern的一种定义。) 模式归属类别 为了方便调用和维护模式库中的各种模式,首先将模式库中的模式分成三大类:用户需求,应用需求,语境下的设计.在用户需求类别中,有一种类型叫基本交互。这里我将从这个纬度把基本交互中所涉及的模式一一罗列讲解。 Pagination(分页,标记页数) 问题摘要 用户需要查看数据的一个子集,却发现所有数据是显示在一页的,这时候查看变得非常不容易。 实例 何时使用 当一个屏幕不能承载更多的数据时。 感兴趣的项目通常可以在前几页找到。 需要深入探索数据项,而非考虑内容显示在一个滚动区域。 解决办法 综述:打破完整数据,分成更小的项目,顺序显示这些数据和单独序列页。提供分页控制一页一页地浏览。提供链接让用户浏览网页的前一页和后一页的这种行动。此外，提供连结到最开始和结束的资料组 （第一个和最后一个)。如果数据集是可预知数量，就显示一个链接的最后一页。如果数据集是不可预知数量或显示有可能是不同规模的（例如，来自于搜索引擎的结果数据)，请不用担心要显示链接到的最后一页。 项目分页 拆分项目列表成为一个序列的网页。 提供可访问前一页和下一页网页信息的链接。 提供可跳转到浏览第一页和最后一个页面的链接。 提供用户正在浏览的什么类型的对象信息。 提供用户正在浏览一套物体的有关信息.使用形式:"[$ObjectName]s [DisplayedItemRange] of [TotalItems]" 本环节的顺序如下：第一页，上一页，下一页，最后。 使用的图形箭头，以增加链接的目标大小。 显示翻页在不可用情况的管理显示状态。 搜索分页 使信息转化为按相关性分类排序的一系列网页。 提供分页控制来提供访问分页内容。 分页控制 显示导航控件作为一行链接。 本环节的顺序如下： '前一页' ，网页链接， '后一页'。 在标签'前一页'后,显示左箭头。 在标签'下一页'前,显示右箭头。 使用可用鼠标点击的箭头。 网页链接应设置包含最多10个网页链接。如果有少页的结果存在，只显示网页上提供的网页链接。 当网页在1-6页中时,该网页链接应始终从'1 '开始。 当在6 页(7页以后)的任意网页上，该网页链接起始应在当前页面减去5 。例如，当第7页，第一页将是2 （ 7-5= 2 ）和最后一页将11 （仍显示10页)。 第一页的结果不会有显示 '上一页'的标签或箭头。 结果的最后一页不会显示'下一页'的标签或箭头。 当前网页的页码链接不显示超链接。 最后在分页控制区上方加个结果页的标签。 基本原理 项目分页 显示箭头图形有助于区分链接，并提供更大的点击目标。 与搜索分页不同，在任何时候,分页控件都是可见的（即使禁用),当出现无法控制分页时,这可以防止用户分心。 搜索分页 显示箭头图形有助于区分联系，并提供更大的点击目标。 结合上下文背景,增加不可控状态显示箭头价值不大原因有: (1)这些显示箭头,经常显示可打开折叠层。 (2)当第一页的结果已组合成绝大多数的综合浏览量。展示不可用“前一页”控制翻页,这些是没有什么附加价值的。 虽然“第一页”链接很有价值,但也要与呈现在随机访问的链接功能竞争。 “最后”链接是没有什么价值的,因为结果是按相关性排序的,这也是问题，因为结果总数（因此，最后的结果）可能不知道。 同类模式图片展示 http://alite.aliued.cn/archives/750 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明 :http://www.alitedesign.com 这两副图片哪张更能勾起你买东西的欲望呢?相信大多数买家更喜欢看大图,实物图,产品细节图等.如果我们的卖家更能倾听下我们买家的心声.他们的产品会不会更受关注些呢? 阿里巴巴不会做这样一个平台,包括物流在内的一些由于电子商务所发展起来的新兴行业,也许物流并不能完全表现出这种情况.阿里巴巴的卖家需要这样一个平台:可以提供拍摄产品图片装饰服务-模特与实物原创,图片质量高,立意新颖.在更多的消费品行业中这种需求尤其明显,我们的卖家太需要把自己的产品好好装饰一下了.在很多的用户可用性测试中,更多的用户喜欢点产品图片质量高的.他们认为那样的产品更符合他们的期望值. 设想一下,如果更多的卖家把照片的质量都超越第一张图片的水平,还怕我们的买家不去关注卖家产品么?消费的驱动力除了外因更多的是卖家内因主导,找个时间把公司的产品图片好好装饰下吧.让我们的买家更多的了解你的产品,留住他短暂珍贵的记忆. 曾经萌生发起这样的一个项目,但是这也许是阿里巴巴并不擅长的领域.期望第三方市场早日成熟,尽快打通这大市场的氛围.让更多的人有机会可以在电子商务的舞台上尽显光辉. http://alite.aliued.cn/archives/739 很开心能参加《UI Designer》第二期文章撰写,成为专家栏目的签约作者!呵呵希望能在这个新的平台认识更多的UED朋友,和大家一同进步一起交流! 《UI Designer》是由UIRSS.com创办，UIRSS.com、ChinaUI.com、UItimes.com三家UI设计媒体联合主办的UI行业权威电子杂志。这一期伴随视觉同盟（联合主办）和iconfans（联合发行）的加盟，声势更加浩大。 《UI Designer》第二期的正式发行，要感谢各位UI界同行的关怀，要感谢各位设计师、作者的支持，更要感谢所有热爱和喜欢这本杂志的读者朋友们的信赖。因此，从下一期起（预计2010年4月发行），《UI Designer》杂志将会定期发行（发行周期暂定为每半年一次）。 注：下文加粗体是我写的文章. 《UI Designer》第二期主要内容： 独家揭密：OPhone UI诞生背后的故事 走进企业，走近UI 中国移动UI Team 百度用户体验部 群硕软件用户体验部 设计秀场（GUI作品秀） 专家专栏 你准备好了吗，可用性测试，主持人系列 谁为用户买单，电子商务中的交互设计 手持移动设备交互与界面设计精要 手机MP3播放器界面设计（GUI教程） 一个写实风格的ico是如何诞生的（GUI教程） UX界 中国VS国外（作者：刘超，中国移动研究院UI Team负责人） 戒盲目、戒浮躁（作者：张海龙，百度用户体验部高级经理） 设计的价值（作者：朱印，前微软设计主管） UI业的持续健康发展（作者：邹翔，SKYUI创始人） 支持机构： 蓝色理想 UPA中国 newwebpick Arting365 DRC设计资源协作网 动漫交易网 圆点视线 中国插画网 设计·中国 点击动漫网 视觉天下 CGfinal 中国动画网 花果山 水晶石 视觉联盟 创意酷 火神网 设计中国 漫域学园 下载地址： 下载地址1（推荐）： http://www.china-channel.com/ui/UI_Designer_2009.zip（由35互联赞助提供） 下载地址2： http://temp.chinaui.com/UI_Designer_v2.rar（由chinaui提供） 下载地址3： http://www.onvision.com.cn/ui/UI_Designer_2009.zip（由视觉同盟提供） 下载地址4： http://www.uirss.com/downloads/UI_Designer_v2.rar（由UIRSS.com提供） 下载地址5： http://www.iconfans.com/ifdownload/UI_Designer_2009.zip（由IconFans提供） 合作、开辟专栏、团队专访请联系 ... http://alite.aliued.cn/archives/736 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明 :http://www.alitedesign.com 交互设计师通常会遇见这样情景:经过一番冥思苦想与挣扎,终于把PD提交的需求快速的完成了.当然,按照流程就是提交到视觉设计师那了.但在视觉设计过程中,发现有些用户行为和操作路径,在DEMO中并没有涉及到,当然就会被视觉设计师打回返工.这样几经周折才算把问题都想清楚设计完整了. 先不提孰是孰非,如果交互设计师能够充分掌握交互设计原则与交互设计模式会不会把这种情况出现的几率降低到最少呢?答案是肯定的!设计原则可以指导设计师如何设计美好,有效的产品,以及系统与服务,并且如何正直成功地从事设计工作.设计模式可以针对某类特定的设计问题,提供可供效仿的概括性解决方案.但是我们不要把设计原则和设计模式当作尚方宝剑,时刻都要问个为什么在做判断.理论放到实战中只能做参考之用,不要盲目崇拜理论而忘记推陈出新.理论是实践中总结出来的,也有可能被实践中新的理论替代. 交互设计模式概念: 设计模式是一种提取有效的设计方案,将其应用于类似问题的方法.尝试将设计理论形式化,记录最好的实践工作,有助于实现以下目标. *节省新项目的时间和精力. *提高设计方案的质量. *促进设计师与程序员的沟通. *帮助设计师成长. 尽管在设计教育与提高工作效率方面,模式的重要性不言而喻.交互设计的模式发展尤其令人兴奋,因为这些模式代表用户体验与相关活动的优化成果. 其中有很多优秀的交互设计模式学习网站: http://www.welie.com/patterns/index.php http://www.slideshare.net/ http://ui-patterns.com/ http://patterntap.com/ 交互设计模式的历史 交互设计的模式理念源自Christopher Alexander,他撰写过具有巨大影响力的两本著作,即(一种模式语言和永恒的建筑方式).书中首次描述了建筑的设计模式.通过一系列建筑特征的精确定义,Alexander试图提取那些带给居民幸福感的建筑设计的精华. 而交互设计模式和建筑设计模式有一个重要的区别,交互设计模式不仅仅涉及结构和元素组织,还关注响应用户活动的动态行为与变化. 交互设计模式的类型 1.定位模式:应用于概念层面,帮助界定产品对于用户的整体定位. 2.结构模式:解答如何在屏幕上安排信息和功能元素之类的问题. 3.行为模式:指在解决功能或数据元素的具体交互问题. 交互设计模式应用注意 设计模式不是菜谱或者立竿见影的解决之道,Jenifer Tidwell 在其广泛收集交互设计模式的(Designing Interfaces)一书中,曾发出这样的警告:"(模式)不是即拿即用的商品,每一次模式的运用都有所不同."一切设计模式不应该是禁锢了设计师的思想,应该是更好的利用设计模式推陈出新.在不同环境下,设计模式的精确形式在每一个设计方案中都有或多或少的差别.一个概括的风格说明无法代替具体的设计方案. 模式语言 有一些非常完整的模式集合组成了"模式语言".这些模式与可视化语言类似,因为它们涵盖了整个设计中用到的元素的词汇(模式语言更抽象,也更注重行为,而可视化语言讲的是形状,图标,颜色,字体等).这个集合不那么完整,它包含的技术也没有达到传统模式的要求,但它非常简洁,可以管理,并且非常有用. 说了那么多有关交互设计模式的概念,也许你已经初步了解,也许你已经感觉云里雾里呵呵,都没关系.接下来我将以举例子的方式,详细讲解每个模式在WEB设计实战中的应用. 今晚话题就墨迹到此吧,过阵子继续唠叨交互设计模式(二)-XX解析. {未完待续} http://alite.aliued.cn/archives/709 [版权声明]:版权归作者Alite所有，转载时请以超链接形式标明文章原始出处和作者信息及本声明:http://www.alitedesign.com 很早就听说韩国网站的设计师们很会利用空间,来创造更多的信息承载量.最近浏览了几个韩国SHOPPING网站果不其然,就拿小小的广告轮播来说,非常佩服他们的设计功底. Naver shopping 我们可以看到广告区域总体由两部分组成:左边区域是显示的主体区域,使用过程体会到承载了9件产品的显示任务;右边区域承载了3条信息的自动轮播显示任务.如果用户比较关注细节,用户会发现当鼠标滑过左边区域时候,会有绚光出现.当然这不是最精巧的地方,当用户点播右边区域的展开按钮的时候用户将看到以下的展示. 原来的主体广告变换成垂直边栏的缩略图,新的三条主题广告像拉黑板报一样呈现出来.当然此时左边的主题广告也没忘记再加三个轮播.如果用户想切换回原来的模式,只要轻松的点击左边的垂直边栏的缩略图即可.大量的信息承载与主题切换并没有使广告位混乱,反而觉得变换的比较自然. 如果这些也不足以说明韩国网站重视对空间的利用率的话,我们在看下面的例子: 开始状态: 点击广告位上面的TAB后: 关于以上例子的具体交互操作方式可以参考链接:http://www.naver.com/ 如果读者对韩国网站比较感兴趣的话可以积极参与本话题,大家一起头脑风暴! http://alite.aliued.cn/archives/656 [版权声明]:版权归作者Alite所有，转载文章请注明作者与文章出处:http://www.alitedesign.com/ 最近在使用Apple.com/Ebay.com/Amazon.com/shopping.yahoo.com的时候,发现一些用户使用细节的小问题.针对这些问题,我体验了前面四个网站的处理方式,觉得还是有可以借鉴的东西. 针对suggestion的情感化设计细节处理: EBAY.COM 当用户觉得不想使用suggestion,或认为suggestion会给他带来干扰的时候,用户可以选择关闭suggestion.( suggestion有的时候可能会切断用户的心流,对用户的心智模型造成影响) 当用户想重新使用suggestion的时候,仍然可以通过搜索框内右边的按钮还原suggestion功能.此时,当鼠标移到还原按钮上面时候,为避免用户不理解按钮的意义会有一个TIP来显示按钮的作用. YAHOO SHOPPING 在YAHOO SHOPPING橘黄色框内,我也发现了suggestion可自由关闭的功能. 小结:表面上看,貌似这些功能是锦上添花,但是从用户情感化设计上考虑,这些功能也能为用户建立更多的信心,去大胆尝试并频繁使用搜索的新功能. 搜索框内容的一键清空细节处理: APPLE.COM 苹果公司不愧是一家很关注用户体验设计的公司,在他们官网搜索功能的细节处理上,真是可见一斑! 当用户在搜索框输入关键词的同时,会在搜索框的下方出现产品分类的suggestion ,并且在搜索框内部右边(图中橘黄色框内) 出现清空搜索关键词的按钮. 当用户输入关键词出错或对原有已经输入的关键词进行删除, 重新搜索的时候,都要用(backspace键).但如果增加了” 一键清空”功能.只要用鼠标轻轻一点.就解决了反复使用键盘backspace键的烦琐操作.对用户来说这个小小的细节设计,给用户带来了很大的方便. 图中绿色框内的设计十分巧妙,充分体现了苹果公司设计师的特色.用户会发现搜索框附近没有确定的按钮(为了视觉的美观性与平衡性) , 但用户可以使用回车键,或点击绿色框的文字链一样可以达到搜索按钮的作用,这种设计既满足了视觉的平衡,又满足了功能的需要.真是Perfect! http://alite.aliued.cn/archives/590 上期整理http://alite.aliued.cn/archives/545 [版权声明]:版权归作者Alite所有，转载文章请注明作者与文章出处:http://www.alitedesign.com/ 整理嘀咕 前期介绍了三本书给交互设计爱好者,UED朋友的在上期留言中,希望我尽快推出第2部分的整理,今天我把整理的后续内容一起与大家分享.希望这两篇博文能真正帮助UED从业者和爱好者,找到自己需要的书籍.接着推荐. Designing　Interactions 作者: Bill Moggridge 出版社: The MIT Press 出版年: 2007-10-01 简介 Digital Technology has changed the way we interact with everything from the games we play to the tools we use at work. Designers of digital technology products no longer regard their job as designing a physical object—beautiful or utilitarian—but as designing our interactions with ... http://alite.aliued.cn/archives/594 [版权声明]:版权归作者Alite所有，转载文章请注明作者与文章出处:http://www.alitedesign.com/ 整理前言: 什么书籍能帮助交互设计师更好学习交互设计,提升实战能力呢?曾经也读过很多关于交互设计与用户体验的国外书籍,但想针对实战的书籍确实比较少.交互设计是设计学科的一个分支,设计的最高境界为禅意最高境界,通俗点说就是设计的精髓有时候真是只可意会不可言传."对设计的感觉是经过多年经验积累出来."-腾讯视觉晋兄如是说.即使这样,我想前人走过的路,总结的经验,总会给后人予以启示吧.因此我以一种科学的态度,去探索交互设计中的奥秘,总结每次经历过的经典案例,享受读书的乐趣.最后发现其实交互设计还是有很多规律可寻的,下面是我整理的交互设计的专业推荐书籍,希望能帮助更多的设计师认识交互设计,理解交互设计,最后很好的掌握它. Web导航设计又名: Designing Web Navigation 作者: James Kalbach 译者: 李曦琳 简介 · · · · · · 　　 业务目标的实现，依赖于用户能够找到并使用您提供的服务。本书为您讲述创建有效导航系统的基本设计原则、开发技巧和实用建议，并附有大量的真实案例。本书研究深入，援引广泛，是极佳的参考资料和教学指南，适用于初级和中级网页设计师、产品经理和其他非设计职位，以及寻求全新视角的Web开发老手。 作者简介 · · · · · · James Kalbach现就职于领先的法律与新闻资讯提供商LexisNexis，任人因工程师，为其基于Web的搜索应用开发界面。他曾任Razorfish德国公司信息架构总监。他拥有Rutgers University的图书情报学学位和音乐理论及作曲硕士学位。 他是Boxes and Arrows（关于用户体验的著名在线期刊，http://www.boxesandarrows.com）的助理编辑。他还是Information Architecture Institute的顾问委员会委员和European Information Architecture会议(http://www.euroia.org)的筹委会委员。 工作之余，音乐是他的主要消遣。他与妻子Nathalie和小猫Niles住在德国汉堡，是一支当地小型爵士乐队的贝司手。他还是一个精酿啤酒迷，经常会以pivo的网名在著名的在线啤酒社区Ratebeer.com(http://www.ratebeer.com)上发表评分和文章。 笔者推荐理由: 这是本在众多同类WEB导航设计中介绍最全面和详细的书籍,在那里面我了解很多经典的案例,以及很多最新最权威的模式理论.最近对分面浏览十分着迷,研究了很长时间,查询很多资料都没找到它的源头.最后在WEB导航设计中找到了它,原来它是伯克利分校研究员研究出的,其中也给出了很多案例和原型.总体来说,如果你正为WEB导航设计而烦恼,就赶紧翻开它找寻答案吧. Designing Interfaces中文版又名: Designing Interfaces / 操作介面設計模式 译者: 蒋芳 作者: Jenifer Tidwell 副标题: 界面设计精髓 简介 · · · · · · 　　“非常优秀！这绝对是UI设计模式领域最好的书，也是近年来交互设计领域最好的新书之一。本书清楚、简洁、引人入胜，既包括基础知识，又讲述了复杂的概念，既适合初学者，又适合专家和研究人员。本书超越了很多琐碎的‘模式语言’——它们提到的是显而易见的各种细小折衷——而本书讲述了交互设计领域许多真正的两难选择。本书不只是收集了一组模式——事实上，这是一本关于现代视觉和交互设计的完整教程。任何设计师都值得一看。” 　　——Larry Constantine， IDSA，获奖设计师及《Software for User》的作者之一 　　“本书采纳了界面设计领域的智慧和经验，为所有人提供了值得学习的内容。它已经成了我的设计工具集里不可缺少的一部分。现在，当我设计的时候有四个必备元素：我的手写板、Photoshop、Flash以及这本书。它帮助我组织头脑风暴，并为我的工作提供批... (展开全部) ... http://alite.aliued.cn/archives/545 [版权声明]:版权归作者Alite所有，转载文章请注明作者与文章出处:http://www.alitedesign.com/ 交互设计师需要怎样和产品团队合作呢？除了要定义行为和与之有关的其他设计学科的交互之外，我们发现，还必须要定义好交互设计在一个企业中的位置。我们相信，要建立好一个严格的产品开发过程，设计必须要平等地与工程、市场，以及业务管理进行协同工作。这种协同工作需要明确每个方面的责任和权利，企业从设计中获得的收益将会有极大的提升。下面我们介绍的这种责任的划分，平衡了每个方面的权利。可以极大地提高设计的成功率，并保证企业在产品开发的整个周期中给予应有的支持，以及其他更多的好处，我们建议的这种责任和权利的平衡关系如下。 设计团队负责用户对产品的满意度，当前多数企业没有人承担这个责任。为实现这个责任，设计师必须有权利决定产品应具有怎样的外观、感觉和行为。他们也需要获得相关信息，必须通过观察和交谈了解潜在用户的需要，与工程师交流技术的优势和局限性，与销售人员交流市场供求，还要与管理人员通过交流及组织会议认可的产品种类。  工程团队负责产品的实现和制造。为了让设计方案带来现实的好处，工程团队必须要对产品的构建负责。说得具体些，也就是要对实现设计者定义的形式和行为负责，同时要遵守预算按期完成。因此工程师需要一份产品形式和行为的清晰描述，以指导他们创建系统、分配时间，以及成本预算，这个描述必须来源于设计团队。工程团队还必须参与技术约束和机会的讨论，以及参与所提设计方案可行性的讨论。  市场营销团队负责说服顾客购买产品，所以他们必须有权利与顾客进行全面的交流，还要负责参与产品的定义和设计。为了做到这些，该团队的成员也要能够获得相关信息，包括设计师研究的结果，以及他们自己的研究结果（注意：顾客并不等同于使用者）。  管理团队负责产品的利润率，因此他们有权决定其他各组的工作。为了做决定，管理人员必须从其他各组那里获得清晰而确切的信息，包括设计研究和产品定义、市场营销研究和销售计划，以及工程团队对创建产品的时间和成本的估计等。 往往交互设计师最头痛的就是和需求方与PD去争取权利，交互设计师一直在做的事情就是平衡每个方面的责任和权利。当PD找交互设计师要添加不合理需求的时候，交互设计师要学会说：“NO”。成功的互联网产品=优秀的用户体验+分析准确的商业动机，而交互设计师就是这个法则的“加号”，它的作用就是连接各相关方的纽带并且平衡各相关方的利益. http://alite.aliued.cn/archives/527 [版权声明]:版权归作者Alite所有，转载文章请注明作者与文章出处:http://www.alitedesign.com/ 我看"必应" 最近两天总是能看到关于bing的新报道涌现,先是老大发的一篇Bing谷歌雅虎三家搜索性能大比拼的文章.对BING有了个初步的了解,然后是腾讯的西贝同学关注微软Bing的文章.慢慢地我也对微软的"live二代"有了浓厚的兴趣.一开始感觉它的名字很怪,官方给的解释好象是"有求必应"的意思.不过也有些不同的意见,今天同事之间调侃:"名字多难听啊?谁没事找"病"啊?虽然是句玩笑话,也并非空穴来风,大部分评论都直指名字难听.不管外界评论好坏,我想用一种全新的视角,客观的看待微软的新搜索引擎. 背景 微软新搜索Bing上线前，微软已经开始了网上品牌推广攻略。微软专门建设的两个宣传网站已经投入使用。这两个网站分别是“决策引擎” 以及“发现Bing”. “发现Bing”网站主要介绍新搜索的功能特色，设计理念等。微软甚至提供了专门的桌面客户端工具，以帮助了解Bing的最新技术和动态。该网站还有若干个视频，主要是微软的开发人员和品牌专家介绍一些幕后故事，比如为何要选择新设立一个“Bing品牌”等。 在另外一个“决策引擎”网站中，微软试图通过视频等方式传递“决策引擎”的搜索设计理念。微软称，传统的搜索引擎返回海量的搜索结果，需要用户花费大量时间去排除无用信息以及细化搜索。而微软希望通过对这些信息进行分门别类的“组织工作”，为用户决策提供最直接的帮助。 在旅行、本地、购物和医疗信息三个门类的搜索中，微软提高了搜索结果的有效性。Bing首先返回的是经过分类和组织的信息，更接近用户的搜索需求。 中国B2B研究中心作为生意宝下属负责该搜索榜的B2B研究机构在试用体验后发现，在很多方面，Bing确实胜过了雅虎搜索。在搜索展示中，它采用了微软之前收购的Powerset语义搜索的相关技术，在搜索结果页会给出许多相关的搜索建议来优化搜索过程。另外，当鼠标经过某个搜索结果时，Bing会弹出一段文本提示，不需要逐个点击搜索结果就能知道，这是否自己需要的内容，节约了大量的时间。 新功能 1、Bing的搜索结果：与原来不同的是，Bing的搜索结果页面有三栏，而非两栏。中间一栏与原来的搜索结果没什么不同，右边的一栏是广告。 左边的一栏是新增的，它将包含搜索相关和一个搜索历史。左边栏上的一个有意思的功能是分类搜索，它与你的搜索相关。例如搜索一首歌，分类栏里会出现歌词和演唱会门票，而搜索苹果的“iPhone”时，分类搜索栏将显示相关的应用程序，可以直接导航至下载。 2、显示广告:凭借Bing这个搜索引擎，微软很可能重振显示广告的业务。因为Kumo将可以提供更精准的搜索。 3、内容预览：这是Bing的另一项新功能，有了内容预览这个功能，用户就可以不用点击链接直接看到页面，火狐的一个插件也提供类似功能，而Bing会将其进行集成。 交互与体验 首先打开BING的主界面,带背景图的搜索框,背景图片是随机的,有点花哨区别于GOOGLE的简单.给我印象最深的首先是搜索图片的体验:图片预览与滚轮式图片浏览机制. 图片预览:当用户的鼠标移到图片上会看到放大图,伴随有相关文字信息提示. 滚轮式图片浏览机制:用户可以一直上下滚动浏览图片,因为BING没有翻页机制. 最后是视频搜索:用户把鼠标放在视频上会自动播放预览.这个体验到是瞒有意思的.不过更有趣的是BING搜索到的结果,让用户特别意外,比如输入用户体验设计师查询视频竟然出现"AV". 除了以上几点我发现还有一个问题当我输入关键词的时候,下拉框推荐的是我曾经输入过的词汇,并不像百度与GOOGLE那样推荐词汇. 其实,BING的问题还很多,从6月2日正式发布,只是短暂的停留了10几个小时就已经被屏蔽了.有人说是微软整和产品,有人说是被"和谐"了.不管怎么样我希望BING可以把交互与用户体验做的更好,最重要的是结果准确更加贴近用户.在中国这样的大市场里,不去研究用户与当时的国情是很难和GOOGLE与百度抗衡的. http://alite.aliued.cn/archives/504 [版权声明]:版权归作者Alite所有，转载文章请注明作者与文章出处:http://www.alitedesign.com/ 通过修改一些配置选项,并用第三方插件扩展其功能,可以使WordPress更易被发现.要开始的话,请登录WordPress管理员控制面板. 定义更新服务 WordPress第一个要修改的就是扩展发布新内容时ping更新服务商的数量.如Technorati和Google博客搜索等服务,跟踪网络上发布的所有博客内容.WordPress发出一个简短的消息(称为ping)到这些服务上,使他们能够更新到最新的内容.当博客ping各大更新服务商上时,用户马上就可以搜索聚合器,搜索引擎和目录来找到你的站点. 在WordPress博客上建立全面的更新服务商列表: 在管理员控制面版中,转到选项,选择Writing.在页面底部,你会看到标有”Update Services”的大文本框.WordPress网站在文档中提供了很好的更新服务商列表,其中包括 Technorati,FeedBurner,Google和Yahoo!见http://codex.wordpress.org/update_services. 复制整个网址列表,将其添加到更新服务商中,来宣告你在博客上发布了新的内容.在这些网站上保持博客帖子的更新,的确有助于提高网站流量. 重新映射永久链接的网址 网址的结构会影响搜索引擎抓取的效果和页面的关键字密度.WordPress提供了一些很好的选项,以在博客上自动生成非常搜索引擎友好的网址. 利用分类,按主题归档 WordPress允许你按照分类或时间顺序来显示.按主题顺序归档比较可取,因为它将关键字添加到网页上,更符合用户的搜索行为.使用 WordPress主题将默认显示分类列表,当你发帖之后,你可以将它指定到一系列的分类中.大部分WordPress主题将默认显示分类列表,当你发帖之后就会自动更新. 总结帖子,更好的引导流量 在首页为每个帖子创建摘要,可以帮助用户在一个地方看到更多的内容,并分流博客的流量.使用内置WordPress的the_excerpt()模板标签,来创建首页的摘要. 在创建新帖的时候,你可以自己写摘要.在管理员控制面板写帖子的”Write(写)”区,你会在主贴区下面发现有个标为”Optional Excerpt(可选的摘录)”的区域.你可以在这用自己的话总结帖子,它将会显示在首页上.用户打开链接后就将看到全文. 如果你选择不单独写摘录,WordPress会自动截取帖子前55个字作为摘录. 显示最热门帖 Alex King的热门度排名插件(http:alexking.org/projects/wordpress/readme?project=popularity-contest)跟踪你的帖子,归档,分类,还有帖子中返回链接和评论的数量,来决定哪些帖子是最热门的.了解哪些帖子是用户阅读最多的,可以帮你确定将来写什么.继续更具体地写该话题的热门帖. WordPress的缓冲功能,它会和热门度排名冲突.由于缓充的WordPress页面将不会激活插件的跟踪系统,两者不能一起使用. 显示最新帖子 简单地分开显示最新帖子区,能帮助重复访客很容易找到上次访问之后有什么新内容.我们会看到Dave Shea的博客首页(http://mezzoblue.com)如何在网页顶部显示最近6个帖子,在中间显示最新帖的摘录. 简洁的主页结构,将帮助访客大概了解你的内容,以便能够快速地浏览最相关的主题.你也可以使用相同的代码来获取最近的帖子,并将它们显示在搜索结果页面或定制的404页面底部,以帮助用户找到他们正在寻找的,或者其他好处. 用FeedBurner推广和跟踪RSS订阅 使用FeedBurner插件,安装插件之后,转到管理员控制面板,点击选项,然后选择FeedBurner FeedSmith.按照指示来创建FeedBurner feed.FeedSmith可以同时处理主要RSS feed和所有帖子和评论的feed. 鼓励互相交流内容 你了解到了社交书签和新闻系统如Delicious,Magnolia和Digg让用户转告别人,真的能帮你吸引流量.你可以用Peter Harkins创建的称作Sociable的WordPress插件,来鼓励用户将你的网站放入书签或挖一下(见http://push.cx /sociable). Sociable将在每一个帖子下面添加一连串的链接到最热门的社交网站上. 为了了解博客帖子提交到digg或添加书签到Delicious的数量,你可以安装John Lawrence免费的称作Socialist的插件.一旦Socialist安装之后,将在管理员控制面板上创建新的选项卡.从Socialist表中,你可以看到有多少人已经收藏书签或者dig了你的站点. 显示相关帖子 在个人博客页面显示相关帖子,是个很好的方法来增加用户在网站上的滞留时间,并防止旧帖子从档案中消失.虽然有很多好的插件会自动完成任务,但Rob Marsh创建了一个特别好的称作Similar Posts(见http://rmarsh.com/plugins/similar-posts/)的插件. 自动生成XML站点地图 各大搜索引擎包括雅虎,Google和MSN最近已合作开发一个标准XML站点地图格式(http://sitemaps.org), 允许网站管理员交流其结构,使搜索引擎能高效并完整地索引.该网站地图XML可手工或由工具创建,工具可扫描你的网站并为你创建.然后你在服务器的Web 根目录下将该文件保存为sitemap.xml,并让搜索引擎知道在哪里可以找到它.我们将进一步研究这个课题和如何将sitemap.xml文件提交给搜索引擎. 其他便捷的WordPress SEO插件 WordPress有很多SEO插件,每个都尝试一遍的话让人望而却步.大部分SEO插件主要控制标题标签或meta标签,有时两个一起控制. 标记帖子 标签是个用来充当描述博客帖子或网站其他内容的meta数据的关键字.越多与内容相关的描述信息,用户和应用程序就越容易找到它.虽然标签经常连接到其他服务上,如Technorati,可以发现相同标签的相关信息,但是WordPress标签链接到博客内部的相关帖子上. 缓存优化内容传递 如果你的网站得到Dugg,突然成千上万的人访问你的博客,那么隐藏WordPress页面可以帮助确保网站不会崩溃.Ricardo Galli创建了成熟的缓存插件,称作WP-Cache(http://mnm.uib.es/gallir/wp-cache-2/),来处理全部配置. http://alite.aliued.cn/archives/489