Axure添加交互过程中最核心的两点是什么？

在Axure添加交互过程中，最核心的两点是：

事件：事件是指在Axure中通过用户操作触发的动作，如点击按钮、鼠标移动等。

动作：动作是指在事件发生后需要执行的操作，如页面跳转、弹出提示窗口等。这两个点是交互设计中最核心的部分，它们之间的联系才能使交互设计效果最佳。

在axure 8发布以后，可以利用几项技术（axure自动生成自适应html、前后端分离、响应式网站设计、restful接口、json或xml等）进一步简化网站的开发，该设计模式的主要流程如下：

1 产品经理利用axure设计原型。

2 原型讨论定型后由UI人员设计图标，更新到axure原型中。

3 由axure生成 自适应的响应式网站 设计的html文件。

参考：http://wwwwoshipmcom/rp/696039html

注意：axure发布项目生成html时，在左侧的“ 移动设备 ”这个设置页，需要 勾选“包含视口标签”，不勾选“禁止页面垂直滚动”，宽度设置为“device-width”， 高度留空不设置，初始缩放倍数绝对不能设置 ，最小缩放倍数设置为“01”，最大缩放倍数设置为10，允许用户缩放留空不设置 ，ios部分可以不理默认即可。另外需要 axure 8以上版本才能普遍适配手机 屏幕。

4a 前端开发人员全盘使用上面生成的html文件、资源文件、axure的js文件，在各个页面上以前后端分离方式添加业务逻辑的实现（比如在html中加入jquery的ajax，和后端交互数据）。

4b 后端开发人员设计和实现业务逻辑和前后端接口（4b可以和3、4a步骤同步进行），比如前后端使用restful的json封装作为前后端接口的数据交互。

5 单元测试、集成测试、灰度测试，bug修复，发布上线。

该模式问题 ： 一旦axure原型有修改，前端怎么能更快适配该修改（现在是文件比较方式，类似git的merge）。

http://wwwcar-oceancom/app-download/newshtml

你好，首先我觉得原型设计需要根据需求（内部需求和外部需求）来设计自己的原型，其次你要明确产品原型相关意义~下面分享一些，你可以根据自身问题，看一看~

原型的定义：

用线条、图形描绘出的产品框架，也称线框图。

交互设计的结果输出，可能是一张纸上的几张图；原型代表着交互设计的结果，当最终实现的时候，交互流程会和原型保持一致；可以理解为草稿或者叫做参照物

原型是一种让用户提前体验产品、交流设计构想、展示复杂系统的方式。就本质而言，原型是一种沟通工具。

原型设计：

线框图描绘的是页面功能结构，它不是设计稿，也不代表最终布局，线框图所展示的布局，最主要的作用是描述功能与内容的逻辑关系。

原型图是最终系统的代表模型或者模拟，比线框图更加真实、细致。

原型设计的作用，主要有两点：

沟通： 因为是原型是需求和功能的具象化表达，所以原型可以辅助产品经理与领导、交互、UI和技术的沟通产品思路。虽然需求文档也是可以满足沟通需求的，通过用例将交互写到设计描述文档中，但是原型可以更详细地解释交互。

测试：因为原型相较于UI稿来说修改更方便，所以原型能提高产品经理的功能设计没通过评审时返工的工作效率。没有哪一家互联网公司可以不经过测试，就直接上产品和服务。原型在识别问题、减少风险、节省成本等方面有着不可替代的价值。

原型设计的目的：

1原型设计的核心目的在于测试产品，没有哪一家互联网公司可以不经过测试，就直接上产品和服务。

2原型在识别问题、减少风险、节省成本等方面有着不可替代的价值。

3虽然需求文档也是可以满足沟通需求的，通过用例将交互写到设计描述文档中，但是原型可以更详细地解释交互。  

设计流程：首先明确产出原型目的以及用户群体，这个原型有多大效率帮助我传达设计或测试设计？ 有多少时间做原型？其次需要什么级别的保真程度？

具体方法：

步骤一：画草图：画草图的目标是提炼想法，并且最好给画草图加上一个时间限制，那就是15分钟。如果你绘画能力很差，那么恭喜你，可能你能更好地用好草图，因为你的注意力没有放在美化你正在画什么上面。另外画草图要避免陷入审美细节，尽可能快速的导出想法才是关键。

（用纸笔画的用户个人账户的草图示例）

步骤二：演示及评论

演示和评论的目标是把一些想法拿出来跟大家分享，然后进一步完善想法。

在演示过程中，要做好记录，演示和评论的时间可以对半分。

步骤三：做原型

