搜索
如何快速学习原型工具如何快速学习原型工具如何快速学习原型工具如何快速学习原型工具AxureAxureAxureAxureRP,RP,RP,RP,成为一名产品经理？成为一名产品经理？成为一名产品经理？成为一名产品经理？一、一、一、一、产品经理为什么要学习原型工具产品经理为什么要学习原型工具产品经理为什么要学习原型工具产品经理为什么要学习原型工具AxureAxureAxureAxureRP?RP?RP?RP?产品原型设计，是产品经理必须经历的过程，就如同盖楼，设计师不需要经过概念设计、模型设计、以及产品设计图的设计一样，原型设计在电脑软件、网站设计、客户端设计就非常重要了，原型的完成的最终目的有两个：a.能够准确的描绘出产品的功能和样式.b.快速将构思变成一个有型的产品展示。AxureRP是目前最好的一种完成现有设计需求的原型工具。IT相关原型工具的发展是随着整个IT产品的发展变化的。比如，早期的产品原型，由于早期的产品功能相对简单，就是用笔在纸上画出一个一个的页面或功能样式，通过详细的功能文档在对这个功能进行说明就可以达到开发者及战略者知晓的要求，所以在当时的特定环境下，笔和纸就是最佳的原型工具。随着产品的复杂化，一些的交互效果的出现，原始的工具不能进一步的满足需求，比如，需求的更改、功能样式的复杂，用手绘不能准确的描绘出来，早期的从网站策划、活动策划、网站编辑、美术设计等工作转向产品经理的人员开始利用MSWord、MSVisio、AdobePhotoshop等工具进行产品设计。从技术开发、页面制作的等工作转向产品经理的人员开始利用MSFrontPage、Dreamwear等工具进行产品原型设计。但是苦于没有一种非常适合产品经理工作的软件，只能利用自己最熟悉的工具进行着复杂的设计。列举下这些工具的弱势：�Word:进行图形更改的成本很高，更改一处，处处都要改。�Visio：没有交互，没有动态效果，只能是一张张静态的图片，效果还要文档复杂的描述。�PS:设计成本本身就很高，如果设计被否定，将是天灾。�FrontPage:需要门槛，且最终的效果还需要找代码。�Dreamwear:是切图静态界面的软件，软件用于原型设计，属于大材小用，但是用的还不不爽。和PS一样，如果被P掉，有想死得心。随着很多网站开始宣称：“我们的用户体验有多么多么的好”，“用户体验决定者产品的成功”“细节决定成败”等得口号的出来，对产品经理的要求就越来越严格，每个产品如果没有做任何的效果，貌似就没有用户体验的感觉（这个是个谬论，但是很多的公司就在这个谬论上工作），华丽的效果，鼠标滑过、鼠标点击、按键抬起，焦点失去，都要有！用那些传统软件已经不成啦！AxureRP的出现，改变了产品经理的压力和工作量。很多产品经理很发憷开产品会议，一个小产品，需要开好几个小时，技术才明白要什么一个产品。很多老板经常说：明天我要一个什么什么产品，产品经理更是慌张。AxureRP解决了这些问题，他可以实现快速将产品样式高仿真的展示出来，可以模拟任何一个效果，比如鼠标过去弹出一个弹窗，弹窗的样式都会有。产品会议只需要演示原型，不用废话啦。明天要的产品可以在1-2个小时把效果和功能先演示给老板看啦！掌握好AxureRP的产品经理，可以加快产品设计速度，有效的推动产品的流程，产品原型完成后，前端的设计、后端的设计、测试用例撰写可以同时进行了，他们都通过原型进行自己那部分的工作，然后和下一个环节衔接起来。掌握好AxureRP的产品经理，可以将“用户体验“做的淋漓紧致，他提供了完美的交互设计方法，理论上，可以高保真的模拟任何的效果。二、二、二、二、如何快速学习如何快速学习如何快速学习如何快速学习AxureAxureAxureAxureRPRPRPRP？？？？1.1.1.1.了解工具的布局与操作了解工具的布局与操作了解工具的布局与操作了解工具的布局与操作a.a.a.a.整体布局整体布局整体布局整体布局如图所示，整体的布局同普通的软件一样。试着对于每一个模块，点击左键、右键，更改其属性，了解其操作。b.b.b.b.如何搭建我要的部件？如何搭建我要的部件？如何搭建我要的部件？如何搭建我要的部件？左面中心的部分，有一个部件区域，将每一个部件，拖到中间的区域，改变属性。看看，是什么效果。其中要说的，是“矩形“这个部件，很多的部件是由他改变生成的，右键点击矩形：其中的各种形态可以自己尝试，有画出各种效果。右键中的编辑悬停样式，即设计鼠标滑过时，这个矩形的效果，多用于上标签的设置，其中还有鼠标按下的样式设置，就不一一举例了，您可以把每个功能都尝试一下。c.c.c.c.如何生成演示效果？如何生成演示效果？如何生成演示效果？如何生成演示效果？快捷键为F5,如果操作的话：点击“生成-原型“。窍门：如果只是小小的改动，页面重新生成又非常耗时的话，在生成菜单下，有一个”在原型中重新生成当前界面“2.2.2.2.交互的实现交互的实现交互的实现交互的实现a.a.a.a.如何实现点击一个按钮，切换不同的界面？如何实现点击一个按钮，切换不同的界面？如何实现点击一个按钮，切换不同的界面？如何实现点击一个按钮，切换不同的界面？第一步：准备工作，做两个界面，如图所示：第二步：单击选中“略晓首页”的“切换到略晓界面1”的按钮，选择右上操作区“闪电”那个标志的交互按钮，会出现“点击时”，双击onclick(点击时)这是在设定，这个按钮在点击时的效果。同时，你可以设置其他的效果，比如在新窗口打开，在此，您可以设置不同的效果，来实现简单的交互。b.b.b.b.如何实现鼠标滑到某个区域，其他位置文字出现？如何实现鼠标滑到某个区域，其他位置文字出现？如何实现鼠标滑到某个区域，其他位置文字出现？如何实现鼠标滑到某个区域，其他位置文字出现？第一步：准备工作，画一个矩形及一个文本面板（用于文字的显示），并将文字面板的标签命名“显示文字”。第二步,实现交互：点击矩形“鼠标划过区域”选择右上的交互，编辑onMouseEnter(鼠标移入时)，选择左侧的“设置变量/部件值”弹窗选择“文字在部件”找到“显示文字”（刚定义的部件）等于值。点击编辑文字。输入想显示的文字，如：luexiao.com等，点击所有确定。交互完成。3.3.3.3.学习动态面板学习动态面板学习动态面板学习动态面板a.a.a.a.动态面板是什么？动态面板是什么？动态面板是什么？动态面板是什么？动态面板是完成交互的重要组成部分，你可以在右侧中间的“部件”中找到他。他的作用是在不切换页面的情况下，实现当前页面内的，不同效果的交换。逻辑上他其实就是一张一张的白纸，也可以理解成PS中的层，同过设置不同状态的部件，来实现不同状态的切换，用白纸的效果演示标签的切换，如同所示：b.实践说明如何运用动态面板做上标签切换。第一步：准备工作：将动态面板的三个状态分别画出来，像上面的手画的一样。第二步：实现交互，双击每个状态，将所有的上标签的状态，通过“切换动态面板为制定状态”设置不同状态的切换，如下图所示：c.如何通过动态面板进行弹窗设计。弹窗的设计，用的是动态面板的显示与隐藏，首先，画一个按钮“显示略晓”然后画一个整个空间的矩形，填充黑色，50%的透明度，在上面再画一个矩形，就是弹窗了，如下图所示：其次，选中所有的部件（除“显示略晓”按钮）点击右键转换-转换为动态面板。然后，将这个动态面板更名为“略晓弹窗”右键点击这个动态面板，点击“编辑动态面板”-设置隐藏。最后，添加交互，选中“显示略晓”按钮，编辑其onclick时间，选择“显示动态面板”找到“略晓弹窗”到这里复杂的动态面板的操作是不是变得简单了？多加练习交互其实不难。4.实践出几个题目给你，有助于你在实践中获得更好的学习。1.登录与注册2.回答问题框的不同状态判断此文档中的所有原型，将在附件中完整提供。