[翻译]Axure-Build Wireframes-原型设计工具Axure学习-第1.1节

Build Wireframes

Build Wireframes的对于应用程序或网站的布局和功能的可视化沟通非常有用。本小结讨论如何用Axure的小工具创建,组织,建立和设计自己的Pages。
视频:下载MP4格式

 


Sitemap

Sitemap在设计中用来新增,删除和组织Pages。页面数量没有限制,但是如果你的页面数量超过100,我们建议将Pages进行分组。

新建和删除Pages

新建:在sitemap工具栏上面点击“Add Child Page”按钮新建Page
重命名:在需要修改的page上面慢双击,就可以重命名,并且不会影响Pages直接的超链接效果
删除:在sitemap工具栏上面选择需要删除的Page并单击“Delete Page”按钮
另外你也可以通过右键单击页面打开文本菜单来创建,重命名和删除Page

Organize Pages

通过在sitemap上面拖拽或在sitemap的工具栏上面的箭头按钮可以重新排序Pages。此操作不会影响pages之间的映射。

Open Pages for Design

双击打开page的设计面板。

为了方面,打开pages会在Wireframe面板的选项卡栏产生一个tab。选项卡可以进行拖拽重新排序。单击Pages选项卡附近的一个向下的箭头会打开一个Pages列表,可以选择关闭全部Pages的Tab或者关闭其他Pages的Tab。

 


Widgets

 

Widgets是用来设计wireframe用户界面的元素。Widgets面板包含一组常用的元素,例如“button shapes”,"images"和"text panels"。
除了自带的Widgets,你还可以创建属于你自己的Custom Widgets或者下载其他人分享的Widgets库。
从 Custom Widget Libraries了解更多关于custom widgets内容。

Choose and Search Widget Libraries

单击下拉菜单选择需要的Widget库。Widget会显示在Widget面板当中。选择“All Libraries”会显示所有的Widget。
点击搜索图标可以搜索当前库下的Widget。

Add, Move, and Size Widgets

 

Add:从Widgets面板拖动需要的widget到Wireframe面板当中。Widget支持复制粘贴。
Move:可以用鼠标对Widget进行拖动改变位置,也可以通过方向键进行微调。
Size:在Widgets的边框拖动可以设置widget的大小。通过Widget Properties面板的“Lication+Size”里面的属性也可以设置Widget的大小。

另外可以选择多个widgets同时拖动或设置widgets的大小。

Edit Widget Style and Properties

有多种途径可以编辑widgets的风格和属性

Double-Click:双击widget是最常见的操作。譬如,双击一个“image”widget会打开一个导入图片的对话框,双击一个“droplist”会打开一个编辑下拉列表内容的对话框。
Editor toolbar:在Wireframe面板上面的工具栏里面的按钮可以编辑widget的风格,譬如字体,字体大小,字体风格,字体颜色,填充颜色,边框颜色,位置和大小等等。也可以同时选中多个widget进行分组,排序,对齐和distribute。
Formatting tab in the Widget Properties Pane:该面板用于编辑widget的风格和属性。在“location and size”分组可以编辑字体,对齐方式,外边距,样式,排序,填充,边框等等。
Context menu:在Widget上面右键单击显示Context菜单可以用于附加一些特殊的widget属性。不同的widget具有的特殊widget属性不一样。

Work with Multiple Widgets

选择多个widget元素点击右键用打开“Context menu”可以选择合并,设置显示排序(层次),对齐方式,distribute,锁住。也可以通过wireframe面板上面的工具栏进行设置。

你可以单击组内的某一widget元素进行编辑样式,这会影响到同一组内的其他widgets元素。

Radio Group and Selection Groups

可以将Radio button通过右键打开Context菜单选择“Edit Radio Button->Assign Radio Group”指定Radio Button的group属性。这样,同一组的Radio Button只能选择其中一个。

另外,“button shapes”和“images”也可以指定“Selection Group”。当“selection group”内的某一widget的状态变为“selected/选中”时,其它widget会变成默认的状态。更多详细内容...

Widget Style Editor

 

Widget样式编辑可以编辑默认的widgets样式和创建自己定风格的widgets。

