关于界面原型设计

不知道大家都用什么工具做界面原型

1. 白纸、铅笔、橡皮，有时候还需要剪刀。可惜大部分情况下保真度不高而且难以表述页面流程；
2. Word。。。。
3. PPT。。。
4. Flash，同 PPT，更加难以使用。适合制作小屏幕界面原型；
5. HTML，本文就是想讲如何使用 HTML 快速进行 Web 界面原型设计。
6. 使用axure这个工具

以上几个方法基本用过，但都存在很多问题。

如：如果几个人负责做界面原型时，共享问题。。。

不知道大家有没有好的方法。

评论

27 楼 ws1020lx 2011-05-09  

俺们 用 pencil

firefox有插件的

26 楼 godfish 2011-05-09  

界面原型用html画是最有效率的

25 楼 xieyanhua 2011-05-08  

hyj0903 写道

xieyanhua 写道

当然，我这种模式的缺点就是需求阶段投入的开发员和时间相对多点（时间可能会展整个项目周期的30%），应为在需求阶段就需要做demo了，人多人少看就要看项目的具体要求，但同时也有好处，就是，相关的开发员通过做demo已经和客户沟通，更加理解系统的需求，降低了后期因为需求问题导致的风险。

按我以前的项目周期，当然，我们可能做的都是小系统（平局一个项目下来大概几十万这样），比如去年给一家国企做的信息化解决方案，总共差不多一千万，但是有几个子系统组成，每个系统之间又彼此有联系。
一个子系统的实现，大概是6-8个人的规模，在需求阶段，基本上投入了3个人，清一色的项目组里的人，因为是一个整体解决方案，所以样式风格什么的，自然是一样的，所以做demo不是很费时间（第一项目稍微长点，人多点），开发周期大概5-7个月，需求分析阶段大概1.5~2个月的时间，包括demo实现，及一些表字段的取值确认，需求规格说明书。在开发阶段在根据情况再投入人员。

这种方法我们公司也有人做过，但在时间上很难把握，而且，写出来的html代码要有一个统一的标准才行。

做这样的demo，时间确实会花得多点，但从我的经验来说，还是可控的。对于你说的一个统一的标准的问题，一般来说，每个公司都有自己的开发标准，在项目立项确定的时候，就会出标准了，比如css的规范，js的规范，html或jsp的规范，java的规范，文档的规范等等。所以这个不是什么问题。

24 楼 hyj0903 2011-05-08  

xieyanhua 写道

当然，我这种模式的缺点就是需求阶段投入的开发员和时间相对多点（时间可能会展整个项目周期的30%），应为在需求阶段就需要做demo了，人多人少看就要看项目的具体要求，但同时也有好处，就是，相关的开发员通过做demo已经和客户沟通，更加理解系统的需求，降低了后期因为需求问题导致的风险。

按我以前的项目周期，当然，我们可能做的都是小系统（平局一个项目下来大概几十万这样），比如去年给一家国企做的信息化解决方案，总共差不多一千万，但是有几个子系统组成，每个系统之间又彼此有联系。
一个子系统的实现，大概是6-8个人的规模，在需求阶段，基本上投入了3个人，清一色的项目组里的人，因为是一个整体解决方案，所以样式风格什么的，自然是一样的，所以做demo不是很费时间（第一项目稍微长点，人多点），开发周期大概5-7个月，需求分析阶段大概1.5~2个月的时间，包括demo实现，及一些表字段的取值确认，需求规格说明书。在开发阶段在根据情况再投入人员。

这种方法我们公司也有人做过，但在时间上很难把握，而且，写出来的html代码要有一个统一的标准才行。

23 楼 xieyanhua 2011-05-08  

当然，我这种模式的缺点就是需求阶段投入的开发员和时间相对多点（时间可能会展整个项目周期的30%），应为在需求阶段就需要做demo了，人多人少看就要看项目的具体要求，但同时也有好处，就是，相关的开发员通过做demo已经和客户沟通，更加理解系统的需求，降低了后期因为需求问题导致的风险。

