Axure RP 8 入门手册 – 第7章

第7章母版管理第1节母版简介第2节添加/编辑/删除第3节添加母版到页面中第4节从页面中移除母版第5节拖放行为第6节自定义触发事件第7章母版管理第1节母版简介圆儿:小楼欧巴!小楼:圆圆好!圆儿:老师,我就一个圆!小楼:可是我喜欢两个圆啊!圆儿:老师…你正经一点儿好不好嘛!小楼:呃……你想问什么?圆儿:我想问,在做很多个页面的时候,如果每个页面中都有相同的内容,有没有办法不用每个页面都做一次?当然,我知道能够复制粘贴,但是,如果将来再发生改...

7         母版管理

1         母版简介

2         添加/编辑/删除

3         添加母版到页面中

4         从页面中移除母版

5         拖放行为

6         自定义触发事件

7         母版管理

1          母版简介

圆儿:小楼欧巴!

小楼:圆圆好!

圆儿:老师,我就一个圆!

小楼:可是我喜欢两个圆啊!

圆儿:老师…你正经一点儿好不好嘛!

小楼:呃……你想问什么?

圆儿:我想问,在做很多个页面的时候,如果每个页面中都有相同的内容,有没有办法不用每个页面都做一次?当然,我知道能够复制粘贴,但是,如果将来再发生改动的话,还是每个页面中都要再修改一次。太麻烦啦!

小楼:这个简单呀!我来告诉你,怎么弄一次,以后都很爽!

Axure中可以通过母版解决多个页面中重复内容的编辑问题。就像PPT中的母版一样,只需要把每个页面中都有的内容在母版中编辑完毕,然后添加到相应的页面中。当页面中添加了母版的内容时,如果母版中的内容发生了改变,页面中的内容也会同步改变。

2          添加/编辑/删除

