设为首页
收藏本站
最新电影
> 子栏目 业界动态 | 网站优化SEO | 网站策划
您现在的位置: 首页=>运营资讯=>网站策划 订阅本栏目  
互联网产品(网站)设计开发流程
时间: 2009-07-31 09:03:03 阅读次数:2820


每个产品主要经过以下几个阶段

可行性评估
主要执行人员:UI、UE、需求部门、程序部
需沟通人员:销售部
当产品经理确定基本的思路后,会先会跟我们沟通,并说明这个产品的思路、受众及一些自己的想法.接着会拿来一个结构图来和我们探讨实现方面的可行性我们也会准备相关资料与其进行沟通,主要会从数据报告、功能性及可行性三方面下手,在探讨的同时会指出功能或结构上的一些问题,并提出改善方案,这步一定得仔细,UI、UE深入探讨并尽可能考虑到每个实现的细节,待框架打好后,出好的产品很容易.但如果在可行性评估上出现隐患,余下的其它工作也将会遇到诸多问题
我们主要从以下三方面进行评估:
  • 数据报告
    通过99Click、Netratings、Counter三套系统来进行数据收集,并在分析报告中指出相应的问题
  • 功能性
    站在用户角度上,对方案的结构及功能性进行评估,提出并解决操作上的问题
  • 可行性
    每个产品初期都是感性的,但在不能保证每个功能都能按原有思路进行实现,具体还需要和相关技术 人员进行探讨、碰撞后形成最终的产品思路

二 产品原型
主要执行人员:UI、UE、需求部门
需沟通人员:程序部、销售部
在产品原型方面,主要指的是黑白稿或线稿,除了颜色基本采用黑白的形式,最终出的产品原型将会和实际产品没区别这个环节会拟定出产品页面的宽度,广告的形式,导航基本样式,各内容的区域的表现形式等…
当经过可行性评估阶段后,产品经理的思路和自己也基本达成共识,接下来将进行原型设计,我将主要分为三个步骤来实现:
1)  纸稿
按此在新窗口浏览图片
一般情况下结构图都是采用word文档描绘,我选择笔和纸的方式,主要还是比较方便、易修改,有任何突发的思路只需要擦一下,就可以直接在已有的基础上进行调整,由于之前的讨论没有实物参照,在这个环节你一定会发现更多有趣的问题飞飞Asp技术~乐园
2) 线稿、黑白稿
按此在新窗口浏览图片
当纸稿确定后,则由UI或UE使用做绘图工具来描绘黑白稿(我主要使用Photoshop来进行这个步骤,跟据个人习惯不同,大家的方式也有所区别,比如淘宝UED Team及Baidu UE更多的则采用线稿的形式)也许是做UI的原因,我习惯还是采用黑白稿,方便界面设计,在结构上也会精确到像素,比如:导航高度40px.头条采用20px黑体,图片规格:104x85px,页面的各区域的留白为5px…等等,只有这样才会发现更多细节上的问题,当然到界面设计的同时你也会尝到更多的甜头
3) 原型
按此在新窗口浏览图片飞飞Asp技术乐园
完成以上的二个步骤后,产品的基本功能,结构,规范都已经大致成型.这时你可以叫上程序部、销售部及需求部门产品经理,在白板上对着黑白稿做最终的讨论经过二次、三次调整,最终定下完整的产品原型
另外,值得提的一点是,在产品原型未确定前,千万别急着去做界面设计,因为之前的讨论主要会通过白板、Word或纸稿在原型未确定前,有很多潜在的问题表现不是很直白,比如:"窄了、窄了,完了,新闻列表只能放八个字"、"广告放不下了"、"数据提不出来,目前没这个接口…"如果提前进入界面设计的环节,一但有问题,就意味着重新又需要找产品经理、技术部、销售进行再次沟通,这个步骤是很烦琐的,也会让人很郁闷的