在明确了想法之后，就可以开始进行原型设计了。这个阶段需要考虑很多细节，找出切实可行的方案，运用合适的原型来表达。

步骤四：测试

原型的目标之一是让受众来检验产品是否达到了预期，因此可以请5-6位测试者，通过音视频捕捉等方式，看看产品原型是否被顺畅地使用了。

原型设计工具：选择什么工具来制作原型？主要考虑以下几个因素（排名分先后）：

1 熟悉程度和获得工具的便利度；

2 所需的时间和精力；

3 可复用的代码/框架；

4 为测试创建可用的原型；

5 价格和学习曲线。

目前比较好用的在线原型设计工具有Marvel，Invision，墨刀等等。

1、首先，打开软件。

2、正常打开Axure RP80工具，如下图，创建一个新的RP文件 。

3、在空白页面上从元件库中拉出一个矩形框和一个按钮，矩形框是为了展示主页的内容，按钮是为了点击后弹出对话框的效果，界面设计如下截图，使用过程中根据自己项目的实际需求摆放具体内容。

4、从左边元件库中拉出一个动态面板，放在页面上，摆放位置可以根据需要进行摆放，也可以通过设置，使其在页面上居中显示，具体这个设置步骤请查看步骤十说明。

5、双击动态面板，将弹出如下对话框，先为动态面板定义一个名称 ，这个名称等会在设置显隐的时候需要用到。然后再单击state1会弹出另一个新的子页面，就可以在该页面中增加弹出框的具体内容了，详细步骤请查看截图2

6、在上述步骤过后，主页index的页面效果将如下所示，鼠标右键点击动态面板，把动态面板设置成隐藏，具体操作如下截图2。

7、为页面上的按钮增加事件。选中按钮，在右边的设置面板中，双击“鼠标单击时”按键，如下截图1，页面将会弹出新的用例编辑窗口，选择元件的“显示/隐藏”，找到刚刚的动态面板，并将其设置为显示，具体操作如下截图2中标红的位置。这步的设置非常重要， 只有正确设置了这步，才能正确的弹出窗口。

8、在第五步中增加的动态面板，也有放置一个按钮，该按钮的作用就是点击后自动关闭弹出框，设置步骤和步骤7类似，只是将“显示”改成了“隐藏”，具体操作如下截图中标红的位置。

9、配置完后，点击预览，在浏览器上点击“打开新窗口”按钮，页面将弹出新的对话框如下截图，点击“关闭窗口”将关闭该页面。

10、在第八步之后 ，已经完成了新窗口弹出的配置功能，这一步将分享如何美化页面。在第九步中展示的效果是设计人员在页面上将对话框放置在什么位置，弹出时就在什么位置，为了美观，我们经常需要将弹出框在页面中居中显示，要实现该功能也很简单，只要完成如下步骤就可以了。

11、在主页上，鼠标右键点击动态面板，在弹出的选择项中选择“固定到浏览器”并单击它。在弹出的对话框中按照如下截图2进行配置就可以了。

12、这时候预览页面效果，就如下截图所示，弹出框将在页面上居中展示。

Axure RP是一款快速原型设计工具，能让产品人员快速、高效的创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。其工作环境可以进行可视化拖拉操作，无需编程就可以在线框图中定义简单链接和高级互换。

示例讲解：Axure RP如何设置矩形的透明度

1首先我们打开Axure软件之后，拖入一个矩形3元件：

选中矩形元件，点击工具栏上的填充颜色图标，拖动“不透明”，将不透明度，设置为“0”

需要将矩形显示出来，只需将不透明度拖到100数值即可。

2关于设置的透明度就不是填充颜色里面设置了，我们拖入元件之后，会发现填充颜色的图标是点不了的，那这时候该怎么办呢？

那么我们只需选中，这里可以上传一个漂亮的，然后在检视的面板中，点击“样式”，下拉找到“不透明”：

将不透明度设置为0，就可将设置为透明的。反之，需要显示出来，只需将不透明值输入100。

注意：

1关于元件的透明度设置，我们需要注意的是，有些元件的透明度需要在工具栏中的“填充颜色”中设置透明度，比如一些没有边框，有填充颜色的元件，就像上面的矩形3。

2而有些元件，是带有边框的，那么“填充颜色”那里是没办法进行设置的，比如如图所示的矩形1或者椭圆形元件，他们的透明度就需要在“检视”面板中进行设置:

3有一些元件，既带有填充颜色又有边框的，可以直接在“检视”面板那里进行设置即可，比如占位符：

4还有元件是只能在“检视”面板中设置透明度的，比如上面所讲的的透明度。