打开“Widget Style Editor”:在工具栏上面找到一个带“A”的图标(一个内容为“Default”的下拉框旁边)单击即可打开面板。
编辑默认的widget风格会在全局下产生效果。当从“Widgets Pane”面板拖动一个widget到“Wireframe Pane”面版的时候,就会创建一个“Default”风格样式的Widget。
创建自定义widget风格能快速应用到统一风格的widget中。自定义的widget风格可以选择需要设置的属性覆盖Defualt的风格。

应用:在Editor工具栏上面的下拉框选择需要应用的风格。
编辑自定义风格上面的属性之后影响应用了该应用的widget。

Format Painter

 

Format Painter能够复制一个widget的属性并应用到其他的widgets当中。类似剪贴板中保存了属性。
复制:在wireframe面板选中需要复制的widget元素,点击编辑工具栏上面的“Format Painter”按钮打开Format Painter面板。打开面板之后,点击“Copy”按钮就能将元素的属性复制到剪贴板。在复制前也可以在复选框对复制的元素进行选择。

粘贴:选择其他元素,打开“Format Painter”面板,点击“Apply”按钮就可以将之前复制的元素的属性应用到当前元素当中。

在设计的时候,可以让“Format Painter”面板一直存在已让你快速进行元素属性的复制粘贴。

Change Selection Modes

在Axure RP里面有"Select Intersected Mode" 和 "Select Contained Mode"两种选择模式。按钮在编辑工具栏里面(PC版:在“Zoom Level”的右边;Mac版:在左上角处)。

Select Intersected Mode

系统默认的就是"Select Intersected Mode"模式。当用鼠标左键按住之后拖拽,在选择框内的元素(涵盖部分)就会被选中。

Select Contained Mode

"Select Contained Mode"类似Visio的选择模式,只会选择完全在选择框内的元素。

时间: 2024-11-08 19:44:40

[翻译]Axure-Build Wireframes-原型设计工具Axure学习-第1.1节的相关文章

[翻译]Axure-Dynamic Panel(Basic)-原型设计工具Axure学习-第2.1节

Hide and show with Dynamic Panel(Basic) Dynamic Panel允许你隐藏,显示,交换和移动wireframe的内容.本章节讲述dynamic panels的隐藏,显示内容的初级功能.更高级的用法请点击 Dynamic Panels(Advanced) 教程视频:下载MP4格式 Dynamic Panels Overview Dynamic Panel 部件(widget)是一堆状态或包含其他部件的图形的面板.面板可以隐藏,显示和移动.可以将当前可视图形

Axure RP 快速原型设计工具

   Axure RP是美国Axure Software Solution公司旗舰产品,是一个专业的快速原型设计工具,让负责定义需求和规格.设计功能和界面的专家能够快速创建应用软件或Web网站的线框图.流程图.原型和规格说明文档.      作为专业的原型设计工具,它能快速.高效的创建原型,同时支持多人协作设计和版本控制管理.      Axure RP已被一些大公司采用.Axure RP的使用者主要包括商业分析师.信息架构师.可用性专家.产品经理.IT咨询师.用户体验设计师.交互设计师.界面设

Axure RP一个专业的快速原型设计工具

Axure RP是一个专业的快速原型设计工具.Axure(发音:Ack-sure),代表美国Axure公司:RP则是Rapid Prototyping(快速原型)的缩写. Axure简要介绍 Axure RP已被一些大公司采用. Axure RP的使用者主要包括商业分析师.信息架构师.可用性专家.产品经理.IT咨询师.用户体验设计师.交互设计师.界面设计师等,另外,架构师.程序开发工程师也在使用Axure. Axure RP--是一个非常专业的快速原型设计的一个工具,客户提出需求,然后根据需求定

《Axure RP8产品原型设计快速上手指南》一导读

前 言 Axure RP8产品原型设计快速上手指南会Axure的不一定是产品经理,产品经理一定要会Axure. 当然这只是一句玩笑话,不会Axure的照样也可以做出.做好产品.Axure对于一个做产品的人究竟意味着什么,可能不同的人有不同的感受.这里说说我的Axure经历. 2011年在我还不知道什么是产品的时候,我对接一个网站改版的项目.刚开始我在和技术团队沟通时特别困难,我知道我要做成什么样子,但是无法描述出来,对接过程一度出现僵局.这个时候第一次在WebPPD论坛上接触到了Axure,说到

