axure设计出的原型打开自动跳转的问题_产品原型设计经验总结

在日常的产品工作中，把原型设计的又快又好，切让人能一看就懂，评审的时候少被质疑，是每一个产品经理都希望达到的效果，想要达到这样的效果，除了掌握基本的工具技巧和设计规范外，大量的练习是必不可少的。

本节针对产品原型设计过程中的一些实用的技巧和经验，以及一些注意事项，做了一个全面的总结，希望对初级的产品经理读者有所帮助。

1. 实用技巧整理

实用技巧整理模块主要基于Axure这款原型设计工具，总结了一些实用的操作技巧和使用规范建议。

★  需要重复使用的元件，建议创建成母版使用。如果修改了母版，所以页面中的母版元件将会被同步修改。     使用外部元件可以提升原型设计的效率，建议将常用的元件整理成一套自用的元件库，每次项目都可以提前在临时画布中定义好需要用的控件，需要时直接拖拽使用。

★  建议使用组合功能对多个元件进行整合，方便移动和调整尺寸，组合支持部分常用交互和属性设置。

 ★  对于隐藏的元件，在需要显示时注意添加一条置于顶层的用例，以防止元件层级太低被覆盖。  

★   对于一些不需要移动的元件可以将其锁定，以免移动其他元件时将不需要移动的移动了。

 ★  使用单选按钮时将单选按钮设置为选项组，选项组名称相同的单选项中只能有一个被选中。

 ★  Axure中有自带的一些形状，如箭头、三角形、圆形等，在右侧的“元件属性与样式”中可以进行设置。

 ★  交互样式的使用，在元件的右键属性中有交互样式，可以设置选中、悬浮时的效果。  “元件提示”可实现鼠标移入时显示元件提示的内容。 

★  文本输入框的提示效果：“在输入框中显示提示内容，获取焦点时隐藏输入内容”可通过“提示文字功能”实现。

 ★  动态面板如果没有勾选了“自动调整为内容尺寸”则需要设置显示滚动条，不然超过动态面板尺寸的将显示不全。

 ★  动态面板的禁用和选中，将动态面板设置为选中、取消选中、切换选中或禁用则动态面板中的元件都会处于选中、取消选中、切换选中状态或禁用。利用这个特性可以做复选框的切换选中效果。

 ★  同一个元件上可以添加多个交互用例，如果一个按纽或动作会触发多种不同交互状态，例如：用户多状态判断提示等。建议将多种交互状态用例同时加在对应的按纽和动作上，并用对应的交互状态对按纽或动作命名。

★  同一个元件上的多个交互用例执行是有先后顺序的，所以有时候如果你的语句设置都没有问题，但是怎么也出现不了应有的效果，请检查一下你的语句防止是否有问题。 

★  Axure支持对图片进行裁剪、拼接，同时你也可以将元件转化为图片。 

★  动态面板单击时显示，再次单击时隐藏的效果实现方法是：切换动态面板的可见性。 

★  动态面板的“固定到浏览器”属性可以将动态面板始终固定在页面中某个位置。 

★  复制元件后注意修改元件说明， 按住Ctrl+拖动可以平行复制元件， 按住Ctrl+上下左右箭头可以快速移动元件。  使用辅助线可以帮助你快速的进行界面的布局。

 ★  可以在右下角的“元件管理”处控制元件的可见状态，如果元件不可见时，全选整个界面并复制是选择不上的不可见元件的，粘贴后发现会丢失，所以要复制整个界面时需要保证元件处于可见状态，才不会丢元件。 

★  预览时页面在浏览器中居中的方法是：在页面样式中设置页面排列。但是设置了页面排列后预览时发现仍没有在浏览器中居中，则可能的原因是：原型中有元件的宽度超过了浏览器的宽度。 

★ 内联框架设置默认页面的方法为：双击内联框会弹出界面链接设置或在内联框中右键单击“框架目标页面”。 

★  打开生成的Html文件中的start.html可以看到站点导航，单击站点导航处的小箭头后可以将有交互事件的元件进行标识。 

★  如果需要将多个项目进行整合时，采用直接导入项目而不是复制界面，导入时可以导入页面、母版、变量等所有相关内容，而复制只能复制界面内容不能复制变量，可能会导致效果丢失。

 ★  对于添加打开链接的用例，如果选择在新窗口新标签中打开后，新窗口中将不显示站点地图。

 ★  如果在原型设计过程中软件或系统意外崩溃，而文件又没有来得及保存的话，可以通过文件-从备份中恢复找回最新的版本，在自动恢复设置中可以设置自动备份的时长。

 ★  把当前的页面转化为图片。这个功能可以解决你原型中文字的字体或者大小或者换行等在浏览器中预览的一系列问题。 

★  在页面属性中设置草图效果可以生成手绘风格的线框图效果。

 ★  有时我们需要把整个站点的结构用树形图呈现出来，Axure为此提供了一个快捷的方法：在页面区域对准你希望生成树形图的主干点右键，选择 “生成流程 图”，就能自动生成图表形式的站点地图。单击图表上的每个控件，就会去到对应的页面。

 ★  在发布时可以在发布设置中自定义Logo和标题，在生成的原型文件导航中就能显示添加的Logo和标题。 