按我以前的项目周期，当然，我们可能做的都是小系统（平局一个项目下来大概几十万这样），比如去年给一家国企做的信息化解决方案，总共差不多一千万，但是有几个子系统组成，每个系统之间又彼此有联系。
一个子系统的实现，大概是6-8个人的规模，在需求阶段，基本上投入了3个人，清一色的项目组里的人，因为是一个整体解决方案，所以样式风格什么的，自然是一样的，所以做demo不是很费时间（第一项目稍微长点，人多点），开发周期大概5-7个月，需求分析阶段大概1.5~2个月的时间，包括demo实现，及一些表字段的取值确认，需求规格说明书。在开发阶段在根据情况再投入人员。

22 楼 xieyanhua 2011-05-08  

<div class="quote_title">CaryGao 写道</div>
<div class="quote_div">
<div class="quote_title">xieyanhua 写道</div>
<div class="quote_div">
<div class="quote_title">hyj0903 写道</div>
<div class="quote_div">
<p>知道大家都用什么工具做界面原型</p>
<ol>
<li>白纸、铅笔、橡皮，有时候还需要剪刀。可惜大部分情况下保真度不高而且难以表述页面流程；</li>
<li>Word。。。。</li>
<li>PPT。。。</li>
<li>Flash，同 PPT，更加难以使用。适合制作小屏幕界面原型；</li>
<li>HTML，本文就是想讲如何使用 HTML 快速进行 Web 界面原型设计。</li>
<li><strong>使用axure这个工具</strong></li>
</ol>
<p><strong>以上几个方法基本用过，但都存在很多问题。</strong></p>
<p><strong>如：如果几个人负责做界面原型时，共享问题。。。</strong></p>
<p><strong></strong></p>
<p><strong>不知道大家有没有好的方法。</strong></p>
</div>
<p> </p>
<p>个人观点，而且一直以来，都是用JSP代码，而且是基于后台框架的（根据时间情况），基本上是半成品，作出的原型后基本不需要修改（90%已经跟客户确认过）；</p>
<p>工作几年了，基本都是这样做，开始是公司本来就是这样做的，后面的公司是我建议的，因为我觉得这样效果很好。而且我们的原型时在需求调研阶段并行做的。基本上需求完了，界面原型也完了。</p>
<p> </p>
<p>以前做过的原型的程度有，界面原型，样式、风格，布局，功能基本都与真实产品一样：</p>
<p>          1、存JSP/HTML+CSS+JS，</p>
<p>          2、JSP/HTML+CSS+JS + 后台java代码（如Struts），只是简单的页面跳转，没有任何逻辑处理</p>
<p> </p>
<p>解释我为什么建议这么做的原因：</p>
<p>    1、在做界面原型时间，基本上90%都不需要修改，开发结算直接重用，而其他方式实现，比如PPT，word，gui designer等工具，时间比较快，但是基本交互完后，100%无法供后续开发使用，即重用率为0；</p>
<p> </p>
<p>    2、跟客户沟通的时候，容易沟通，因为具有交互性，所有客户配合很好，大家也很容易了解彼此想要的东西；而其他工具做的原型，都不具备交互性，或者交互性非常非常的少，会导致客户不配合；我就遇到过这样的情况；让客户确认需求，让客户看原型，客户根本不鸟我们，你发给他，他都不看，然后几天后你问他有什么问题，人家说没有看~~~~~~</p>
<p> </p>
<p>   3、把风险往前提，在需求阶段通过原型，客户配合好了，需求就更好做了，分先也少点了，而且设计阶段的工作提到了需求阶段，将界面设计不符合客户要求的时候，而且也能极少发现我们做的是不是客户想要的。因为如果到设计阶段再去考虑界面，而且一般都是在开发到一定阶段或测试的时候，客户才会介入，此时发现设计不符合客户要求的时候，那就要修改，风险就更大了，因为往往到编码阶段，是最紧张的时候，而且时间的问题更加明显。</p>
<p> </p>
<p>4、界面原型好了后，因为90%的功能界面客户都已经确认了，所以后期大范围修改界面原型的情况几乎是不可能的，除非需求有很大的变动；而且我做的界面的基本交互已经模拟出来了，比如按某个按钮会怎么处理，有些都会模拟出来，实在不容易实现或时间太急就暂时不实现，跟客户沟通的时候会跟他解释；所以到编码阶段，开发员基本不用管太多的界面处理，基本上只专注于自己的后台逻辑实现，页面就往里套数据就ok了，开发也很happy；</p>
<p> </p>
<p> </p>
<p>所以我工作几年的经验，如果我能做主，我都是要求这样去做，或者建议团队或公司这样去做，效果非常好。当时推这个模式的时候，也受到一些阻力，比如当时的技术经理就反对过，说很多公司需求都不是开发员做（他们大公司，需求，开发，设计都是不同的人做的），有专门的人去做，而且界面原型和部分表字段确认是设计阶段的工作；PM也质问过我（将我以前项目的demo给他看），你们做这个原型花了很多时间、有很多资源去开发等等，我就跟他说了，我时间花的也不是很多，就是在需求阶段完成的。最后还是还是采纳了我的建议。而且从实际效果来看，确实也很好，在没有采用我的建议前的项目，客户配合，需求分析阶段成果的效果，都不是很理想，采用我的建议后，效果又了很大的改善，之后所有的项目都是用这种模式。</p>
<p> </p>
<p>我的观点是，软件开发，有的是必须按软件工程的流程去走的，但是也不是所有的流程都必须去遵守，比如前面说的，界面原型时设计的工作，我们就把他提前到需求阶段做了，而且有部分数据结构，数据库或字段的某些约束（比如用户类型字段，可以取哪些值，每个值代表什么）都已经确认了（有些无法确认的，只能到设计阶段实现）。根据实际情况处理就好了。规定是死的，人是活的，我是比较反对按部就班的执行软件工程流程规定执行的。呵呵~~~</p>
<p> </p>
<p>当然，每个公司或团队的情况不一样。仅供参考。</p>
</div>
<p>直接用JSP好是好,我们之前用过ZK,也是需要部署在中间件里德原型.这样后期开发确实不需要在视图层做更多的东西.但是这种原型也就定性要程序员来做了,那么前端工程师或者美工的优势如何发挥?你不能让他们也学习JSP,因为一个美工做出的HTML可以对应PHP,ASP,JSP这样才能达到低耦合.我个人认为还是要分工,虽然不要用GUI这些东西设计,但使用DW或者Axure这类工具设计出来HTML页面还是有很高的重用率的.而且这样更能发挥每个人的优势.</p>
</div>
<p><br>这个确实，所以我后面说了，每个公司或者团队的情况是不一样。</p>
<p><br>我们公司一般都是做MIS系统的，而且我相信，一般大多数软件开发公司，都会有自己的一套解决方案，比如框架什么的，包括页面布局（除了做对外的门户网站，可能比较麻烦）等，基本上都是现成的，可能修改也不会大改，最多是一些图片，或样式风格CSS的变更。所以我认为这个不是很重要的问题，而且我们的美工也是全程支持。如果是一个全新的系统，项目确定后，在前期的调研和前期需求分析阶段，我们的美工就会介入，去设计界面风格，将设计的效果图（PS）给客户确认，基本确认后，美工就会将效果图转换为标准的HTML+CSS+JS，也就是静态的页面文件，一般情况，如果是MIS系统，基本上我们在进入需求分析阶段的1/4或1/3左右，美工基本上就把静态文件切完了，也就是说，这个时候，开发员就可以做DEMO了；如果是做网站类的，那时间久小队比较久，但是我们不会等美工全部把静态页面做出来，我们才开始做demo，而是他切多少，我们就开发多少。所以，基本上没有问题。</p>
<p>关于美工和开发员得工作，美工做的只是做效果图，将效果图转换为静态HTML文件，包括样式，布局等，所以，美工只要提供了一个页面的布局风格，即提供了相关的HTML，CSS和JS文件（这些文件都是标准，与具体实现的语言无关，比如你用PHP也可以，JSP也可以，ASP也可以），就ok了，剩下的就是开发员得事了，其他相关的类似的页面，也是开发员去搞定。当然有可能需要美工支持。美工只是负责样式风格，所以他出的静态页面文件的内容，是不能用，比如什么abc的；而开发员需要做的，就是按照美工提供的样式风格，将需求的内如写到页面上(jsp或HTML)。这样demo的效果就和系统需求结合起来了。</p>
<p>这也不存在分工的问题，分工也是很明确的，需求分析阶段，美工负责设计，需求人员（我们公司一般都是开发员，一般会有两到三人，项目组长、高程等）负责高需求，边整理，边确认，边写demo，边修改。当然每个公司职位划分不一样，大公司，职责分工比价清晰，做美工就负责设计效果图，前端工程师负责将效果转为html静态文件，开发工程师负责开发，需求人员负责搞需求。但是我想很多公司达不到这样的配置。一般来说，做BS系统，开发元或多或少都要懂一些基本的html、js和css，所以不是什么都必须要求美工去做的。</p>
<p>说说我们公司的人员分工（公司不大，没有办法划分很细）：</p>
<p>       美工：要求会设计，这是基本，而且我们的美工，HTML，CSS和JS都很熟悉，包括浏览器的兼容性问题，其实这样的要求很不算很过分，现在很的每个或设计师，对HTML、CSS和js都是熟悉的（当然，平面设计和3D设计的美工外），所以切效果图也没有问题，就算是分工明确的的，也可以多招一个前端工程师，专门搞CSS或JS；<br>        开发员：做BS系统，基本的CSS，JS肯定要懂，但不一定要求精通，想前端开发员那样数量掌握CSS和JS，但是也有不少的开发员，实际对JS和CSS也是非常熟悉的，可以当个前端工程师使用。<br>        其他角色就没的说了，肯定要有的，但是肯定不是每个角色配一个人，肯定是兼任的。</p>
<p>分工还是比较明确的，美工负责出效果图和基本HTML、CSS、JS文件，开发员负责将基本HTML、CSS、JS整合到系统上，并整合到相应的开发语言里，同时按需求要求实现界面的功能布局，包括一些必要的交互效果。如果遇到美工、布局样式等问题无法解决，交由美工处理。</p>
<p>--------------------<br>对于用工具生成的HTML设计文件件，比如提到的DW或者Axure工具，当然，我从来没有使用过，这些工具，不知道生成的效果怎么样，复用率有多高。但是我觉得，工具生成的HTML，CSS或JS，我相信绝大多数都和很难理解的，很难维护的，比如什么都在一个页面里，或者没有注释，或者很多可以重复利用的而没有重用，又重新定义。那样用的话，到开发的时候，或者维护的时候，也是很郁闷的。没用过这些工具，可能我的理解有错误。</p>
<p>而我们美工做出来的HTML，CSS和js都是很清晰简洁的，页面很干净，我们开发员使用、后期维护的时候也很方便。当然这要看美工或前端开发员的功底了。比如我们的一个很复杂的页面布局，在我们的jsp代码里(这个页面布局算是比较复杂的):<br>

