- 博客(19)
- 收藏
- 关注
原创 筛选项滑动切换效果、弹窗中筛选时间效果、图片平滑过渡效果、控件向不同方向翻转、进度条拖动变化效果
筛选项滑动切换效果效果:建立原型,分别命名按钮和文字2.添加热区,设置动态效果弹窗中筛选时间效果例如建立备忘录,里面设置时间闹钟等功能准备好元件素材设置动态面板,将时间文字设置为白色然后放置在动态面板“时间选择2”(自适应内容),设置交互效果在时间选择器2上添加2两个遮挡矩形框设置确认取消的交互效果将时间选择1放置在动态面板“弹窗内”添加“tomorrow”处的交互效果2.将弹窗隐藏,设置内容框上闹钟符号的交互效果
2021-07-04 00:04:33
381
原创 悬浮按钮显示与隐藏交互效果、工具栏展开收起交互效果、导航栏中切换账号效果、步骤流程切换效果
悬浮按钮显示与隐藏交互效果实现:当点击悬浮按钮时,按钮移动后以一定效果弹出选项面板,单击选项面板时原路返回。添加矩形框(当中web),置于底层,填充颜色,将工具符号转换为动态面板“悬浮按钮”,菜单为“弹出选项” 将弹出选项设置为悬浮按钮的一个状态“弹出选项”,居中,按钮为状态“工具按钮”3.在工具按钮处添加热区覆盖,点击热区,设置交互效果,使其先移动到中间,等待再以一定效果切换动态面板状态4.弹出选项的交互效果设置5.预览工具栏展开收起交互效果将要展开的内容形成组
2021-07-03 23:51:56
1331
原创 web后台—仪表盘、列表页、表单页、详情页、个人页
Web后台—仪表盘参考模板如下分析页2.监控页3.工作台Web后台—列表页模板查询表格2.标准列表3.卡片列表4.搜索列表Web后台—表单页基础表单2.分布表单3.高级表单Web后台—详情页模板基础详情页2.高级详情页3.文档详情页(接口文档、说明介绍、操作说明、知识库)Web后台-个人页基本模板个人中心2.基本设置3.安全设置4.账号绑定
2021-07-03 23:43:24
1906
2
原创 跑马灯效果、面板随鼠标滑动、图片预览、高保真的开关按钮、下载按钮点击效果反馈的介绍
跑马灯效果例如街边LED灯的循环显示。借助动态面板“循环面板”来完成LED显示屏内容的循环,动态面板至少有俩状态。 将要显示的内容命名为“文字内容”3.设置循环面板,载入时,每100ms切换一次面板状态;循环面板状态改变时:如果文字内容在右侧,则线性10秒移动到左侧;如果文字内容在左侧,则立刻移动到右侧。面板随鼠标滑动鼠标移动到一些商品图片的各个方向的时候,会从相应方向显示一些解释的内容调整图片大小,增添矩形框大小与图片一致,填充颜色,调解透明度。矩形框底部叠加小矩形框,小矩
2021-07-03 23:35:31
367
原创 发送验证码、导航栏二级菜单的展开效果、导航栏吸附效果、页面拖动效果、APP下拉刷新效果
发送验证码实现手机发送验证码,并进行倒计时,随后可重新发送验证码等功能。建立以下原型,借助动态面板来实现持续性时间倒计时,将动态面板命名为“循环面板”,里面至少俩状态。2.设置“发送验证码”按钮的交互效果并添加一个全局变量X,使动态面板每秒钟切换一次状态(橙色箭头所指条件起到启用禁用的作用,也就是当该按钮显示剩余X秒时,单击不会起作用而重新计时)3.设置动态面板的交互效果:【状态改变时】—【设置文本】,使“发送验证码”按钮的文本变为“剩余X秒”(启用条件判断,就不会倒数到负数,
2021-07-03 23:26:37
281
原创 加载效果、推动和拉动效果、筛选标签效果以及banner轮播效果
加载效果作用:延缓用户的等待时间,动态效果吸引用户的视线,减少用户等待的感知,减少其等待的焦虑。一般可利用多张图片进行切换。交互效果可设置如下:可将第一章图片分块,进页面后,等待一会儿,四个分块进行旋转,可设置两次180度旋转从而恢复原位。最后四个分块隐藏或者以一定效果撤退。推动和拉动效果作用:通过一些按钮进而显示更多的表格信息,下面部件也往后推移,或者收起部分信息,节省空间,后面部件也向上移动。方法1:使用显示和隐藏来触发推动和拉动效果设置好以下的原型,将部分的表格内容隐藏
2021-07-03 23:18:29
293
原创 Axure9.0中函数的相关介绍
元件函数的使用Axure可以实现一些很强大的动态效果,这时得使用到一些函数。元件函数是用于获取指定元件对象的信息与数据,使用方法如下:This:获取当前正在添加交互动作的元件,使用方法“[[This.函数]]”。Target:获取当前交互动作控制的目标元件,使用方法“[[Target.函数]]”。x:获取元件起始位置的X坐标值,使用方法“[[元件对象.x]]”。y:获取元件起始位置的y坐标值,使用方法“[[元件对象.y]]”。width:获取元件的宽度值,使用方法“[[元件对象.
2021-07-03 23:07:53
1233
原创 内敛框架、水平/垂直菜单
内联框架作用:内容可能是其他地方的,但是它的大小被当前内联框架的大小框死了,也可以通过一些事件来调节它的样式、尺寸和位置。框架就是可以链接到其他位置,可以链接两个主要的方向:当前原型中的页面和外部URL或者文件。链接到一个当前原型中的页面2.在P2页面放置矩形框,并右击填充乱数假文,并链接到P2浏览如下:2.链接到外部URL,例如百度预览如下:水平菜单和垂直菜单可用于网页 、一些筛选项和官网的下拉菜单等。水平菜单:可左右任意添加菜单,也可以无限级
2021-07-03 22:57:44
239
原创 中继器的相关介绍和应用
【中继器的原理】它其实是一个容器(是后台存储数据的字段),是用来承载数据的,比如说商品的一些信息:名称、价格、数量、图片等属性。作用体现如下:以商品的相关信息为例,输入以下信息:首先将作为数据写入作用的中继器命名为“商品”,作为前端表达作用的中继器命名为“商品1” 双击名称为“商品1”的中继器,先将矩形框删除,增加三个三级标题框,分布命名为名称、价格和数量。3.增加交互效果,依次增加。以名称为例,【每项加载】—【设置文本】—【添加目标】—选择目标【名称】,【值】处选择“函数”,插
2021-07-03 22:52:44
932
原创 动态面板的相关功能介绍
拖至页面双击后可添加多个页面状态,但同一时间只能看到一个页面状态,排在最上面就是第一状态。可对状态进行命名、复制或者删除若页面还有动态面板以外的元件,在编辑动态面板时,可以将其余元件隔离,以达到更好的视觉效果。快速拿出一个动态页面:1.在动态面板中剪切并在状态中删除 2.把不要的动态页面放置第一个状态,然后右击鼠标,选择【从首个状态脱离】脱离后如下:自适应功能:动态面板中有很多的内容和大小,可能当前的显示框不够大,显示不完全,则可以通过自适应使动态面板进行调...
2021-06-28 16:03:57
886
原创 文本框、图片的一些使用方法
文本框:是可以输入内容的控件。(与矩形的区别:在预览时也可以输入内容)也可在上方进行文本框的样式修改若要在文本框显示提示内容,可在右方“交互”处设置常用密码登录时,我们可以通过提交按钮或者在密码输入框按下回车键,所以可以在设置好提交按钮的交互效果后,使密码框连接提交按钮的功能设置文本框输入的字符长度:右击—【编辑最大长度】,超出设定长度的文本输不了设置文本框的输入类型:显示效果如下:图片图片可以去unsplash官网下载:https://unsplas
2021-06-28 15:50:32
369
原创 隐藏与层级、矩形的部分功能
隐藏:隐藏当前元件,但是不改变元件的层级(预览中是看不到的,可在“添加动作”处设置动画效果)层级:上层内容会遮挡下层内容(可右击鼠标后,在【顺序】中修改层级关系,但效果比较单一)建议:在“交互”中命名元件,这样在较多元件中寻找目标元件设置交互效果时比较方便若要将上述隐藏的圆形显示出来,我们可以在“按钮”处设置交互效果,使其显示或者置于顶层。“显示/隐藏”的效果如下,可设置相应的动画效果层级变换的效果如下矩形基本特性:可双击进行文字编辑(文字进行样式修改)、填充
2021-06-28 15:44:32
155
原创 局部变量和全局变量
局部变量:调用其他元件的参数,只在当前取值页面中使用。以计算商品总价(需要调用到商品价格和数量的信息)为例,构建下列模型1.在“提交”按钮处设置交互效果【单击时】—【设置文本】—【目标】选取我们期望得到的“商品总价”,在【值】处我们可以设置局部变量,并调用相关函数。2.【发布】—【预览】,输入价格和数量,点击提交后即可得到总价。 全局变量:设置一个全局变量,可能在当前原型文件中多次使用,可以跨页面传参。 想获取前一个页面计算出来的商品总价,这时便需要设...
2021-06-25 15:52:32
166
原创 条件判断的使用
当同一个按键需要同时表达多个效果时,可以使用条件判断。 例如手机输入时,点击屏幕后显示键盘,再次点击屏幕后,键盘退下。点击“输入”设置交互效果,【单击时】—【显示/隐藏】—选择“键盘”元件—设置相应变换效果。 设置【添加情形】3.再次【添加情形】—【添加动作】,使整个判断为完整句式if...else...4.通过【发布】—【预览】,点击屏幕中的【输入】,即可看到相应效果。...
2021-06-25 15:41:56
170
原创 交互效果的制作
1.将人形图像先隐藏,并在交互页面命名为“人”【设置交互效果】在“拍照”处设置交互效果,【单击时】—【显示/隐藏】—设置相应的动画效果预览效果如下 同时也可在“人形”处设置交互效果,显示撤退的效果 在“拍照”显示处人像后,点击人像,人像撤退...
2021-06-25 15:37:12
240
原创 制作元件交互样式
交互样式:1.鼠标按下 2.元件选中 3.元件禁用(可用于一些有条件的情况,如符合A时,不能选B,B则禁用) 4.获取焦点可用通过改变一些静态样式,比如当前元件的背景、字体颜色等,增强视觉效果。 以选中元件为例,【单击时】—【设置选中】—【当前元件】,使其结果为真,确认。修改相应样式,并进行预览。预览与单击时 若同时有三个元件,并要求只显示当时按下元件效果(先前按下的元件效果取消),则可...
2021-06-25 15:29:54
198
原创 使用SVG格式的图片
1.在阿里巴巴矢量图标库中选取适宜的图片并下载网址:https://www.iconfont.cn/可修改颜色和大小,然后建议以SVG格式下载将下载好的图片,拉到页面2.若需要将图标修改颜色,则【右击】图标,【变换图片】—【转换SVG图片为形状】,在上方【填充】处修改颜色。3.使用Chrome浏览器,在【菜单】—【更多工具】—【拓展】中安装相应插件Axhub Icons再打开阿里巴巴矢量图标库网址,可以直接复制图标,不用下载。...
2021-06-25 15:18:42
382
原创 原型预览的方法
1.【文件】—【导出所有页面为图片】缺点:若有很多张图片或者动图时,预览效果较差2.F6【预览选项】选择适合的浏览器、F5直接预览3.F8生成原型页面到本地文件夹中,并打开start. html文件(生成到本地文件夹时,建议建立一个单独的文件夹存放管理)一般使用谷歌浏览器打开,需要在浏览器的【菜单】—【更多工具】—【拓展】中安装相应插件。或者直接在Axure9.0中打开4.发布到Axure share上,生成链接(若有进行改动,Axure shar
2021-06-25 15:13:59
382
原创 Axure9.0元件库的使用
1.使用:将元件库里的原件拖曳到页面即可可以在画布上方或者右方的【样式】中对图形进行相应的调整若【样式】没有显示在页面,可以在【视图】—【功能区】中恢复。若要对图形进行成比例的缩小或放大,可将锁定宽高比例2.添加新的元件库将下载的文件库添加到Axure9.0的根目录—【DefaultSettings】—【Libraries】中,然后重新启动,即可在左下角【元件】处看到。3.设计新的元件库左上方【文件】—【新建文件库】修改元件库名称,添加新的元件,修改元件名称使
2021-06-25 15:05:35
1039
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人