您现在的位置:主页 > 网站制作 > 界面设计 >

TeamCola信息结构:互联网产品前期设计方法

来源:建站吧 责任编辑:Jzq8 发表时间:2012-01-09 点击:

当下大大小小层出不穷的互联网产品如同一场令人眼花缭乱的星球大战,普通用户会被死星、联盟战舰和绝地武士们手中的光剑所吸引,而设计师们则会去关注这些庞大或精巧的武器如何被制造出来。

是的,随着以用户为中心的设计(UCD)和用户体验设计(UED)概念的深入人心,互联网产品设计的方法和流程已被重新定义而且大同小异,即便是刚入门的麻瓜也能一本正经地告诉你一个正确的产品设计流程需要经过低保真原型、视觉设计、交互设计、高保真设计……等阶段。

彩程设计用户体验设计流程

彩程设计用户体验设计流程

产品经理不是巫师,拿脑袋当水晶球拍拍,就能精确地规划出每个界面和界面上的控件,而是通过一定的方法和工具,把逻辑思维逐步收缩,并落实纸面。低保真原型通常并非一个设计真正的起点,就好像一个完整而令人激动的星球大战故事还会有它的前传。

TeamCola是我们针对小团队开发的一款团队日志产品,通过让团队内部工作透明从而方便管理、增进信任和提高效率。想通过这款产品,来谈谈我们设计前期所使用的一些工具和方法。

软件设计,以人为本。产品设计前,对产品本身的典型使用人群需要个大致定位,如果不太明确,建议提前进行一些调研、走访并制作一份角色分析表,共同讨论和分析是什么类型的用户,会出于什么动机,在什么场景下,使用到软件的什么功能。关于用户研究,有很多成熟的理论与方法,不在此赘述。

产品的雏形或者说全貌,通常会先出现产品经理的脑海中,如果这个产品经理就是个单干户,那么他马上就可以做设计写代码或者同时搞了,但更多的情况是产品经理是团队的一员,需要跟团队的成员沟通,告诉他们自己想做的是个什么东西。当然,某些既不是普通产品又不是文艺产品经理的产品经理不在讨论之列。

在彩程,产品经理需要通过一张图来向团队成员来阐述这个产品的内在逻辑,用什么方式或软件来绘制不重要。这张图可以是纸面的草图,也可以经过精心的绘制,这样的图,我们称之为信息结构图。

信息结构图讨论稿

Teamcola信息结构早期讨论稿

一个普通用户眼中的TeamCola信息结构

一个普通用户眼中的TeamCola信息结构

一个产品经理眼中的TeamCola信息结构

一个产品经理眼中的TeamCola信息结构

在这个阶段,产品经理着重需要考虑的是系统的核心功能和信息流向。这样一张信息结构图,对于信息逻辑的梳理非常有帮助,也方便向团队其他成员展示和阐述。

接下来,产品经理会开始绘制页面路径图和角色任务图,页面路径图会大致规划产品大概会有哪些页面,相互间的链接关系如何。然后将典型角色的典型任务列出,看看完成这些任务需要经过多少个网页,路径是否过长,是否有走不通的断头路等情况。

页面路径图讨论稿

页面路径图讨论稿

调整后的页面路径图

整理后的页面路径图

角色任务表

典型角色在Teamcola中可能会面临的典型任务

有了这些前期成果,就可以开始正式的低保真原型设计了,在做每个具体页面信息架构的时候,可以根据内容的多寡和重要性进行某些页面的合并或拆分。至于形式,可以是手绘,也可以用Axure之类的软件来完成。一般说来手稿在绘制的时候效率更高,成本更低,摊在桌上很文青,贴在墙上很大师;html的版本则更方便在电脑上展示和远程传输,在展现一些动态的交互细节与不同页面间的跳转关系上更为方便。

发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码:点击我更换图片

今日头条

更多>>

推荐图文

  • TeamCola信息结构:互联网产品前期设计方法
  • 常用交互实例:axure常用交互实例日历控件
  • 探索图标设计的微观世界:从符号学说起
  • 建立完美的同学录之浅谈同学录的完善包装
  • 百度搜索客户端设计分享:全新的视觉和交互体验
  • 网站设计师在设计网站时应该遵循的原则
  • 网页进度条设计:关于讨论loading加载后的一些心得
  • 网页制作小技巧:揪出网页无效链接
  • 美化网页 制作精美圆角表格
Alexa - 客户服务 - 联系方法 - 招聘信息 - 友情链接 - 网站地图 - TAG标签 - RSS订阅
Copyright © 2010-2012 JZQ8.COM. 建站吧|建站去吧 版权所有
冀ICP备09002514号
冀ICP备09002514号 网络报警 企业法人营业执照 中国互联网协会 支付宝付款 网银在线付款