# 如何设计高频任务
明确整体框架和页面布局后,根据业务场景,对相关任务流程进行设计。
中后台产品虽服务不同业务,但存在非常同质化的高频任务,掌握这些任务的设计方法,可有效提高中后台的交互体验。
# 一、数据筛选与查询
按所需条件或类型选择需要的数据项、或查询数据结果的任务。常应用于「表格页」。
# 立即生效
何时使用:当数据查询范围较为随机,用户需要反复、多次修改条件时,可实时显示筛选结果,来提高查询效率。 核心流程:条件选择 - 获得结果数据 -条件修改 - 获得结果数据 相关组件:时间选择器 、日期选择器 、输入框 、选择器 、按钮 、表格等数据录入控件
# 折叠条件
何时使用:当筛选项过多,全部显示会增加用户信息识别效率,可只显示高频选项,其他选项折叠,需要时自定义展开。 核心流程:展开条件 - 条件选择 - 获得结果数据 相关组件:时间选择器 、日期选择器 、输入框 、选择器 、按钮 、表格等数据录入控件
# 条件模版保存与调用
何时使用:当用户的筛选需求个性化较强,需要根据自身需要使用筛选项时,提供可自定义保存的筛选器。 核心流程:条件选择 - 保存为模版 -模版调用 相关组件:时间选择器 、日期选择器 、输入框 、选择器 、按钮 、表格等数据录入控件
# 二、表格批量操作
对报表中的多项数据进行统一操作的任务。常应用于「表格页」。
# 所见即所得
何时使用:当批量操作按钮为主要或高频操作时,无论是否已选择数据,均在页面给用户见即所得的操作预期。 核心流程:选择要操作的内容 - 进行操作 - 显示操作结果 相关组件:表格、按钮、多选框、下拉菜单、全局提示等
# 选择后触发
何时使用:当页面已有主要按钮,批量操作为次级或非高频操作时,可在选择数据后显示操作区。 核心流程:选择要操作的内容 - 进行操作 - 显示操作结果 相关组件:下拉框 、多选框 、输入框 、选择器 、按钮等 、表格
# 三、数据导入
将本地数据导入到中后台系统中的任务。常应用于「表格页」。
# 逐个文件导入
何时使用:当需要轻量快速导入数据并显示结果、或待导入的数据格式较集中时,可逐个快速导入。 核心流程:触发导入 - 选择要导入的一个文件 - 收到导入结果 相关组件:按钮、上传、全局提示、表格、列表、文字提示等
# 批量文件导入
何时使用:当待导入的数据较复杂、或数据文件有多个,可批量上传后,再导入需要的数据。 核心流程:触发导入 - 选择上传的多个文件 - 批量上传 - 确认批量文件的上传结果 相关组件:按钮、上传、全局提示、表格、列表、对话框等
# 四、状态流转
在使用某条数据项的过程中,对该项数据的状态进行调整或变化的任务。常应用于「表格页 」「 详情页 」。
# 通过详情进行状态流转
何时使用:当单条信息内容较多或较复杂时,需要用户查看信息详情、明确详情内容内容后,再进行状态流转决策。 核心流程:在列表中选定数据项 - 查看数据详情 - 选择要流转的状态 - 确定流转 - 显示流转结果 相关组件:步骤条、表格、表单、下拉菜单、按钮等
# 五、任务引导
当用户需要完成某个任务或使用某项功能时,为用户提供必要的指导或说明的任务。常应用于「表单页 」「详情页 」。
# 任务开始引导
何时使用:当任务较复杂、或任务执行前需做必要准备时,给用户相关引导或提示。 核心流程:步骤引导 - 查看引导内容 - 按引导执行任务 - 操作结果提示 相关组件:文字提示、对话框、步骤条、卡片、按钮 等