Axure原型模板 | Axure组件库 | Axure元件库 | Axure大数据可视化 | Axure大屏原型模板专业的交互原型素材原创分享平台

专业的交互原型素材原创分享平台

 关闭页面

 返回首页



关于手册



咨询



关注

 关于组件交互规范手册

 关闭

由于部分组件的交互效果无法在Axure中无法完美实现，例如：业务选择器、日期选择器、上传控件、树型组件等，所以本作品中的相关组件仅以静态的方式呈现，本手册对相关组件的交互方式和对应状态进行了详细说明，可以为开发人员提供参考。

即使在本作品中相关组件提供了带动态交互效果的版本，但是在实际设计时，如果没有特别的要求，为了提升输出效率我们仍然建议使用静态示例加标注的方式代替动态组件，特别是对于一些涉及大量表单和信息展示的系统类中后台系统，这样可以节约大量的时间成本。

对于形式复杂或字段较多的表单验证及反馈效果同样不建议在原型中实现，相关反馈提示可以以标注的方式进行说明，本手册中也提供了关于表单验证反馈的示例。

本手册可以应用于任何的WEB类项目原型，在实际应用可以根据业务需要完善手册中的相关内容。AxureUX一直在探索如何在保证输出效率和规范化的同时，追求最佳的原型表现方法，如果大家有更多关于这方面的建议，欢迎通过网站的相关渠道向我们进行反馈。

1

2

3

4

WEB端通用组件交互规范手册

录入组件

常用选择器 Picker

日期选择器 Date Picker

上传组件 Upload

标注规范 Specification

业务选择器 Service Picker

常用按钮 Buttons

常用表格 Table

时间选择器 Time Picker

下拉选择器 Select

进度条 Progress

输入框类 Input

穿梭框 Transfer

下拉菜单 Drop Down

表单验证 Form Validation

常用分页 Pagination

树型控件 Tree

对话框/弹框 Modal

通知提醒 Notification

颜色选择器 Color Picker

常用组件

常用日历 Calendar

标注规范

日期和时间 Date & Time

异常提示 Exception

应用说明：

1、输入框表单验证有失去焦点时验证和点击提交按钮时验证两种方式，请根据场景选择验证方式；

2、以上提供了几种常见的表单组件验证反馈的状态示例：验证成功、验证错误、验证为空；

3、为了提升输出效率，对于形式复杂或字段较多的表单验证及反馈效果不建议在原型中实现，相关反馈提示可以以标注的方式进行说明;

4、我们提供了关于规则标注的方式作为参考，点击这里进行查看；

表单验证（Form Validation）

状态示例

▋ 验证及反馈

以下是两种表单验证和反馈的交互演示效果，包含输入框的为空、错误、成功等状态反馈。

交互演示

账号名称:

登录密码:

重复密码:

手机号码:

提交

重置

1、输入框失去焦点时验证和反馈信息

2、点击提交按钮时验证和反馈信息

账号名称:

登录密码:

重复密码:

手机号码:

提交

重置

Windir



Windir



Windir



Windir



Windir



请输入用户名称



请选择用户类型





 勾选同意《用户服务协议》

 用户名首位必须为字母

 用户名必须为6至20位字母或字母+数字组合

 请选择用户类型

 注册时必须勾选同意协议



 用户名不能为空

 该用户名已被占用

 正在验证用户名

验证状态:

验证成功:

验证错误:

验证为空: