很久以前看过一本书，讲的是一些设计师如何把已有产品、品牌进行重新设计，既保持原有特色，又焕然一新。工作中似乎充满着“再”设计，无论是网站改版，还是外面产品的复制模仿，或是一些成功产品的跨平台、操作系统的移植…. 尤其，随着移动app的发展和升温，PC端的产品有逐渐向手机端移植的趋势。如何将一款pc端产品成功移植到手机端，必然要对交互操作进行“再”设计。 从pc到iphone的“再”设计 目前来说，需要移植的多为用户量比较大，相对成熟,数据累积丰富的产品。保持原有特色和常用功能让设计师觉得踏实。但麻烦往往也常来源于此： 网站结构层级在pc端往往很深。 但是，移动界面的信息架构往往不适合设计很深的层级。层级深容易让用户迷失，也不好找回主页。 pc端因为有导航和面包屑的辅助，逻辑和轨迹也不难寻找。但是手机屏幕和操作系统限制，多于三级，用户就不再好操作。 在iphone guildline里对于面包屑也提出尽量勿用的提示。 有人说手机交互是让设计师最能发挥的地方。我觉得没错。交互设计师眼中优雅的产品往往都是“小而简单清晰的“和重视用户使用目的流程的。
Archive for the ‘信息架构IA’ Category
和一位视觉设计师讨论UED分工的时候，他说：“交互设计做的就是逻辑。”听起来似乎没错：互联网交互做得最多的就是点击、跳转。无论target到另一个page是_self还是_blank，无论信息架构的sitemap，还是导航，似乎交互做的就是一个纯理性、高逻辑的活儿。 直到有一天向臭鱼请教一个产品的设计时，我才意识到被忽视已久的问题。 这个产品大致需求是这样的： 一个图像上传产品。用户可以设置一张显示，也可以设置一周自动轮换。每个选择会为用户提供推荐图片。 开始我设计的流程大致如此： 除此之外，我还做了低保真的线框草图： 线框草图第一张：一进来让用户选择方式 臭鱼看后，只问了我一句：“你说的这种一步步的设计方案，你觉得这种方式有什么不足吗？” 我听了开始一愣，觉得这简单、清晰的流程，用户不该产生疑惑啊，会有什么问题呢？后来突然领悟：这看似无破绽的流程只是我个人的YY，用户未必照单全收。
信息架构归根究底的是让用户快速找到想要的信息，无论导航、类目，还是搜索都只是用户选择的方式。但面对庞大的内容和纷繁复杂的操作，网站信息究竟如何组织才能让用户顺利完成任务？这就涉及到信息架构（IA）。信息架构听起来似乎是个很复杂的活儿，让人无从下手。这里有种超简便的方法，利用任务角色（persona）帮助我们轻松掌握架构。 这种方法被称作概念模型法，也叫概念地图。个人觉得在初期，头脑风暴焦点小组讨论或者交互初期理解工作流时特别好用。不仅可以用在开会思想交流，还可以辅助梳理逻辑。最大的好处就是可以快速地大致估计网站包含多少页面（这个对早期项目估时很重要~） Getting start开始准备——那些必不可少的要素 1、人物角色 用户体验的常规流程总要涉及到人物角色（persona）。建立人物角色非常重要：谁是你的用户，他们来到你的网站做什么？公司战略上产品要主打哪些用户，整个项目中如何保持团队认同不产生偏差？其实，除此之外它还是信息架构的好帮手。 有了人物角色，除了身份我们要分析他们来网站的不同目的，他们采用什么方式来到网站。比如某B2C电子商务网站，使用者主要包括购买者、买礼物的人、通过EDM(email营销)进来的人和退货者。如图所示： 中间黄色的圆是我们的网站系统。各类用户分布在旁边。
有人说互联网是个虚拟真实的世界，有着和现实密不可分的关系，就像梦境中同样会出现生活中的场景。 互联网不是梦境，但我们需要盗取现实中的元素，让用户容易理解并且轻易上手。有时候你会惊异的发现，互联网几乎所有产品都是现实生活和需求的缩影，除了纯粹虚幻的网游，没有生活元素的网络产品不易存活。 就像《Don’t make me think》描述的我们在现实中购物的一个典型场景：我去买一把链锯。进入商场大门，我会猜：“他们会把链锯放在哪里呢？”进入商场后会不自觉扫描墙上各个种类货品的名字。 那么该选择工具？还是草坪和园艺用品呢？之后我决定朝工具部方向走。到了工具部继续查看指示标志。 当我开始查看具体的产品的时候，发现错了，于是返回到上一级的草坪和园艺用品部重来。 或许，中途我改变主意，选择询问一名工作人员。于是整个购物流程看起来像是下面的样子。
互联网的UED因网络而存在，我们所做的所有“交互”都是要通过google、百度和世界连接起来。白鸦云：“SEO是UED的最大敌人”。但，如果我们的设计不重视SEO，就会在google上淘汰，如果你通过网络营销，当目标顾客在搜索你的产品或服务的时候没有找到你，那获利的可能是你的竞争对手。所以没有意义去争论SEO对UE设计的关系重要性，这几乎是不言而喻的。 SEO（搜索引擎优化）简单来说是为获得和保持在公共搜索上的某些目标关键词的顶级排名，而进行网站设计、开发、维护的过程。它似乎是纯为商业目的而存在，和UE毫不相干的另一个领域。但对于UE来说在设计网站时（尤其是在进行信息架构时），充分考虑到SEO同样可以提升“搜索型”用户的体验。并且，互联网的设计就要符合online的游戏规则。 SEO主要靠三个部分提高来影响排名的： 网站的架构和组织原则——这是用户体验能影响的重要方面。 搜索爬虫能扑捉到的优化关键词。 其他网站指向你的网站的链接数量和质量。 搜索引擎抓取程序有：crawler,spider,bot。光听名字就懂了，他们就像蜘蛛人（spider）一样在互联网中爬来爬去抓取信息。而信息主要靠顺着＜ａ＞链接＜／ａ＞浏览来抓取。 上图中，绿色部分导航处的文字链接和右侧的文字链接都可以被爬虫爬取到；红色部分运营区块由于使用图片形式，搜索引擎是无法扑捉到的。
看到一位产品经理的文章《好的产品经理都是大情圣》也发篇文章分析下UED的使命——其实就像泡妞一样，需要智慧与实力的技术活：） UE童鞋的一项技能就是：信息架构 。好的信息架构是良好用户体验中非常重要的一步。这意味着面对繁杂丰富的信息，设计者需要为用户考虑，以用户的思维逻辑和访问目的对信息做梳理。这样的信息逻辑不仅要符合企业的战略需要，更要符合用户的思维和认知习惯。 那么如何以用户的思维来进行合理的信息架构呢？ 下面就用一个帅哥以用户体验的思维模式搞定一位极品mm的过程来分析，什么才是优质的网站信息架构。看完后你就会发现，生活中人人都是UE，只要是有着同理心的优秀UE都有机会成为大情圣的:)
沃尔玛有这样一则经典营销案例：每到周末啤酒和尿布的销量就异常的好。原因在于周末电视会转播球赛，男人们都会在家看球赛的时候拿上一罐啤酒，受冷落的妻子会出门逛街或和闺蜜小聚，照顾baby的重任就留给留守的丈夫。就这样，沃尔玛就把婴儿尿布放在啤酒销售区旁，男人往往就会在超市买啤酒的时候会顺手拿起尿布。自此以后，不管是尿布还是啤酒的销量增长了一倍。 其实不仅是沃尔玛，很多电子商务网站都意识到交叉销售（ Cross-sell）的重要性： 交叉销售（ Cross-sell）：就是发现一位现有顾客的多种需求，并通过满足其需求而实现销售多种相关的服务或产品的营销方式促成交叉销售的各种策略和方法。 简单来说就是在同一个客户身上发现不同的购买需要，进行推销。 “交叉销售”在电子商务屡见不鲜，Amazon相关图书推荐更是做得有声有色，点击和购买率都相当高。 另如，京东买单反推荐存储卡、三脚架等。 但能把啤酒和尿布看似风牛马不相及的商品放在一起的“交叉销售”还在少数。啤酒、尿布不仅不同维度，而且是似乎毫无相关性的东西。沃尔玛之所以赢得了用户，正是在详细分析用户行为下得出的结论。 下面的一个小案例可以提醒设计师应该通过用户行为和用户对话分析出隐藏在表面的一些潜在需求： 《买杏子》 一个老太太上街准备买一些杏子，她于是到了第一个水果摊， 老太太问摊主：“你这个杏子怎么样？” 摊主说：“我的杏子又大又甜”， 老太太摇摇头走了。 老太太走到了第2个水果摊，问道：“你这个杏子怎么样?” 摊主说：“您想要什么样的？” 老太太回答：“我想要吃酸一点的”。 摊主说：我这的杏子有酸的，您买点吧。 于是老太太买了点杏子，往前走了。…
交互设计师在设计线框图原型的时候，熟悉常见的web设计模式很有帮助，做到“心中有数”才能创造出符合需求，用户熟知操作方式的界面来。所谓“没有必要重复发明轮子”，模式往往容易解决常见问题，正确的模式能帮用户熟悉界面、提高效率。
June 29th, 2010
Ajax之父Jesse James Garrett在adaptive path工作坊上的演讲《用户体验的要素》
2 Comments, 交互设计IXD, 产品开发PM, 信息架构IA, 博客blog, 用户体验UE, 设计流程, by 张雅秋.Ajax之父Jesse James Garrett在adaptive path工作坊上的演讲《用户体验的要素》，绝对经典教材。
June 28th, 2010
Similarities Between Interaction Designers and Agile Programmers by Alan Cooper
No Comments, 交互设计IXD, 产品开发PM, 信息架构IA, 博客blog, 用户体验UE, 随笔diary, by 张雅秋.当交互设计遇到敏捷开发
让大师Alan Cooper告诉我们如何做出更好的交互设计，离不开技术的支持。有效的项目进度管理配合合理默契的迭代设计才有可能创造出伟大的产品。
这个视频是关于2008年Agile programmers年会上，对Alan Cooper的访问。稍后我会把翻译稿放上来。先来看看大师怎么说吧~