5而有些元件是不能进行透明度设置的，只能进行隐藏框架，只需选择右上角的“隐藏”图标，比如内联框架、单选按钮等。

更多Axure RP教程获取，希望你能有学习收获。

1，axure主要是做交互原型的。

2，在当前互联网公司中，产品经理，互联网产品设计都用到原型设计。

3，axure在当前相对市场占比还比较大，所以有必要接触一下。

4，在当前职业中，产品，交互，ui都会接触到原型设计。

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

2，你也可以用axure代替viso来做流程图。个人觉得更顺手。

3，用axure生成一个多触发的小游戏或者课件。然后发布成网页压缩包。发给别人玩或者浏览。

4，热区功能可以很好的解决使用者鼠标经过时光标变化体验的同时，范围性的点击也会让小按钮更好点。特别是当你做触屏手游的时候。

5，良好的习惯，可以使你用得上更多的发布功能，特别是规格说明书。

6，用axure可以找到志同道合的朋友，比如说你给的都是干货时候，（项目经理和产品经理应该是主要读者），给你点赞的人，绝对是个心胸开阔的尊敬他人的人，他身边的人对他评价应该也不错。在文中给予评论的则是尊敬技术的，并乐于分享自己经验看法的人，他们也是有匠心精神的人。

重复比较多的地方请尽量使用母板，最好是非固定位置的母板。

当功能不太好实现的时候（或者一时想不出来的时候），试试用动态面板，也许会有意想不到的方法。

Axure里面的语句执行是有先后顺序的。所以有时候如果你的语句设置都没有问题，但是怎么也出现不了应有的效果，请检查一下你的语句防止是否有问题。

用Axure可以对进行裁剪、拼接。

Axure可以对进行切图操作。

1母版自定义触发事。

2动态面板多层嵌套。

3自定义格式刷和注释字段。

用透明矩形框来做页面级交互事件

具体步骤如下：

1设计完全部原型（不可点击）；

2把需要跳转页面的点击区域，画一个矩形框，设定好交互事件；

3把矩形框设为透明；

4复用到其他区域；

好处：

1全部设计原型后再细化交互细节，可以避免陷入［抠细节］状况，提高了设计效率；

2用独立矩形框设定交互，可以很快的复用到不同页面，不同区域，简单方便直接；

1，使用Project。如果你是团队协作，Project无疑会使整个项目效率显著提高且减少出错；如果自己单独使用也是好过Save的，可以方便做版本回溯。

2，更多时候，请把精力聚焦到线框的逻辑与结构，而非交互效果上，尽可能用简洁的文字、分镜、示意图把交互效果描述清楚。很多人追求把交互效果做的跟flash或js编程似的，这完全本末倒置。

1判断

在遇到几乎任何“什么什么时候”，想要“怎么怎么样”的情况，能且只能用UC用例的判断来实现。这几乎是高保真原型的灵魂。

2智能手机上那种滑动效果

需要至少两重动态面板嵌套才能保证滑动（Axure里是Drag拖动）时，不超出范围显示，至于滑动到一定程度返回，则需要结合判断里面“元件范围”的接触另一个控件与否，然后用动作来实现。

能实现iPhone 在iOS 7那种解锁。

3自适应屏幕

这里说的不是Axure 7自带的那个坑爹的自适应，在显示左侧站点地图或者像素有一点点差别就失效的效果怎么拿得出手呢？而这些其实是可以通过调用屏幕尺寸来强行使原型适应屏幕的。

比如一个banner，宽度=屏幕宽度；比如一个App原型，让iPhone 机身始终处于屏幕水平垂直居中位置；Gmail 进度条也是一样。

4文本模糊搜索/分词搜索

这些都可以利用中继器实现，只是稍微麻烦点，要从另一列数据中包含搜索，并且那一列数据要写得比较全面在查找部分里可以找到。用sousuo那一列里的关键词都能搜出左边的东西。

5文件上传

自从文本框可以设置为文件类型，支持用户选择电脑文件的时候，我就知道总有一天可以实现上传。上传的只要是，不管什么格式都能正常显示，不用在Axure里一个个后缀名单独设置。我的做法是文件类型文本框选择了一个文件之后，将文本框内的数据通过字符串函数进行一系列处理，在一个内部框架中打开。

6旋转/翻转

把同一张放到不同尺寸/转向的“”控件里，所有控件以一个动态面板不同的状态的形式保存，然后用一个UC设置动态面板的状态“重复”显示“下一个状态”即可。

7按比例放大缩小

需要把当作动态面板背景，并且在面板设置里设置好，才能用UC和变量控制它的比例缩放，此功能能衍生出非常多的效果。