<br>&lt;body&gt;<br>  &lt;div class="ui-layout-north"&gt;<br>    &lt;div class="divTop"&gt;<br>      &lt;div class="topl"&gt;<br> &lt;h1&gt;Web UI FrameWork&lt;/h1&gt;<br>       &lt;/div&gt;<br>       &lt;div class="topr"&gt;<br> &lt;p&gt;<br>    &lt;a id="modify" href="#" class="mfsy"&gt;modify pwd&lt;/a&gt;&amp;nbsp;<br>    &lt;a id="logout" href="#" class="aqtc"&gt;login out&lt;/a&gt;<br> &lt;/p&gt;<br> &lt;p&gt;<br>    &lt;span&gt;employer&lt;/span&gt;jack<br>     &lt;span&gt;dept.&lt;/span&gt;R&amp;D dept.<br>     &lt;span&gt;Role&lt;/span&gt;admin<br> &lt;/p&gt;<br>       &lt;/div&gt;<br>     &lt;/div&gt;<br>    &lt;/div&gt;<br>    &lt;div class="ui-layout-center"&gt;<br>       &lt;div class="inner-north"&gt;<br>       &lt;div id="toolbar"&gt;&lt;/div&gt;<br>    &lt;/div&gt;<br>    &lt;div class="inner-west"&gt;<br>      &lt;div class="divLeft"&gt;<br> &lt;div class="lefttop"&gt;<br>   &lt;div class="lbt"&gt;&lt;h2&gt;menu&lt;/h2&gt;&lt;/div&gt;<br> &lt;/div&gt;<br> &lt;div id="menu"&gt;&lt;/div&gt;<br>       &lt;/div&gt;<br>      &lt;/div&gt;<br>      &lt;div class="inner-center"&gt;<br> &lt;div class="divRight"&gt;&lt;/div&gt;<br>      &lt;/div&gt;<br>     &lt;/div&gt;<br>    &lt;div id="dialog"&gt;&lt;/div&gt;<br> &lt;/body&gt;<br>