《Axure RP8产品原型设计快速上手指南》一第1章 基础界面1.1 默认界面

第1章 基础界面 Axure RP8产品原型设计快速上手指南 1.1 默认界面 在经历一个个漫长的beta版本之后,我们终于迎来了Axure RP8版本的正式发布,其LOGO从以极具扁平化的蓝色为主色调进化以紫色为主色调.Axure的每一次版本发布都是整个产品界瞩目的事件,从RP7版本刚发布我们就在畅想RP8版本的发布会有哪些变化. 从本次发布的版本来看,Axure RP8在整体UI方面更加扁平化,更加突出一些核心功能和灰度原型的精髓,添加和改善了一些功能.从本节开始我们会一点点介绍全新的Axu

分享比较热门的原型设计工具

交互设计师的一项重要工作就是进行产品原型设计(Prototype Design).而产品原型设计最基础的工作,就是画出站点的大体wireframe(框架图)并结合批注.大量的说明以及流程图等,将自己的产品原型完整而准确的表述给产品.UI.重构/开发工程师等等,并通过沟通反复修改prototype 直至最终确认,然后进入后续的设计开发流程. 要完成以上复杂的设计和沟通工作,需要一个好的原型设计工具.这里就目前常用的和比较热门的工具来分享一下:Word(产品经理比较常用)Fireworks(交互组内

干货:推荐十五款APP原型设计工具

我们知道,一款优秀的移动APP产品原型设计工具应该具备以下特点: ①.支持移动端演示(随时随地演示给BOSS,厕所&食堂&电梯-以体现我是那么的敬业--长点工资必备) ②.组件库(高效复用,谁用谁知道) ③.可以快速生成全局流程(程序猿看不懂拆解的,给丫的看这个) ④.在线协作(多个PM狗一起用) ⑤.手势操作.转场动画.交互特效-(这些都不需要,留给专业的交互.视觉,搞那么虚的不如多想想产品流程逻辑做做减法.写写xxRD啥的) 以下逐步介绍那些我们势必要折腾的原型工具们: 1. POP(

让你的设计更加高效便捷的5款原型设计工具

原型是整个产品面市之前的一个框架设计,它就好像建筑师的设计图纸一样重要,设计师可以利用它直观体现产品主要界面风格以及结构,并展示主要功能模块以及页面和组件直接的相互关系.举个例子,一个下拉菜单,通过原型设计,你可以直观地感受到每次点击或者鼠标划过时菜单如何响应.一款优秀的 原型设计 工具不仅可以提高设计师们的工作效率,也可以让他们根据客户的不同需求设计出不同版本的原型设计. Axure Axure RP是美国Axure Software Solution公司旗舰产品,它是一款专业的原型设计工具,

产品交互原型设计工具分享

交互设计师的一项重要工作就是进行产品原型设计(Prototype Design).而产品原型设计最基础的工作,就是画出站点的大体wireframe(框架图)并结合批注.大量的说明以及流程图等,将自己的产品原型完整而准确的表述给产品.UI.重构/http://www.aliyun.com/zixun/aggregation/7433.html">开发工程师等等,并通过沟通反复修改prototype直至最终确认,然后进入后续的设计开发流程. 要完成以上复杂的设计和沟通工作,需要一个好的原型设计

文档工具Dr.Explain、原型设计工具

写软件文档时,使用Dr.Explain这个工具可以事半功倍. 文档工具Dr.Explain 特点 Ø 自动抓取界面元素并标识 Ø 可导出CHM.pdf.HTML.RTF格式 Ø CHM格式的文件可以添加关键词形成索引列表 Ø 可以获取web winforms Flex等多种的界面和子元素 一键抓取界面 新建项目 抓界面:Add Window 选取窗口后软件自动获取软件的所有界面元素 在这个基础上进行组织和润色,方便了很多. 样例 Sample_Real_application_manual.gu