Axure视频教程2：制作第一个原型

 

 

 

一、认识Axure

图 2-1

如果暂时看不懂没有关系，只要有个大概的印象即可，以后的教程中我们会频繁操作这些区域，到时候自然就会了。

1、站点地图

        可以看作整个项目的导航区域，你项目中的所有页面都可以在这找到，双击某个页面，就可以对其进行编辑。并且“站点地图”使用树桩结构显示，可以很清楚的看到每个页面之间的上下级关系，如图2-2：

图 2-2

 2、元件库

         按钮、图片、单选（多选）按钮、矩形等等，所有页面上的元素在Axure中都称作“元件”。Axure的最大特点之一，就是你可以自己选择想要的元件库，默认安装时自带两个库“线框图、流程图”，可以自己尝试着切换一下 。其中我们最常用的就是“线框图”，基本满足了我们制作软件、web页面时的需求。

        当然Axure也允许你载入别人制作好的元件库，甚至可以自己制作一个元件库（比如“IPHONE元件库”），然后分享给别人。这方面的教程我们以后会讲。

3、母板库

        我们平时上网的时候会发现，网站通常有几块区域在所有页面都是一样的，比如头部或底部，如图2-3。

        像这种在多个页面都需要重复使用的区域，就叫做母板。当某个页面需要使用时，直接调用即可，而不用每个页面再分别做一套。另外当母板需要做修改时，只需直接修改该母板，而所有调用这个母板的页面，都会跟着修改。

图 2-3  京东网底部

4、元件属性

        “元件属性”区域，可以操作一个元件的“交互、标注（注释）、格式化”。分别点击图2-4上边的按钮，就可以切换。

        “标注”即给元件添加一些注释，如“这个按钮用open.jpg显示”，让看你原型的人，能够快的理解你的设计思路。“格式化”就是定义这个元件的显示格式，比如字体加粗、背景红色等。“交互”指给本元件添加交互事件，是最常用的一个，如：给按钮添加一个点击事件，点击该按钮后跳转到一个新的页面。

图 2-4

5、动态面板编辑区：动态面板以后的课程会详细介绍。

6、主编辑区

        即设计页面的区域，如想给一个页面添加一个矩形，则从“元件库”中，将一个矩形元件，拖拽到“主编辑区”。

7、页面交互区

        我们刚才学习了如何给一个元件定义交互事件（在“元件属性”中学习）。而“页面交互区”是当页面载入的时候，定义交互事件，因此它只有一个交互事件“onPageLoad（页面载入时）”。“页面载入时”指当浏览器读正在取页面信息，但还没有打开页面的时候。因此这个事件可以在页面打开前，进行一系列操作，以后教程中会有具体例子。

8、菜单栏、工具栏：与office比较类似，在这里不再赘述，以后用到的时候会告诉大家。