</p>

21 楼 xieyanhua 2011-05-08  

为什么用BBcode编辑器有问题？？？

20 楼 CaryGao 2011-05-08  

<div class="quote_title">xieyanhua 写道</div>
<div class="quote_div">
<div class="quote_title">hyj0903 写道</div>
<div class="quote_div">
<p>知道大家都用什么工具做界面原型</p>
<ol>
<li>白纸、铅笔、橡皮，有时候还需要剪刀。可惜大部分情况下保真度不高而且难以表述页面流程；</li>
<li>Word。。。。</li>
<li>PPT。。。</li>
<li>Flash，同 PPT，更加难以使用。适合制作小屏幕界面原型；</li>
<li>HTML，本文就是想讲如何使用 HTML 快速进行 Web 界面原型设计。</li>
<li><strong>使用axure这个工具</strong></li>
</ol>
<p><strong>以上几个方法基本用过，但都存在很多问题。</strong></p>
<p><strong>如：如果几个人负责做界面原型时，共享问题。。。</strong></p>
<p><strong></strong></p>
<p><strong>不知道大家有没有好的方法。</strong></p>
</div>
<p> </p>
<p>个人观点，而且一直以来，都是用JSP代码，而且是基于后台框架的（根据时间情况），基本上是半成品，作出的原型后基本不需要修改（90%已经跟客户确认过）；</p>
<p>工作几年了，基本都是这样做，开始是公司本来就是这样做的，后面的公司是我建议的，因为我觉得这样效果很好。而且我们的原型时在需求调研阶段并行做的。基本上需求完了，界面原型也完了。</p>
<p> </p>
<p>以前做过的原型的程度有，界面原型，样式、风格，布局，功能基本都与真实产品一样：</p>
<p>          1、存JSP/HTML+CSS+JS，</p>
<p>          2、JSP/HTML+CSS+JS + 后台java代码（如Struts），只是简单的页面跳转，没有任何逻辑处理</p>
<p> </p>
<p>解释我为什么建议这么做的原因：</p>
<p>    1、在做界面原型时间，基本上90%都不需要修改，开发结算直接重用，而其他方式实现，比如PPT，word，gui designer等工具，时间比较快，但是基本交互完后，100%无法供后续开发使用，即重用率为0；</p>
<p> </p>
<p>    2、跟客户沟通的时候，容易沟通，因为具有交互性，所有客户配合很好，大家也很容易了解彼此想要的东西；而其他工具做的原型，都不具备交互性，或者交互性非常非常的少，会导致客户不配合；我就遇到过这样的情况；让客户确认需求，让客户看原型，客户根本不鸟我们，你发给他，他都不看，然后几天后你问他有什么问题，人家说没有看~~~~~~</p>
<p> </p>
<p>   3、把风险往前提，在需求阶段通过原型，客户配合好了，需求就更好做了，分先也少点了，而且设计阶段的工作提到了需求阶段，将界面设计不符合客户要求的时候，而且也能极少发现我们做的是不是客户想要的。因为如果到设计阶段再去考虑界面，而且一般都是在开发到一定阶段或测试的时候，客户才会介入，此时发现设计不符合客户要求的时候，那就要修改，风险就更大了，因为往往到编码阶段，是最紧张的时候，而且时间的问题更加明显。</p>
<p> </p>
<p>4、界面原型好了后，因为90%的功能界面客户都已经确认了，所以后期大范围修改界面原型的情况几乎是不可能的，除非需求有很大的变动；而且我做的界面的基本交互已经模拟出来了，比如按某个按钮会怎么处理，有些都会模拟出来，实在不容易实现或时间太急就暂时不实现，跟客户沟通的时候会跟他解释；所以到编码阶段，开发员基本不用管太多的界面处理，基本上只专注于自己的后台逻辑实现，页面就往里套数据就ok了，开发也很happy；</p>
<p> </p>
<p> </p>
<p>所以我工作几年的经验，如果我能做主，我都是要求这样去做，或者建议团队或公司这样去做，效果非常好。当时推这个模式的时候，也受到一些阻力，比如当时的技术经理就反对过，说很多公司需求都不是开发员做（他们大公司，需求，开发，设计都是不同的人做的），有专门的人去做，而且界面原型和部分表字段确认是设计阶段的工作；PM也质问过我（将我以前项目的demo给他看），你们做这个原型花了很多时间、有很多资源去开发等等，我就跟他说了，我时间花的也不是很多，就是在需求阶段完成的。最后还是还是采纳了我的建议。而且从实际效果来看，确实也很好，在没有采用我的建议前的项目，客户配合，需求分析阶段成果的效果，都不是很理想，采用我的建议后，效果又了很大的改善，之后所有的项目都是用这种模式。</p>
<p> </p>
<p>我的观点是，软件开发，有的是必须按软件工程的流程去走的，但是也不是所有的流程都必须去遵守，比如前面说的，界面原型时设计的工作，我们就把他提前到需求阶段做了，而且有部分数据结构，数据库或字段的某些约束（比如用户类型字段，可以取哪些值，每个值代表什么）都已经确认了（有些无法确认的，只能到设计阶段实现）。根据实际情况处理就好了。规定是死的，人是活的，我是比较反对按部就班的执行软件工程流程规定执行的。呵呵~~~</p>
<p> </p>
<p>当然，每个公司或团队的情况不一样。仅供参考。</p>
</div>
<p>直接用JSP好是好,我们之前用过ZK,也是需要部署在中间件里德原型.这样后期开发确实不需要在视图层做更多的东西.但是这种原型也就定性要程序员来做了,那么前端工程师或者美工的优势如何发挥?你不能让他们也学习JSP,因为一个美工做出的HTML可以对应PHP,ASP,JSP这样才能达到低耦合.我个人认为还是要分工,虽然不要用GUI这些东西设计,但使用DW或者Axure这类工具设计出来HTML页面还是有很高的重用率的.而且这样更能发挥每个人的优势.</p>

