网易婚恋交友网站的设计流程.docx

网易婚恋交友网站的设计流程本文主要介绍网易婚恋交友网站的设计流程佳人有约网易婚恋交友网站，经过精心策划和团队努力合作，终于打造出风格精美、功能强大及人性化体验的交友网站产品。整个项目流程：从时间流来看整个过程：1. 改版计划佳人有约改版目标·明确产品定位，优化设计风格以便提升产品品牌认知度。·优化任务流程、产品架构，使之更符合用户需求。·提高产品易用性，改善用户体验。·优化源代码，使网站执行效率更高。2. 用研和评估工作分为三部分：第一是用户研究，主要针对抽样用户对象进行访问和交谈，并记录他们基本网上交友行为，初步了解需求，得出结论。第二是对自身网站的数据进行统计和分析，挖取潜在用户行为和需求。第三是收集第三方交友方面的用户分析数据，结合第一、二点写出符合自身的用户研究报告。由于这一方面的信息量比较大，就只罗列个大纲。任务1 . 用户研究·在idate筛选代表性用户进行深度访谈《焦点访谈大纲》准备访谈步聚和问话内容《访谈结论》用户座谈会流程用户基本网上交友行为网上交友行为的生活角色化分析交友网站最重要的功能情感解析和设计建议《访谈数据》制饼图对比分析《访谈笔录》记录访谈对话内容·对idate现有后台数据进行挖掘《佳人有约用户概述》定义我们的目标用户《数据资料》Idate网站用户数据·通过二级研究，网络资源搜索及研究，客服数据研究，撰写交友用户研究报告任务2. 自我评估评估方式以打分形式进行，并对每一点做说明。·导航评估（与同行恋爱交友网站竞争对手做对比进行评估）·PET评估 （从说服，情感，信任三方面，观察同行网站对象和自身网站的评估）·交友网站设计评分（和同行恋爱交友网站对比评估）·idate交互设计评估（对注册模块，约会模块，搜索，留言，个人管理评估）·idate页面设计评估（未登录首页，我的首页，搜索约会，约会管理，留言礼物，我的朋友，话题页面，个人展示页面评估）任务3. 专家评估微型专家评估，请外部专业用户体验公司对网站进行一次小型的评估，对idate网站有待改善之处大概罗列出来。3. 角色情景我们直接省略了这块，主要是考虑时间关系，加上目前的工作是改版，基于原来的网站基础上进行工作，所以就省略了这块，也由于省了这块，导致后期会有挺多的概念模型不够清晰和需求不够准确而增加一些讨论的时间。4. 任务流程整理Idate用户对网站所有任务汇总并绘制流程图。这部分的工作的结果，是程序开发功能模块的依据。随着进度和小组工作的进行，随时对任务流程进行修订和与程序沟通。5. 信息架构任务1. 在Idate筛选代表性用户进行焦点小组卡片分类任务2. 对Idate登录用户进行网上改版调查任务3. 绘制产品信息架构图主要是自上而下架设了页面架构和一些功能模块，从横向和纵向进行了分解。对重点导航重新进行定位和移动，挑选出重要的功能模块和淡出次要模块。只有定位好页面结构层次和导航关系，视觉设计师在这个时间才能进行有效的主次关系定位和导航表现形式的设计，甚至关系到整个网站视觉方向的设计等。6. 产品原型具备一套标准的基础交互元件库是很重要的，特别对于几个策划同事分工合作来说，保证了最起码的样式一致性。打包好的元件以组件形式，方便拖放在firework工作区间里移动和摆放，提高网站原型的开发效率。同时也为日后的交互稿管理维护等工作带来方便性。这次的原型开发应用了Axure pro 5.5原型开发工具由于时间关系，原型并没有发挥其重要的作用，只是用它实现一个简陋的带点交互的初始原型而已，可以看下面的注册步骤效果图。个别原因至使应用原型叠代方法并没有在这次改版当中应用到，毕竟开发一个原型接近于真实网站来说，所花时间成本还是比较高的。相信熟悉掌握了这个工具和方法，必对开发高效实用的网站起到很好的作用。这次的改版的交互稿基本上都是策划同事制作的，他们的表现都很不错。策划制作交互稿有其自身的原因和团队发展的考虑：第一：策划最了解自己的产品，对需求比较明确。第二：吸取第一次项目工作的经验，提高交互能力。交互这块所花的时间比重也是相对比较多，但也是应该的，这部分的工作相当于建楼要打好地基一样，减少后期返工修改过多的问题。7. UI视觉设计7.1?找参考视觉设计从立项目就开始着手项目的工作。前期收集相关同行网站视觉OKCUPIDeHarmonyMatch速配日本站慢慢形成自己的一套视觉色和风格：网易佳人有约区别于国内同行恋爱交友网站，以国内单身白领阶层为主要用户的约会网站。清新简洁，安全舒适，秀气大方。7.2?定宽度网站宽屏950像素，最好效果应该是960，可以完美应用栅栏设计，了解更多栅栏设计，请查看：http://960.gs/?详细介绍了栅栏设计的原理和效果，包括栅栏下载。Idate应用了网格的设计来对齐和布局元素等。定义了每一个格子为10px，安CTRL