★  Axure支持原型导入和合并功能，在生成时可以选择全部和部分生成。 

★  许多初学者总是很随意地去添加Axure的文本框，而当你框架布局完成后，就会产生过多的文本框需要推拽到框架内。这样的文本框累赘会浪费你许多时间。而且对于同个框架内的文本对象会增加很多，也就是说会使得设计过程复杂化。 

★  不要使用动态面板做简单的交互，动态面板是个强大的工具，可以用来设计任何需要多状态显示的页面内容，但也很容易增加复杂性，最好不要依赖到复杂的动态面板。养成为组件和动态面板命名的习惯，可以节省很多原型的维护时间成本。

2.设计经验总结

如图4-13所示，是对原型设计过程中的一些经验总结，包括一些建议、原则，和要求：了解一些常用技术UI框架的控件规范；整理并总结提升用户体验的设计技巧；了解最新的视觉和交互趋势；完整清晰的传达功能需求和交互需求；清楚的表达视觉层级；避免纠结复杂的交互效果实现；用页面导航结构来构建信息架构；遵循控件规范和命名规范；标记第一屏的高度；遵守栅格规范；提升可读性，保持合理的布局和间距；尽量不要使用截图。

 

图4-13原型设计经验总结

3.原型设计注意事项

图4-14中总结了项目中的一些原型设计在项目中的一些注意事项，分别是：合理的选择原型的保真度；不同阶段输出不同丰富度的原型；养成保存多个版本的习惯；原型发布和分享要注意阅读对象的体验。

其中合理的选择原型的保真度，指的是要根据项目对原型保真度的要求以及留给产品经理进行产品设计时间的充裕程度来评估，在没有明确要求原型保真度情况下，产品经理可以根据项目留给自己的原型设计时间来选择保真程度，如果时间充足，则可以输出高保真的产品原型，反之则输出中低保真的产品原型。

图4-14原型设计经验总结

其次，在产品原型设计过程中要不同阶段要输出不同丰富度的原型，初审阶段可以先完善一级页面结构参与评审，让项目参与人员明确需求背景以及大致的产品方案，产品方案的大的框架和基本逻辑评审后没有问题，再进行二级和多级页面的丰富细化。很多产品经理经常画完整个原型后拿着完整的高保真原型去参与评审，一旦评审不通过，且要对一些重要的功能和交互做出修改，那会是很浪费时间的一件事。

产品原型设计的过程中要养成保存多个文件版本的习惯，是指要保存连续版本更新的实体文件，不建议所有的设计迭代都在一个文件上进行，通常你删除了一些模块，发现后续又需要这样的模块，则不得不在重新画一次，如果有多个版本的文件，则直接可以复用之前没有删除该模块的文件内容。其次，最好在本地保存后再同步到云端，以防止本地环境异常导致的文件毁灭性丢失。

最后，原型发布分享的时候要注意阅读对象的体验，例如Axure生成的Html文件经常需要相关插件才能在浏览器打开，个别浏览器会无法渲染出完整的页面元素等，在原型打包分享的时候应该考虑这些问题提前准备好解决方案。

《产品经理成长宝典 Ⅰ》 

构建完整的产品知识体系和能力模型

第一章：产品的基本概念和定义

1.1  元概念：用户、需求和产品1.2  好产品的定义1.3 产品经理的职业要求和角色定位1.4 产品经理的知识体系

第二章：如何撰写产品文档

2.1 产品文档撰写的基本方法2.2 三大产品文档的基本定义与作用2.3 如何写好BRD文档2.4 如何写好MRD文档2.5 如何写好PRD文档

第三章：如何画好产品流程图

3.1 产品流程图的定义，作用和画法

3.2 如何画好一般流程图

3.3 如何画好泳道流程图

延伸阅读 

【妙语连珠(一)】优雅，沧桑，一种科学无法描述的艺术气息

【妙语连珠(二)】希望你懂我所有隐忍的深刻与浅薄的温柔

【妙语连珠(三)】最怕一生碌碌无为，还说平凡难能可贵

【妙语连珠(四)】白茶清欢无别事，我在等风也等你

【妙语连珠(五)】要是能治好我的癌症，就算死我也愿意

【妙语连珠(六)】人生有很多种活法，但是最LOW的活法就是活在别人的眼光里

【妙语连珠(七)】无聊的下一步就意味着堕落

【妙语连珠(八)】尚未拥有百毒不侵的内心，却提前丧失了热泪盈眶的能力【妙语连珠(九)】聪明无疑是生活中很性感的一种能力【妙语连珠(十)】我很忙，但是愿意为你有空【妙语连珠(十一)】你必须只有内心丰富，才能摆脱这些生活表面的相似【妙语连珠(十二)】人都差不多，做得好一点就超越了无数的其他人【妙语连珠(十三)】愿你可以带着最微薄的行李和最丰盛的自己在世间流浪【妙语连珠(十四)】常常是最后一把钥匙打开了门【妙语连珠(十五)】谢谢你出现在我的生命里【妙语连珠(十六)】你必须只有内心丰富,才能摆脱这些生活表面的相似【妙语连珠(十七)】伟大的生意，是指某样可重复贩卖的美德【妙语连珠(十八)】大部分人都生活在平静的绝望中