19 楼 xieyanhua 2011-05-06  

<div class="quote_title">hyj0903 写道</div>
<div class="quote_div">
<p>知道大家都用什么工具做界面原型</p>
<ol>
<li>白纸、铅笔、橡皮，有时候还需要剪刀。可惜大部分情况下保真度不高而且难以表述页面流程；</li>
<li>Word。。。。</li>
<li>PPT。。。</li>
<li>Flash，同 PPT，更加难以使用。适合制作小屏幕界面原型；</li>
<li>HTML，本文就是想讲如何使用 HTML 快速进行 Web 界面原型设计。</li>
<li><strong>使用axure这个工具</strong></li>
</ol>
<p><strong>以上几个方法基本用过，但都存在很多问题。</strong></p>
<p><strong>如：如果几个人负责做界面原型时，共享问题。。。</strong></p>
<p><strong></strong></p>
<p><strong>不知道大家有没有好的方法。</strong></p>
</div>
<p> </p>
<p>个人观点，而且一直以来，都是用JSP代码，而且是基于后台框架的（根据时间情况），基本上是半成品，作出的原型后基本不需要修改（90%已经跟客户确认过）；</p>
<p>工作几年了，基本都是这样做，开始是公司本来就是这样做的，后面的公司是我建议的，因为我觉得这样效果很好。而且我们的原型时在需求调研阶段并行做的。基本上需求完了，界面原型也完了。</p>
<p> </p>
<p>以前做过的原型的程度有，界面原型，样式、风格，布局，功能基本都与真实产品一样：</p>
<p>          1、存JSP/HTML+CSS+JS，</p>
<p>          2、JSP/HTML+CSS+JS + 后台java代码（如Struts），只是简单的页面跳转，没有任何逻辑处理</p>
<p> </p>
<p>解释我为什么建议这么做的原因：</p>
<p>    1、在做界面原型时间，基本上90%都不需要修改，开发结算直接重用，而其他方式实现，比如PPT，word，gui designer等工具，时间比较快，但是基本交互完后，100%无法供后续开发使用，即重用率为0；</p>
<p> </p>
<p>    2、跟客户沟通的时候，容易沟通，因为具有交互性，所有客户配合很好，大家也很容易了解彼此想要的东西；而其他工具做的原型，都不具备交互性，或者交互性非常非常的少，会导致客户不配合；我就遇到过这样的情况；让客户确认需求，让客户看原型，客户根本不鸟我们，你发给他，他都不看，然后几天后你问他有什么问题，人家说没有看~~~~~~</p>
<p> </p>
<p>   3、把风险往前提，在需求阶段通过原型，客户配合好了，需求就更好做了，分先也少点了，而且设计阶段的工作提到了需求阶段，将界面设计不符合客户要求的时候，而且也能极少发现我们做的是不是客户想要的。因为如果到设计阶段再去考虑界面，而且一般都是在开发到一定阶段或测试的时候，客户才会介入，此时发现设计不符合客户要求的时候，那就要修改，风险就更大了，因为往往到编码阶段，是最紧张的时候，而且时间的问题更加明显。</p>
<p> </p>
<p>4、界面原型好了后，因为90%的功能界面客户都已经确认了，所以后期大范围修改界面原型的情况几乎是不可能的，除非需求有很大的变动；而且我做的界面的基本交互已经模拟出来了，比如按某个按钮会怎么处理，有些都会模拟出来，实在不容易实现或时间太急就暂时不实现，跟客户沟通的时候会跟他解释；所以到编码阶段，开发员基本不用管太多的界面处理，基本上只专注于自己的后台逻辑实现，页面就往里套数据就ok了，开发也很happy；</p>
<p> </p>
<p> </p>
<p>所以我工作几年的经验，如果我能做主，我都是要求这样去做，或者建议团队或公司这样去做，效果非常好。当时推这个模式的时候，也受到一些阻力，比如当时的技术经理就反对过，说很多公司需求都不是开发员做（他们大公司，需求，开发，设计都是不同的人做的），有专门的人去做，而且界面原型和部分表字段确认是设计阶段的工作；PM也质问过我（将我以前项目的demo给他看），你们做这个原型花了很多时间、有很多资源去开发等等，我就跟他说了，我时间花的也不是很多，就是在需求阶段完成的。最后还是还是采纳了我的建议。而且从实际效果来看，确实也很好，在没有采用我的建议前的项目，客户配合，需求分析阶段成果的效果，都不是很理想，采用我的建议后，效果又了很大的改善，之后所有的项目都是用这种模式。</p>
<p> </p>
<p>我的观点是，软件开发，有的是必须按软件工程的流程去走的，但是也不是所有的流程都必须去遵守，比如前面说的，界面原型时设计的工作，我们就把他提前到需求阶段做了，而且有部分数据结构，数据库或字段的某些约束（比如用户类型字段，可以取哪些值，每个值代表什么）都已经确认了（有些无法确认的，只能到设计阶段实现）。根据实际情况处理就好了。规定是死的，人是活的，我是比较反对按部就班的执行软件工程流程规定执行的。呵呵~~~</p>
<p> </p>
<p>当然，每个公司或团队的情况不一样。仅供参考。</p>