三 产品界面设计
主要执行人员:UI、UE、需求部门
需沟通人员:UID、SEO
目前产品的雏形已基至的本成型,虽然还没华丽的外衣,但凹凸有至身型已隐约可见下一步将进入界面设计阶段.设计师们也将再次体会到黑白稿给他带来的各种便利.
1) UI
我的习惯是,主要针对首页进行风格设计,并出3-4套界面,最终挑选出2套左右提交给需求部门,同时也会指出自己最满意一套,和需求部门进行二,三次碰撞后,最终拿出定稿
按此在新窗口浏览图片
2) UE
UE则开始针对原型进行操作上的优化调整,召集用户并组织头脑风暴,收集到相关意见后,由UE整理出交互及用户体验方面改善意见,并反馈给UI及需求部门比如:"这个文字需要加下划线"、"按钮上不要加样式,反而没有点击的欲望了…"
3) UID
UID即开始着手准备制作方面相关文档.并提出实现方面的意见.等待效果图最终确定后,则开始相关代码的编制(CSS+DIV、AJAX、Java)
4) SEO
SEO则根据原型提出搜索引擎优化的意见,为制作阶段代码优化做准备.
这个阶段一定要保证与需求部门沟通到位,当产品界面最终定稿后,建议再组织一次讨论,这次用户面对着是实实在在的产品,所感受会和之前有所不同.对产品效果上来说,这次的讨论也会有不少收获

四 界面设计规范及功能实现
主要执行人员:UI、UE、程序、SEO
需沟通人员:UE、销售
1) 设计规范
考虑到在动态实现方面,光凭效果图很难直接的给予表现,这时需要配合使用说明文档及设计规范规范来做辅助比如按钮及文字链在触发前后的样式,文字间距…如下图:
按此在新窗口浏览图片
2) 代码及程序开发
由UID进行页面的代码开发(CSS+DIV),并需严格参考SEO理出的相关规范,针对一些AJAX的动态效果还需要程序部人员协助完成,当静态HTML完成后即由技术人员进行程序嵌套,并实现预期的功能
这个阶段由UI、UE全程跟踪,保证HTML和设计稿最大限度相似前提下,对已实现的功能进行测试,并出交互设计改善文档,提交给技术人员

五 产品上线
主要执行人员:需求部门
需沟通人员:UI、UE、程序、销售
这个阶段主要是内容的添加,主要由相关频道编辑完成,对于软性广告位这块还需要和销售进行协调完成内容添加后,由需求部门、UI、UE进行核查,在保证和内容、功能完整后,进行整体上线

六 分析报告及优化方案
主要执行人员:UE
需沟通人员:UE、UID、程序、需求部门、 销售
产品上线后,由UE进行数据及意见的收集,在二周后出相关改善文档,协调各部门进行优化的工作




站内搜索    

下一篇电子商务类网站数据分析标准

上一篇写给WEB2.0的站长 不仅仅是泼冷水

本栏目最新 栏目最新列表
飞妮莫属:使用微博推广自己的方法
建材团购行业站的运营心得
SP和PR广告的解释
电子商务类网站数据分析标准
互联网产品(网站)设计开发流程
网站优化策划 栏目最新列表
增加网站外链的快速方法
网站上线前必做的30个检查
新的友情链接参考标准(没有google的PR情况
优化Google的AdSense广告的五个工具
王通讲SEO八大基础
站点最新 站点最新列表
微博推广的一些技巧
xhEditor v1.1.7 发布,
收集的一些轻量级非常实
50个新鲜兼容最新版本的
javascript中cookie的设
Excel中出现#VALUE!、#D
jquery插件:飞飞表情插件
十个使用HTML5开发的精彩
支持HTML5的浏览器有哪些
飞妮莫属:漫画:如何写出
历史最热10条信息  
MIME介绍 及 [1] [2] [3]
巧用Google和迅雷来下载
VIA Rhine II Fast Ethe
Transact SQL 常 [1] [2]
电脑常用端 [1] [2] [3]
十道羊皮卷 欣赏+mp3版+
Do you get a kick out
每日一句:A friend and
每日一句:Theres no tu
网站开发常用手册
 width= 
伟哥博客 西安房产 123最新电影 三四六四