欢迎来到天天文库
浏览记录
ID:33611634
大小:962.00 KB
页数:14页
时间:2019-02-27
《实验 快速原型设计axure及使用》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、实验、Axure快速原型设计一、实验目的1、掌握软件开发原型模型的概念。2、练习Axure的原型设计二、实验器材1.计算机一台。2.Axure工具软件。三、AxureRP软件介绍1.AxureRPAxureRP可以让桌面应用软件和Web网站的设计师创建线框图、流程图、原型和规格说明文档,它比任何当前其它创建静态原型的工具如Visio,Omnigraffle、Illustrator、Photoshop、Dreamweaver,VisualStudio、FireWorks、GUIStudio等都要快速、高效,因为它才是真正的专门原型设计工具,并且支持多人协作设计和版本控制管理。设计师们
2、渴望有一个专门的原型设计利器,而Axure正是为此目的而精心打造。AxureRP已经被一些财富1000大公司采用,成为创造成功产品的必备工具。国内的淘宝、雅虎、腾讯、当当等公司的产品经理也都在使用。2.原型的作用和好处制作Prototype是个有效的简化文档编制、吸引使用者参与、早期辨认需求遗漏、将外在需求风险降到最低的方法。将大量文字性文档转变为带有注释与互动性的可视画面,如此更能抓住利益相关者与使用者的注意,让用户在软件开始投入编程前就确认需求。快速原型法(RapidPrototyping)是一种有效且高效的以用户为中心(User-CenteredDesign)的技术,可以帮助
3、用户体验专家、设计师、工程师创造更加有用、可用的产品。目前全球有财富1000大的公司和重要机构在使用AxureRP,国内的淘宝、雅虎、腾讯、当当等公司的产品经理也都在使用。3、Axure的工作环境Axure的工作环境可进行可视化拖拉操作,可轻松快速的创建带有注释的线框图。无需编程就可以在线框图中定义简单链接和高级交互。Axure可一体化生成线框图、HTML交互原型、规格说明Word文档。以下是对AxureRP工作环境的简要说明:图4-1AxureRP工作环境1.主菜单和工具栏执行常用操作,如文件打开、保存文件,格式化控件,自动生成原型和规格说明书等操作。2.站点地图面板对所设计的页
4、面(包括线框图和流程图)进行添加、删除、重命名和组织页面层次,。3.控件面板该面板中包含了线框图控件和流程图控件,如按钮、图片、文本面板、矩形框等,可用这些控件进行线框图和流程图的设计。另外,你还可以载入已有的部件库(*.rplib文件)和创建自己的部件库。4.模块面板模块是一种可以复用的特殊页面,在该面板中可进行模块的添加、删除、重命名和组织模块分类层次。5.线框图工作区(或叫页面工作区)线框图工作区是你进行原型设计的主要区域,在该区域中你可以设计线框图、流程图、自定义部件、模块。6.页面注释和交互区添加和管理页面级的注释和交互。7.控件交互面板定义控件的交互,如:链接、弹出、动
5、态显示和隐藏等。8.控件注释面板对控件的功能进行注释说明。四、登录界面案例操作1).案例描述实现一个较为简单的登录界面,输入用户名、密码后,点击登录按钮进行登录校验:1.如果未输入用户名或密码,则提示“请输入用户名和密码”,蓝色字体;2.如果用户名或密码错误,则提示“用户名或密码错误”,红色字体;3.如果用户名和密码都匹配,则提示“您好,【用户名】”,黑色字体。2)实现步骤步骤一、绘制线框图1、打开Axure软件,新建一个RP文件;2、拖动控件面板中的控件到线框图面板中,绘制登录界面如下图:图4-2线框图所用到的控件清单如下:控件名作用文本内容标识符其它属性Rectangle装饰底
6、板底色:灰色TextPanel信息提示默认:登录窗口logInfoTextPanel信息提示用户名:TextPanel信息提示密码:TextField输入用户名userNameTextField输入密码passWordButton点击登录登录submitButton步骤二、设计控件交互1.选中登录按钮,在控件交互和注释面板中鼠标双击onClick事件:图4-3线框图1.在弹出的―交互场景属性‖对话框中,点击“添加场景…”这个链接;图4-4添加场景2.在弹出的―条件创建‖对话框中,添加条件如下:图4-5创建‖对话框1.回到―交互场景属性‖对话框中,Step2中选择动作―SetVari
7、ableandWidgetvalueequaltoValue‖,并点击Step3中的链接:图4-6选择动作2.在弹出的“设置变量和控件值”对话框中,设置如下:图4-7设置变量和控件值点击“Edittext…”链接,输入“请输入用户名或密码”,并设置为蓝色;6、确定和关闭所有对话框,这时控件交互和注释面板如下:图4-8注释面板以上我们实现了第一个场景:如果未输入用户名或密码,则提示“请输入用户名和密码”,蓝色字体;接下去,我们实现第2、3个场景,其步骤和实现场景1类似,
此文档下载收益归作者所有