18 楼 captmjc 2011-05-06  

抛出异常的爱 写道

dolwenjian 写道

DW... 一般原型都是边做边补充的吧。。很少一次完全要你做完的
最早拿出去演示，就弄几个主要模块的就行了。

ＨＴＭＬ原型一般是用ＤＷ作的．．．．．

我们做的一般都是公司内部信息系统，Excel模拟一下几个表单、报表的样子就可以了

17 楼 hyj0903 2011-05-06  

做了几个星期的界面原型了，都是用axure做的，感觉用起来很爽，如果发点心思，就可以做出像ps做出来的效果，可是这个东东是一个收费软件！

16 楼 snowing11812 2011-05-06  

mamba 写道

推荐 balsamiq mockups

恩  也用这个 :-)  +1

15 楼 damoqiongqiu 2011-05-06  

我用一个简单的Balsamiq Mockups

14 楼 抛出异常的爱 2011-05-06  

dolwenjian 写道

DW... 一般原型都是边做边补充的吧。。很少一次完全要你做完的
最早拿出去演示，就弄几个主要模块的就行了。

ＨＴＭＬ原型一般是用ＤＷ作的．．．．．

13 楼 dolwenjian 2011-05-06  

DW... 一般原型都是边做边补充的吧。。很少一次完全要你做完的
最早拿出去演示，就弄几个主要模块的就行了。

