Axure情形&动作篇(ERP登录效验)

目录

一、ERP系统用户登录效验

1.1 完成步骤

1.2 最终效果

二、省市区联动

三、ERP菜单栏页面跳转

四、下拉加载效果实现

4.1 加载动画实现步骤

4.2 下划界面加载实现

4.3 最终效果


一、ERP系统用户登录效验

1.1 完成步骤

首先搭建ERP系统的登录界面(输入框和登录按钮等),如下:

然后有了界面之后添加一个错误提示框(当用户名或密码输入错误时,该提示框会弹出进行报错提示),如下:

Axure情形&动作篇(ERP登录效验)_第1张图片

然后将其设置为隐藏,如下:

Axure情形&动作篇(ERP登录效验)_第2张图片

设置后的效果:

Axure情形&动作篇(ERP登录效验)_第3张图片

用户名输入框和密码输入框设置表单提示属性,如下: 

Axure情形&动作篇(ERP登录效验)_第4张图片

设置提示文本,隐藏提示条件以及提交按钮,如下:

Axure情形&动作篇(ERP登录效验)_第5张图片

Axure情形&动作篇(ERP登录效验)_第6张图片

最后给登录按钮设置新的交互以及情形跟动作,如下:

Axure情形&动作篇(ERP登录效验)_第7张图片

1.2 最终效果

最终展示效果如下:

二、省市区联动

Axure情形&动作篇(ERP登录效验)_第8张图片

三、ERP菜单栏页面跳转

Axure情形&动作篇(ERP登录效验)_第9张图片

四、下拉加载效果实现

4.1 加载动画实现步骤

实现思路:

首先我们需要有一个下拉加载的背景页面,然后在此页面上,设置一个加载动画并且隐藏,当鼠标下划时,加载动画显现1.5秒(自定义),这个时间段一过就把动画隐藏。

加载动画设置:

首先拖入加载中的静态图标,如下:

Axure情形&动作篇(ERP登录效验)_第10张图片

然后为图标设置交互,让它旋转起来,交互情形如下:

Axure情形&动作篇(ERP登录效验)_第11张图片

4.2 下划界面加载实现

最后,设置在页面上下拉触发加载动画显现的效果,如下:

Axure情形&动作篇(ERP登录效验)_第12张图片

4.3 最终效果

最终效果如下:

Axure情形&动作篇(ERP登录效验)_第13张图片


最后Axure动态面板的应用与ERP系统登录界面、主页左侧菜单栏、公告栏的绘制就到这里,祝大家在学产品的路上一路通畅!

感谢大家的观看 !

Axure情形&动作篇(ERP登录效验)_第14张图片

你可能感兴趣的:(axure,笔记,产品经理,开源软件,photoshop)