交互设计方法和思考过程小记javascript..docVIP

交互设计方法和思考过程小记 javascript:void(0) 上一篇 | 下一篇 naturalxu 2011-07-01 14:54 浏览(38) 评论(0) 标签: 交互设计 方法 心得体会 .vip_info_block { background:none repeat scroll 0 0 #F5F5F5; border:1px solid #D6D6D6; margin:10px 0; overflow:hidden; padding:10px; } .vip_info_more_link { padding-left:10px; } 【本文系外部转载，原文地址：/interaction-design-methods-and-processes/】 我常被问起：“你是做什么的？”“交互设计师。”“交互设计是做什么的？”我很尴尬的解释一堆：“！@#￥%…….”对方更是疑惑：”那….是不是网页的视觉设计？”………网上搜到一张图，发现不只是我，很多交互设计师都存在困惑。缺乏职业存在感。 交互设计的特色之一——“虚” 交互设计似乎是个很难解释，有点”虚、空、玄“的东西。互联网的快速发展，交互设计少了些可以借鉴的方法。交互设计这个行业似乎只能靠前人经验、自身灵感、悟性体会，江湖中野蛮发展着。简直就是武林中的内功了得。 交互设计的特色之二——纠结，有木有！ JJg在《用户体验要素》中，将交互设计设置在结构层。 一方面，交互设计恰恰处在抽象的战略向具体实现页面的转化过度阶段。从产品开发流程中，交互设计上从产品经理接到需求，分析需求并最终交付网站高保真的原型。要把“抽象”的点子和想法如实贴切用界面语言表现出来。满足公司商业需求。 另一方面，交互设计师的诞生某种程度是为了提升产品可用性。其实就是要满足产品使用者——用户的要求。 说起来简直就是吃饭靠公司，目标是用户的“无间道”。要不断平衡公司“商业”利益（不能丢饭碗），和用户体验利益（专业道德）之间的矛盾。具体来说，就是在交互设计思考的过程中，考虑用户逻辑+公司的特殊需求两部分内容。 能不纠结么….. 交互设计的内容有哪些？ 有人问我交互设计难么？ 我说“不难，你想，用户的操作行为就俩：点击、拖拽。”：） 其实，我理解的交互设计主要分为两块：信息架构和操作细节。交互设计的产出物（交付物）也应当包含这一静一动两块。 下面从交互设计不同阶段的产出物，来谈谈我自己交互设计方法和思考过程： /wp-content/uploads/2011/06/2011-6-9-14-33-22.png/wp-content/uploads/2011/06/2011-6-9-14-33-221.png/wp-content/uploads/2011/06/2011-6-9-14-33-221.png 1.接需求 这个阶段主要是接到产品经理等拿来的需求，比如FRD文档。和产品经理讨论需求，了解重点。 2.需求分析——翻译成界面语言 Think first，Design next.对于接到的需求，第一件要做的事情就是仔细分析和讨论下需求的逻辑、内容和目的，而不是马上风风火火的开工。这个阶段的重点在于梳理用户逻辑+特殊需求，最好能高度概括成几点。 忍不住引用臭鱼博客的一个灰常贴切的案例： /wp-content/uploads/2011/06/图片1.jpg/wp-content/uploads/2011/06/图片1.jpg 一个需求文档。里面描述了页面需要承载的信息。 第一步. 概括信息 ?您选择了回邮方式办卡，概括解释这个办卡方式。 ?接下来您应该 下载申请表 ?一系列注意事项。 第二步. 排序 1. 您选择了回邮方式办卡，概括解释这个办卡方式。 2. 接下来您应该 下载申请表 3. 4. 一系列注意事项。 第三步. 翻译为界面语言 /wp-content/uploads/2011/06/图片2.png/wp-content/uploads/2011/06/图片2.png 对于单一的页面（并非整站，没有操作逻辑）的产品来说，需求分析完，交付物出线框图，后面视觉和开发静态页面足够了。 3.结构框架 实际产品往往复杂很多，在需求分析的时候要对产品结构进行梳理，表达出网站的层级结构。做出类似的站点地图（site maps）。这个除了可以把公司所提供的内容层梳理清晰，为全站导航也奠定基础。 /wp-content/uploads/2010/08/2010-9-1-7-58-22.png/wp-content/uploads/2010/08/2010-9-1-7-58-22.png4.流程图（flow charts）：表达用户或系统对某项任务执行的流程。流程图的