12 楼 mamba 2011-05-05  

推荐 balsamiq mockups

11 楼 抛出异常的爱 2011-05-05  

<div class="quote_title">clue 写道</div>
<div class="quote_div">
<div class="quote_title">hyj0903 写道</div>
<div class="quote_div">
<p>不知道大家都用什么工具做界面原型</p>
<ol>
<li>白纸、铅笔、橡皮，有时候还需要剪刀。可惜大部分情况下保真度不高而且难以表述页面流程；</li>
<li>Word。。。。</li>
<li>PPT。。。</li>
<li>Flash，同 PPT，更加难以使用。适合制作小屏幕界面原型；</li>
<li>HTML，本文就是想讲如何使用 HTML 快速进行 Web 界面原型设计。</li>
<li><strong>使用axure这个工具</strong></li>
</ol>
<p><strong>以上几个方法基本用过，但都存在很多问题。</strong></p>
<p><strong>如：如果几个人负责做界面原型时，共享问题。。。</strong></p>
<p><strong></strong></p>
<p><strong>不知道大家有没有好的方法。</strong></p>
</div>
<p>为什么我觉得很像是软文？突然出现一个没见过的工具，粗体加亮，还作为一个大类单独列出来</p>
<p>估计有不少人会去google一下的吧？</p>
<p>-------</p>
<p>也许俺心理太黑暗，并且孤陋寡闻了 <img src="/images/smiles/icon_evil.gif" alt=""></p>
</div>
<p> </p>
<p>差不多都用过．．．．</p>
<p>不用太阴暗</p>
<p>axure的确是主流原型软件</p>
<p>不过是用好太困难了．．．．．</p>

