定义
表单页主要负责数据采集功能,是用于信息添加、录入的页面类型。用户可按照要求录入信息提交给系统使用或引导用户进行应用设置。是通过信息组织形式和录入组件的使用,使用户快速完成录入行为。
根据形式区分,表单页可以分为以下5类:
设计目标
帮助用户更高效的录入信息
布局结构
表单是基于动态页面的平面布局。除了应用导航和页签区域外,还包含以下区域: 1、工具栏操作区域 用于放置操作按钮,常见的有保存 、审核、打印、选源单、翻页等操作。按钮根据重要程度及操作频次从左到右排序,视觉样式上仅有一个突出的主按钮,其他均为次级按钮样式。 2、表单录入区 可以承载不同形式的录入内容,包括字段录入、表格分录、添加附件、富文本、选择项等多种录入形式的内容。 |
分类及用法
1.基础表单
基础表单是一种常见的录入形式、通过录入内容的分层展示,可完成大部分录入操作 特点: 灵活运用折叠面板的组合构建的页面,形式多样的折叠面板可以直观快速的分解录入事务。 |
2.向导式表单
当用户需要分步处理大量复杂的录入进程时,需要呈现明确的步骤关系,就需要使用向导式录入。 当单据支持按规则进行批量录入和智能填充信息时,规则设置及自动生成的录入信息的展示可使用。 特点: 可解决大型、复杂的任务 通过任务分割,可以降低出错率。 以减轻用户输入负担。每部分内容单独处理,最终一起完成提交 |
3.锚点式表单
当录入信息量较大时,且过程中需要感知当前位置或进度时,或需要联系上下文时,可以使用锚点式表单形式。 特点: 可分层进行时,能感知当前位置,操作者可跳转定位到页面指定位置 |
4.模版预览式表单
当需要实时查看录入结果呈现时候,就需要模版预览式表单,通过对右侧预置或自定义信息的选用或修改,让用户感知操作的前后变化。 特点: 可视化呈现最终结果,所见即所得。 |
5.横向页签表单
当录入内容有多层级的分组时,第一层级的内容划分使用横向页签的形式 特点: 每一页签下的录入内容结构可不一致 考虑页面紧凑布局,使用格子页签,与工具栏按钮同一行 |
典型折叠面板详述
基础字段面板
主要由基础输入框、选择框、开关项构成,也可以包含复选框及图片 布局规则: 1.输入框、选择框、开关项的标题与内容使用垂直标签的模式。将折叠面板分为6等分栅格,每一个字段宽度为1个或多个完整的栅格 2.若含复选框项,复选框项单起一行,依次排列 3.若含图片项,图片控件居右,占1个栅格的宽度,其余字段在剩余5个栅格中排列 |
分录表格面板
常用的多维度信息录入的方式 可在表格下方添加关联操作行 布局规则: 1.若含辅助操作,则操作按钮位于表格右上方 2.若含关联操作内容,内容靠左对齐 |
摘要卡片面板
信息成组进行录入 纵向摘要卡片主要适用于卡片数量较多,每组录入项较少的情况 横向摘要卡片主要适用于卡片数量较少(建议4个以内),每组录入项较多的情况 |
含联动控制的面板
通过单选/复选/开关的联动控制,关联不同的录入内容 布局规则: 1.当关联的录入内容体量较小,则跟随控制组件的右侧,紧凑布局 2.当关联的录入内容体量较大,则在控制组件的下方,若含表格分录,表格两端封闭,宽度不拉通 |
附件面板
当用户需要将一些文件进行存档,或发布给其他角色查看时 |
整单关键数据汇总面板
固定冻结在页面底部,对整单中需要突出的关键汇总数据进行显示,一般为金额相关的数据 |
推荐阅读