我们先来看一下母版的基础操作:新建、编辑与删除。(图7-1

Axure RP 8 入门手册 – 第7章

(图7-1

新建

点击面板中的新建按钮或者点击面板空白处按快捷键<Ctrl+回车键>完成母版的创建。

编辑

创建后可以对母版名称进行编辑,双击母版名称,画布则变成母版的编辑区域。母版画布中可以像组织页面内容一样,放入元件、添加交互等组成模板的内容。

删除:

如果需要删除一个母版,需要先将母版从所有关联的页面中移除,才可以删除母版。被删除的母版有下级母版时,下级母版将被同时删除。如果需要查看母版被添加到哪些页面中,可以在母版名称上点击【鼠标右键】,在菜单中选择【使用情况】进行查看。

3          添加母版到页面中

在母版名称上单击<鼠标右键>,打开右键菜单,在菜单列表中点击选项【添加到页面中】,在弹出的窗口中,可以指定将母版放到哪些页面中使用。指定页面的时候软件提供了一些快捷功能给我们使用。(图7-2

Axure RP 8 入门手册 – 第7章

(图7-2

4          从页面中移除母版

如果页面上不再需要某个母版,或者将某个母版添加到了无需添加该母版的页面中,我们可以通过在母版名称上点击<鼠标右键>,打开右键菜单,选择【从页面中移除】,在打开的页面中选择要移除的页面后,点击【确定】即可完成移除。(图7-3

Axure RP 8 入门手册 – 第7章

(图7-3

另外,也可以在页面中,点击母版将其选中,然后按下<Delete>键其删除。

5          拖放行为

圆儿:小楼欧巴,像一些网站的底部信息,每个页面中也都相同,这种内容可以做成母版使用吗?

小楼:可以呀!

圆儿:但是,我刚刚试了一下。因为页面长度都不一样,底部信息的母版添加到页面时只能一个一个添加,还要指定添加后的位置,好麻烦!

小楼:你有没有脱一下试试?。

圆儿:脱……

小楼:拖……这该死的输入法!

母版除了使用前面的方法添加到页面中,还可以通过点住母版名称拖放到画布中的方式添加到某个页面中。而且为了满足不同情况的需要,软件提供了三种拖放方式。拖放方式的选择可以通过在母版名称上点击<鼠标右键>,打开右键菜单,在【拖放行为】的二级菜单中进行选择。(图7-4

Axure RP 8 入门手册 – 第7章

(图7-4

任意位置

允许将母版内容放入画布中的任意位置上摆放。

固定位置

母版内容放入到画布中并松开鼠标后,母版内容会自动放置到画布中的固定位置上,这个位置与母版中该内容所在的位置一致。

脱离母版

允许将母版内容放入画布中的任意位置上摆放。但是,当拖放结束后,这些内容与母版脱离联系,变成普通元件存在于画布中。母版进行编辑发生改变时,这些内容不会同步发生变化。

6          自定义触发事件

圆儿:这样果然很方便!但是还有个问题。母版中的内容,包括交互都是可以重用在任何页面上,并且与母版保持一致。但是,假如母版中有一个按钮,我需要在不同的页面中,点击这个按钮时,显示不同的内容。需要怎么做呢?

小楼:我没太听懂,你举个例子说一下。

圆儿:比如说啊! AB两个页面中添加了同一个母版,母版中有一个在线客服的按钮。在A页面中,鼠标进入这个按钮时显示客服小张的头像,而在B页面中,鼠标进入这个按钮时则显示客服小李的头像。

小楼:嗯,这么说我就明白了。我也给你举个例子。我们家里用电,如果只有一个供电总线,那么开关供电总线的电闸会影响家中所有的供电。但是,我们希望每个房间的供电都能单独控制,所以,需要安装一个设备叫“配电箱”,通过配电箱就可以对每个房间的供电进行单独管理,不会互相影响。在Axure中,母版中的每个触发事件添加交互都像供电总线,影响所有使用了这个母版页面。如果在添加了母版的页面上给母版中的某个触发事件单独添加交互,这就需要我们给母版中的这个触发事件接上一个“配电箱”,这个“配电箱”的名字叫“自定义触发事件”。

案例13:母版的自定义触发事件

创建一个母版,命名为“OnlineService”。(图7-5

Axure RP 8 入门手册 – 第7章

(图7-5

双击母版名称,在画布中打开母版的编辑区域,然后,添加母版中的内容,一个矩形按钮和用于显示头像的图片。因为在鼠标进入按钮时,需要添加交互改变头像图片,所以我们需要为图片元件命名为“CallCenter”;(图7-6

Axure RP 8 入门手册 – 第7章

(图7-6

2、创建一个自定义的触发事件,就如同需要购买一个配电箱。

创建自定义触发事件,需要先双击母版名称,打开母版的编辑区域。然后,在导航菜单中,点击菜单项【布局】,选择列表中的最后一项【管理母版触发事件】中进行创建。本案例中,需要对按钮元件的【鼠标移入时】事件进行不同页面的交互设置,就可以点击【+】添加一个自定义的触发事件名称,比如:“MyMouseMove”。(图7-7

Axure RP 8 入门手册 – 第7章

 (图7-7

注意:只有画布中编辑母版的内容时,才能在导航菜单中打开【管理母版触发事件】的选项。否则,该选项为灰色的禁用状态。

将母版中的触发事件与自定义触发事件绑定,就像将供电总线接入配电箱。

为按钮元件的【鼠标移入时】事件添加交互,【添加用例】,并设置动作为选择【引发事件】为“MyMouseMove”。(图7-8

Axure RP 8 入门手册 – 第7章

 (图7-8

为每个页面的按钮元件分别添加不同的动作。

将母版添加到PageAPageB两个页面中。在添加了母版的页面中点中母版,则会在交互的功能界面中出现这个母版中绑定的所有自定义触发事件,就像从配电箱中接出的分线。(图7-9

Axure RP 8 入门手册 – 第7章

(图7-9

页面PageA

为自定义触发事件“MyMouseMove”,添加用例设置动作为【设置图片】于图片元件“CallCenter”,为客服小张的头像。(图7-10

Axure RP 8 入门手册 – 第7章

(图7-10

然后,继续设置动作【显示】图片元件“CallCenter”,【更多选项】中选择“弹出效果”。弹出效果能够让鼠标离开时,显示出来的图片元件“CallCenter”再自动恢复隐藏状态。(图7-11

Axure RP 8 入门手册 – 第7章

(图7-11

页面PageB

为自定义触发事件“MyMouseMove”,添加用例设置动作为【设置图片】于元件“CallCenter”,为客服小李的头像。(参考图7-10

然后,继续设置动作【显示】图片元件“CallCenter”,【更多选项】中选择“弹出效果”。(参考图7-11

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/36696/

(0)
交互精选交互精选
上一篇 2018-04-25
下一篇 2018-04-25

相关推荐

  • 交互设计精髓-阅读心得1

    学习交互设计,选择第一本读的书是《交互设计精髓 About face 4》,因为这本书在交互设计领域名气很大该书一共分为3个部分,一共有21章。最近刚刚读完第一部分,有所感悟,在此记下,与尔分享之。交互设计就是站在用户的角度看问题永远为别人着想,心中装着别人,站在用户的角度看问题....读罢本书,这是关于交互设计在心中停留的第一印象。由于交互所设计的是产品与用户接触相处的整个行为过程,所以用户的感受首当其冲成为检验设计的重中之重。可是我...

    2018-04-28
  • seeds对话未来丨李斌:重新定义用户体验

    对话未来丨seeds系列分享会seeds, 由蔚来原创打造,是一个分享有趣观点、新知与灵感的讲堂,它寓意着每一个思想的火花都像一颗种子,被灵感浇灌后,汇成大树。2015年3月seeds诞生,从一个面向蔚来全球员工的内部讲演平台,发展到不断吸引各行各业的主讲人,并且在蔚来App公开直播的产品。到目前为止,seeds 已举办了13场演讲。今年,seeds会走进我们各个城市的蔚来中心,成为常设活动。我们也欢迎各位用户成为seeds的主讲人。4...

    2018-05-03
  • 用户体验进一步提升!微信官方将优化小程序授权

    序多多小程序无需开发,轻松上手,小程序极速免费生成!十分完美的事物中在这个世界上是不存在的,每个事物需在近乎完美的道路上苛求自己,不断完善。小程序亦是如此,它是互联网时代进步的产物,被互联网大佬们追逐,被用户用完即走。但它也有被人诟病的地方,即会在用户首次启动时直接要求授权,甚至有的小程序会出现若用户不授权,小程序将会出现异常,或进入死循环的情况。相信很多用户都遇到过不授权便会出现死循环的小程序,最后只能退出微信重新进入,造成用户体验很...

    2018-04-21
  • 交互设计、视觉设计 | 专业、课程大起底,

    dadsadsadasdsadsMulticultural epicenters for arts, culture, design, and business.是什么原因让你对设计感兴趣?是爱吗?是责任吗?都不是!是因为当年某个app的UI设计让你眼前一亮然后就欲罢不能!于是确认过眼神,我遇见了最爱的专业。想为之奋斗一生。于是就这么愉快的决定了 在设计这条不归路上愈行愈远。纠结了许久,等到开始准备作品集时却分不清什么是视觉设计或是交互...

    2018-03-29
  • 气定神闲的珍珠

    快快点击关注人言风华绝代太难得,然而,一个人终日沉浸在王者农药里碌碌无为,几时能被时光打磨成气定神闲的珍珠?但,珍珠是天然的馈赠,美,则是一种修炼。这世界上的一切精致动人,都是狠狠的被修理出来的。软了不行,硬了也不行,得软硬兼施。就像选专业一样。就像选择计算机软件技术专业一样。你想让自己活得精致,过得洒脱,不对自己狠一点,社会对你狠一点。自己的狠,是由内而外的质变。社会的狠,是苟且偷生。自己的狠,是内软外硬,由环境的硬塑造内心你的软,打...

    2018-03-15
  • 用户体验很重要,外卖小票了解一下

    失恋了,今天很丧,老板给我画一个小猪佩奇好吗?这个要求是四川资阳的一个女孩子点外卖时,在订单上给店主留的言。没有想到,店主竟然答应了。1当顾客在向外卖商家提需求时他们究竟要的是什么?不久前,一个在外卖小票上画画的帖子在网上刷了屏。原来,四川资阳一女子失恋点外卖要求画小猪佩奇,店主竟然答应了。据店主回忆,“大概在下午4点的时候,店里接到订单,在备注栏中,顾客称‘失恋了,今天很丧,老板给我画一个小猪佩奇好吗?’ ”为了安慰失恋的顾客,王女士...

    2018-03-26
  • 用户体验设计影响力引起两会代表关注,获业界点赞!

    如今,用户体验设计已成为社会广泛关注的话题,在今年两会上,用户体验设计的影响力也引起了两会代表关注。在今年的两会期间,全国政协委员叶友达向大会提交了《关于鼓励基于用户体验的设计创新,加速科技创新成果转化的提案》。设计创新与科技创新互为表里,需要协同发展;从国家层面启动基于用户体验的设计创新倡议,构建用户体验设计创新战略和行动纲领。用户体验是指用户基于对产品、系统、服务使用或者预期使用的态度和反馈。叶友达解释:“说白了,就是我们在产品的设...

    2018-03-20
  • 设计神器Figma出马!Sketch、PS有些慌了,因为...

    这年头真的是“长江后浪推前浪,一浪更比一浪强”,许多新产品、新工具纷纷冒出头来,就拿我们设计师的设计工具来说吧,Photoshop 算是一名老将了,它也是我们走上设计不归路的第一个敲门砖(当然还有 CDR);被 PS 折磨的要死要活的时候 Sketch 和 Affinity 杀了出来,一个是专攻用户界面的矢量设计,另一个则像是加强版的 PS 和 AI;Sketch 和 Affinity 还没用熟又冒出个 Figma:说出来你可能不相信,...

    2018-04-17
  • 用户体验提升才是“蔚来”

    nEqual 是业界领先的赋能“智慧商业”的数据智能技术提供商,是精硕科技集团下专注数据技术的事业部。nEqual以数据和技术为支撑,为企业实现营销自动化、智能新零售、AI人工智能等“智慧商业”模式打造和运营,帮助企业提升营销体验、销售体验及服务体验等全面的超级用户体验,进而助力企业构建可持续发展的商业竞争力。近年来,人工智能迅速占领大家视野,虽然业界已经探索了几十年,但近五年来才开始飞速发展,这得益于数据和技术的进步。近日,朋友圈被蔚...

    2018-01-30
  • 互联网产品经理常用工具有哪些?

    互联网产品经理的工作是复杂和多样的,PM们通常要负责产品各方面的事务,因此工作中需要用到的工具有很多,现在就跟这笔者一起来看看互联网产品经理常用工具有哪些,想走产品经理路线的同学可以提前了解一下。一、产品经理的主要工作"工欲善其事,必先利其器!"既然是"善其事",关键就是搞明白产品经理相关的工作内容,针对工作合理有效的利用软件,才能达到事半功倍的效果。要说到产品经理的职能,这是另开新篇的话题,这里我们先通俗概括一下PM的主要活动:1、参...

    2018-03-13