10 楼 lifeier 2011-05-05  

<div class="quote_title">clue 写道</div>
<div class="quote_div">
<div class="quote_title">HATS 写道</div>
<div class="quote_div">
<p>好多公司都在用这个工具呀。</p>
</div>
<p>那可能我太敏感了，如今网上各式的枪文防不胜防啊。。。</p>
<p> </p>
<p>对LZ要说声抱歉了</p>
<p> </p>
<p>P.S. 这个工具有这种垄断地位么？即除其它客串的图形排版工具外，它是专业原型设计中使用最广泛的？</p>
</div>
<p><br>最广泛说不上，但是有很多人用就是了。</p>

9 楼 clue 2011-05-05  

<div class="quote_title">HATS 写道</div>
<div class="quote_div">
<p>好多公司都在用这个工具呀。</p>
</div>
<p>那可能我太敏感了，如今网上各式的枪文防不胜防啊。。。</p>
<p> </p>
<p>对LZ要说声抱歉了</p>
<p> </p>
<p>P.S. 这个工具有这种垄断地位么？即除其它客串的图形排版工具外，它是专业原型设计中使用最广泛的？</p>

8 楼 ourdsky 2011-05-05  

<div class="quote_title">HATS 写道</div>
<div class="quote_div">
<div class="quote_title">clue 写道</div>
<div class="quote_div">
<div class="quote_title"><span style="font-weight: normal;">为什么我觉得很像是软文？突然出现一个没见过的工具，粗体加亮，还作为一个大类单独列出来</span></div>
<p>估计有不少人会去google一下的吧？</p>
<p>-------</p>
<p>也许俺心理太黑暗，并且孤陋寡闻了 <img src="/images/smiles/icon_evil.gif" alt=""></p>
</div>
<p> </p>
<p>好多公司都在用这个工具呀。</p>
</div>
<p>确实，我也用过几次，感觉很不错，和DW差不多</p>