用Axure RP做整体原型设计的步骤

信息架构确定了之后，就需要对每一个页面进行元素的排版，排版之前，一般都会先对页面进行一个布局设计的考虑。我们需要对这些内容块进行一定的设计布局，这里的布局结构取决于设计人员对内容编排的把握，不同的布局会产生不同的效果。

 

其实这个应该较早的提出来，因为已经发布过很多关于用Axure RP设计原型实例的文章，不过大部分都是关于单个功能或者交互效果的演示实例，而没有将其串联起来形成一个整体，比如一个网站或者是一个互联网产品。用 Axure RP设计一个实例的步骤和用其设计一个整体产品的步骤还是不一样的，所侧重的点不一样，实例更侧重于功能点或交互效果的表现，整体产品则需要将各个实例串 联起来，形成一个功能或效果集合，达到集中展示。因此整体的产品更侧重于信息架构，布局展示，实例合并，整体效果聚合等方面，本文就结合自己的工作经验， 简单的介绍一下如何用Axure RP设计完整的产品。

　　1、确定信息架构

　　信息架构对于一个整体 产品而言是非常重要的，犹如现在盖房子时的地基和框架结构，整个结构决定了将来的房型样子，及房子是否稳固。而WEB产品的信息架构则决定了产品未来的功 能导航结构，是一个底层框架的作用，因此非常重要，地基不稳，安能盖高楼？那么如何来确定信息架构呢？

　　一般来讲，我们在做需求分析的时 候，都会把几个主要的功能点抓出来，这几个功能点就可以浓缩一下形成产品的初步信息架构。比如要做一个合同管理的功能，要求实现合同信息管理，合同履约管 理，合同统计报表等功能，这里列出来的功能点就可以拿来做信息架构。再比如我们要做一个会员管理的功能，注册和登录是必不可少的功能点，那么就可以将其列 为会员管理下的两个基本信息架构。其实每个网站产品最终确定下来的一级导航栏里面的各个栏目就是一个网站的信息架构了。

　　那么用Axure RP如何来管理信息架构呢？Axure RP提供了一个非常方便操作的站点地图面板（Sitemap）来管理页面结构，结构菜单采用树形菜单，层级分明，结构清晰，还能自动生成框架结构图，非常方便。关于站点地图面板的使用，详情可参见《Axure RP介绍–站点地图面板》里面的介绍。这里简单的以一个企业网站的首页内容为例。

　　

　　2、确定页面布局

　 　信息架构确定了之后，就需要对每一个页面进行元素的排版，排版之前，一般都会先对页面进行一个布局设计的考虑。通常我们做WEB产品设计的时候，都会遵 循一些已有产品总结出来的布局结构，比如三行三列布局，三行两列布局等，再如左导航右内容的形式，左内容右导航的形式等，这些都是大的布局结构，是整体页 面的布局排版。细分到具体页面内容的时候，就需要对每一个内容块的展示位置进行布局，如企业网站首页的一般内容有图片新闻，通知通告，公司新闻，产品介 绍，产品展示等等，我们需要对这些内容块进行一定的设计布局，这里的布局结构取决于设计人员对内容编排的把握，不同的布局会产生不同的效果。如电子商务网 站，对内容块和广告块的布局排版就非常讲究，因为不一样的布局，所带来的用户点击量和转化率是不一样的。这种情况下，即对某一类产品的布局把握不好的时 候，可以参照已有成熟产品的内容布局，因为它们已经有运营数据在支持。

　　在用Axure RP做布局设计的时候，可以用默认组件库里面的占位符组件来设计（关于占位符组件的使用，参照这里），先将需要设计的区块用占位符布局，然后标上文字标示，以此来表示这里将来需要设计放置的内容。这个步骤基本决定了一个页面的布局。

　　

　　3、内容完善

　 　页面布局布的就是内容块，当决定了某块内容的放置位置之后，就可以一块一块的完善设计内容，使其接近于最终产品的展示样式。这个时候就是要用到各个实例 效果的时候了，比如图片新闻，我们可以用幻灯片效果来做，比如产品展示，我们可以用跑马灯效果来做，具体采用什么样的交互效果来实现内容块要求展示的内 容，取决于产品设计人员的把握和用户的需求及用户体验，其中用户体验是比较大的一块，就拿幻灯片效果来说，是否需要设计数字导航键，是否需要自动播放，是 否需要设计缩略图等等，这些都需要仔细考虑之后再做决定，这个可以在设计产品时候多多讨论沟通，多看看别人的设计效果。譬如电子商务网站首页的Flash 图片轮播效果，其实就是幻灯片效果，各个电商网站的设计大同小异，就完全可以借鉴参考。

　　这里用Axure RP来设计的实例介绍，前面讲的比较多了，用到的是Axure RP的核心功能，如组件的组合使用，动态面板的灵活应用等等，需要去发挥设计人员自己的想象力和创造力，现在网络上有的这些效果也都是人想出来的，并不是一开始就有的。

　　

　 　经过这样三个步骤的设计，一个中低保真度的产品页面原型就算完成了，逐步的完成所有页面的设计之后，这个产品的原型设计也就告一段落了。如果要设计高保 真度的原型，可能还需要UI设计人员的介入，提供一套接近最终产品效果的UI效果，然后切换到原型上去。基本上按照这样三个步骤来做原型设计，不会有什么 大的问题，前提是产品的需求已经基本确定，要是连框架都还没有定下来，也就是说第一步都还不能做，那是没有办法开始做原型设计的。