下面,用几个实例来介绍用Axure RP Pro制作交互文档。 在制作过程中,经常会有一些Tips,是一些使用软件的技巧和相关提示。这些多半都是我个人的总结,有些可能是我的“错觉”,希望在这方面能够得到指导,也希望一些有用的技巧真的能在实际操作中帮到大家。 根据 Facebook的未登录首面来设计一个SNS社区首页的原型 Facebook的未登录首页 第一部分:制作页面头部(Header)。 作为介绍软件的开始,这一部分将分步骤讲解得比较详细。 1. 第一步:头部底色 打开 Axure RP Pro,从 Widgets面板中选中“Rectangle(矩形)”工具,从面板中拖到工作区当中。 在软件界面的信息栏我们中可以看到工作区中组件的位置(left、right)和宽(width)、高(hight)的数值,单位都是像素(px)。把这个头部矩形放在左上角(left:0 right:0 )的位置,并拉长宽高到850和80。也可以通过右击矩形在菜单中选择“Edit Location and Size(编辑位置和大小)”,快捷键是Ctrl+L(记住快捷键可以提高工作速度) 通过这个编辑框,可以精确地调整组件内容的位置、大小信息,非常适合多少有点“像素强迫症”的朋友们使用 ~:D 在公共栏,可以设置组件内容的一些相关信息。 我们将矩形的边框设为无色,背景设为深蓝,作为Header的底部颜色。 2. 第二步:Logo 从Widgets面板中选中“Image(图像)”工具,从面板中拖到工作区来。 拉到合适的宽度,双击图像,插入我们的Logo图片。如果网站还没有定好 Logo图案,或是为了省事,也可以只插入默认的image图案就可以了。 在插入图片时,如果你在工作区预设的图像大小与图像原尺寸不一致,会有一个信息提示。 如果我们想保留原尺寸(保持图像的真实比例并保证图像的显示质量)则选“是”; 如果插入的图片想按我们预设的大小来安放,选择“否”。 Tips:我们可以在右边的Anotations & Interactions面板的“Label(标签)”栏中为图像加上命名:“Logo”。 在下面添加的组件内容中,你都可以为它们标签命名,规范的命名是个好习惯。当然,一个简单的原型设计,为每个标签进行命名并不是必须的。 3. 第三步:登录框 从 Widgets面板中拖出一个“Text Field(文本输入框)” 可以在公共栏设好文本框的字体大小、颜色等信息,并在文本输入框中输入文字显示:“电子邮件”。 按住 Ctrl键手动电子邮件文本框,复制出一个文本框,把框中文字显示内容改为“密码”。 Tips:在 RP Pro 5.0及较早的版...