Axure教程VIP专享

下面，用几个实例来介绍用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及较早的版...