辉灿新闻网 原型设计 Axure 教程:注册验证

Axure 教程:注册验证

大家都知道,注册的时候有很多的验证,如何通过Axure来制作这个验证那,今天小猿就给大家演示,通过这个练习,希望大家能够掌握逻辑条件和全局变量。

我们先看一下最终的效果:

猿型库:Axure小练习-注册验证

需求分析

原型设计

(1)拖入账号输入框account,设置最大输入长度为10,设置输入提示“账号只能包含字母和数字”;

(2)拖入图片account_img和文本account_msg,并且设置为隐藏;

(3)拖入密码输入框pass,设置输入类型为密码,设置输入提示”密码为6位数字“;

(4)拖入图片pass_img和文本pass_msg,并设置为隐藏;

(5)拖入注册按钮;

(6)拖入文本reg_result,并设置为隐藏;

猿型库:Axure小练习-注册验证

(7)设置全局变量reg_pass_correct和reg_account_correct。

猿型库:Axure小练习-注册验证

交互设计

(1)设置账号输入框account的“失去焦点事件”:

猿型库:Axure小练习-注册验证

(2)设置密码输入框pass的“失去焦点事件”:

猿型库:Axure小练习-注册验证

(3)设置登录按钮的点击事件:

猿型库:Axure小练习-注册验证

到了这步,注册的功能就算做好了,同学们赶紧去试试吧。

本文由 @马白龙 原创发布于人人都是产品经理。未经许可,禁止转载

题图来自Unsplash,基于CC0协议

本文来自网络,不代表辉灿新闻网立场,转载请注明出处:https://news.jbjy8888.com/yuanxing/322.html

作者: 马龙

Axure9.0教程:通过内联框架引入echarts图表、视频

如何用Axure画出Web后台产品的顶部导航组件

发表评论

您的电子邮箱地址不会被公开。

联系我们

联系我们

暂无

在线咨询: QQ交谈

邮箱: meiliao888@163.com

工作时间:周一至周五,10:00-19:00,节假日休息。
关注微信
微信扫一扫关注我们

微信扫一扫关注我们

关注微博
返回顶部