快速制作高保真原型不得不知的小技巧

1、原型示例我不会告诉你我是这样做的准备篇素材积累工作的时候每隔一段时间我会停下手头的活，休息几分钟（番茄工作法）。一般在这几分钟我会站起来走两步，然后就是看看素材类，图片类网站。因为逛这类网站不用动脑，所以放松挺不错。顺便看到不错的图片就保存下来当素材。列一些我常去的网站：花瓣网 国内知名图片分享网站UI社 素材类网站，免费下载psd文件easyicon 可以搜索你想要的各种icondribbble 交互类作品分享平台，国外大神常出没于此reeoo 国外素材类网站，支持免费下载修图小技巧积累的图片素材有时候不能直接用，可能背景不透明，可能填充色不对等等。所以掌握简单的修图技巧还是需要的。通常用的

2、比较多的就是切图（psd文件切图标用），剪切，调整图片大小，抠图，修改填充色。由于MAC下PS比较卡，所以我用的修图软件是Affinity Photo(下简称AP)。网上不太容易找到AP的使用教程，这里就介绍下AP的切图方法。其他的琢磨两下就知道了。psd切图用AP打开psd文件创建切片导出切片原型设计规范刚开始学画原型图时，我总是在字体的大小，颜色等等这些细节上很苦恼。如果太随意，虽然省事，但效果实在不堪；如果扣细节，却又要花很多时间，得不偿失。后来我发现，不同的产品原型完全可以用一套设计标准，因为不管原型如何，UI最终会针对APP出相应的视觉设计规范。于是我制定了我的设计标准，管你什么AP

3、P，直接套，即便捷又美观。比如我的文字大小颜色等等是这样设置的。可以根据自己的需要制定自己的规范。自定义组件虽然Axure已经提供了一些方便使用的基本组件，但为了提高效率，我们需要自定义常用的组件。比如iPhone的navigation栏和tab栏，跟大宝似的天天见。那我就做成了组件，随时用，随时拖。我的一些自定义组件注意，自定义组件本身也是遵守原型设计规范的。另外，看到图中方案1下面的那几个组件了吗？有什么用呢？待会说，先卖个关子。Axure使用篇常用快捷键想要快速，尽然不用快捷键？别逗了。分享下乌金老师整理的Axure RP7.0快捷键中英文PC和MAC对照版辅助线Axure有全局辅助线和

4、局部辅助线。全局辅助线在所有页面都有效，局部辅助线只在当前页面有效。在开始制作原型图前，我会先布局好主要的辅助线。比如我做的原型界面是375668（iphone6屏幕像素的一半）的大小，控件距屏幕边缘20px宽，为方便布局，我会先设置几条全局线。创建全局辅助线移动左边两条辅助线移动后选中所有辅助线，设置锁定这样基础的辅助线就设置好了，再在具体使用中灵活运用局部辅助线，我们就可以愉快的布局玩耍啦。利用辅助线快速布局对齐分布和等间距分布想要多个控件的位置摆放合理美观，我们常常用到对齐分布或等间距分布。对齐分布有三种方法：一，利用Axure的提示对齐线移动控件的过程中，提示对齐线会自动出现（原谅我截

5、不了图），按提示操作即可，很傻瓜式。二，利用辅助线关于辅助线，前面已经说到，不罗嗦了。三，利用对齐动作比如我想让控件2对于控件1进行左对齐，先选中控件1，再选中控件2(注意顺序)，然后去点右上角红圈处的对齐按钮，选中左对齐即可。可以记住对齐快捷键，那操作就很快啦。对于2两个以上的需要等间距分布的控件，我们可以利用等间距操作。比如tabbar，通常有4、5个按钮。我们在设置好一个按钮后，直接复制粘贴，如图把最两边的按钮位置放好，选中全部按钮顶部对齐进行水平等间距完成取色这里正是我前面卖的关子。我们制定好了规范，每个界面的背景色都是#F7F7F7，现在我要修改一个蓝色背景的矩形组件，怎么该颜色呢？输入色值？当然可以，但慢啊。用取色笔？屏幕里没有我要的颜色啊？瞧我的。我根