编写目的
规范开发以及测试要求,达到项目的高质量交付,提升客户感性方面的满意度。
1界面要求
1.1 表单
⦁ 文本域应随着其中的内容增加,自动增加高度,以便将内容全部呈现出来
⦁ 表单页面中的线条要粗细一致,各临近组件间距应该合适不重叠(整体效果应美观自然,细节应多加注意、检查)
⦁ 每一行字段名,输入框需要对齐。采用中间对齐方式,字段名靠右,输入框靠左,排版需充满整个屏幕
⦁ 审批时,如无特殊情况,页面上的所有字段的内容均要展现出来,不能出现折叠或需要纵向滚动查看的情况
⦁ 移动界面上,提示框、日期选择框等组件均需显示合理,不能超出屏幕边界
⦁ 表单中的字段全部居左显示,显示效果需整体、统一
⦁ 字体、字号统一,具体根据项目要求决定
⦁ 光标的初始位置默认从最左端开始、除特殊字段要求外
⦁ 对于页面上的所有业务数据不允许有错别字,遵循功能设计文档,如有异议务必提出
⦁ 字段名称以及组件内部描述均不允许出现乱码
⦁ 各控件操作方式统一,比如时间选择框效果一样、数字输入框都有数字校验、输入法类型跟输入框类型匹配
1.2 查询面板
⦁ 查询字段要求见1.1表单部分描述
⦁ 查询条件框支持折叠,以获得更好的Table阅读效果
⦁ 查询字段排版需整齐统一,一行最多排布4个查询条件。若一行仅有3个查询条件,可将第三个条件字段所占区域拉长至2倍,以充满整行。
⦁ 查询和重置按钮需包含在查询面板框中
⦁ 在页面载入时,默认执行一次空查询条件的查询操作;在点击重置时,清空查询条件同时执行一次空查询条件的查询操作。
1.3 Table
⦁ 表头需支持点击切换排序,默认第一次点击为逻辑正序,再次点击为逻辑倒叙
⦁ 表格默认展示数据排序均以用户最近一次操作为优先原则,例如申请单据的展示按照时间的倒叙排列
⦁ 表格支持自适应表格宽度,即表格每列长度随着字符数量变多而变长。
⦁ 表格字段显示默认全部居左,整体保持整齐,切勿部分居左部分居中!
⦁ 表格应支持点击行即选中(在勾选行方形框存在的情况下,点击方框或点击该行均应能选中该行),同时支持多选(若需)。
⦁ 表格支持一个分页展示 8条/10条/20条/50条 4个层次量级的数据,默认为10条,8条用于协调页面排版。
⦁ 所有的功能按钮需排布在表格的左上方,字段超链接可放置在表格行中。针对表格行数据进行操作的功能按钮可以LOGO+文字超链接的形式放置于操作列中
1.4 弹窗
⦁ 弹窗中的字段要求见1.1表单部分描述
⦁ 所有的弹窗均需要灯箱效果,即弹窗以外的部分均被半透明暗黑色覆盖
⦁ 当弹窗大小超过整个屏幕的1/2时,置顶显示该弹窗。当弹窗大小未超过1/2时,居中显示该弹窗
⦁ 尽量不要出现3级弹窗、禁止出现4级弹窗
1.5 按钮
⦁ 首页按钮/图片放置位置一致、基本搜索返回等功能的放置样式必需是统一位置
⦁ 按钮名称规范,确认是否存在重复类似功能的比如查询/搜索、提交/上传必须统一一个名称
⦁ 选项按钮统一形状、大小、字体、字号、X、Y轴位置、颜色可以进行差异、按钮边距一致
⦁ 失效状态的组件一定有置灰或其他区别于可用状态按钮的样式
⦁ web端按钮可点击区域至少为a*a,移动端可点击区域至少为b*b,具体大小根据项目实际情况决定
⦁ 防止数据重复提交,点击按钮调用接口后,将按钮置为失效状态,防止重复调用接口
⦁ 操作按钮要有主次逻辑性。影响表单内部的按钮,至于表单区域内。影响外部逻辑的按钮置于表单区域外,整个系统的按钮排布保持统一
1.6页面风格
⦁ 不同的连接页面之间有导航。每页必需有返回首页、上一页、面包屑导航、必需有返回上级箭头;每一次的页面跳转必需有出口和入口
⦁ 界面整体颜色保持简洁,不超过4种、基本功能(按钮、表格、表单)不允许有存在色彩对比鲜明(黄蓝),错误提示鲜艳的颜色。
⦁ 控制业务内容的版面尽量占据整体页面的80%以上,让用户更好的聚焦要处理的事务本身。
⦁ 页面字段以及提示禁止出现不明朗的英文,国际化的项目除外
2数据输入要求
⦁ 下拉列表,按拼音首字母排序,选项超过10个必需启用LOV
⦁ 页面填写内容必需自动去除前后的空格,除非有特殊需求的字段
⦁ 流程查询时,查询字段是日期格式的,只需显示年月日。查询字段为日期时间格式时,则显示时分秒
⦁ 日期组件若有前后逻辑的,默认前置日期需小于后置日期;日期组件如有明显的未来逻辑,例如资产报废日期字段,则应设置为当前日期以及当前日期往后的日期
⦁ 页面所有字段长度需要控制,不应超出数据库长度,超出长度应提示系统会相应截取,不应提示系统保存失败
⦁ 当字段数值设置为由其他组件计算得出时,该值在缺省时,默认需取一个0;
⦁ 查询里面,若需要显示子表字段,子表字段的拼接分隔符号使用“|”
⦁ 业务主表的id需要创建主键约束,业务主表的instanceid需要建立unique索引,业务子表(若有)的id需要创建主键约束,业务子表(若有)中的与业务主表的关联字段(一般为主表id)要加Normal索引
3交互要求
⦁ 在表格中的输入框按回车时,不应该触发表格级的按钮(新增、删除等)
⦁ 提交时,要有必填字段的校验,不符合要求的字段需用红色标识出来
⦁ 保存时,一律不进行校验,除非客户有特定的需求
⦁ 提交时,根据某数据带出其他数据的情景时,不能出现数据不匹配的情况(例如:工号带出姓名,工号修改了,网络请求未完成就提交,就会出现工号与i姓名不匹配--建议修改了工号就清空姓名,并作姓名的必填校验)
⦁ 若有校验数据有外部接口参与校验,需外部接口返回yes后才可以通过校验,返回false或未返回时,校验不通过
⦁ 部门经理以上的领导界面上少让他们做选择,若有选择,可以根据业务情况设置一个默认值
⦁ 错误输入或暴力输入或乱敲键盘,快速重复点击某按钮时,不会导致页面崩溃
⦁ 页面返回,是否保存校验逻辑正确(已有数据输入时,提示未保存)。返回路由跳转正确,由第x页点击进入的单据详情,返回至第X页
⦁ 所有的接口不允许超过2s,页面跳转不允许超过1s
⦁ 所有的页面跳转均需要过程提示(加载中组件),相应的所有的页面操作,均需要有反馈。
⦁ 自动刷新触发条件应合理、手动刷新方式应统一下拉。
⦁ 页面跳转逻辑正确,路由正确并且流程畅度统一
⦁ 尽量减少操作次数、填写次数、键盘弹出应符合填写类型,提高系统易用性
⦁ 提示语统一、用语规范、简短易于理解
4.兼容性要求
⦁ 自适应界面设计,适配页面上的主流手机机型,如苹果、华为、三星;
⦁ 适配主流分辨率,如1920*1080、1366*768,在此分辨率下基础的表单展示均需无横向及纵向滚动条(台账类功能除外)
⦁ 适配主流浏览器,如谷歌、火狐、360、IE9+(此为B端用户常用浏览器,并且常与前端所用技术框架不兼容,测试时需要完整覆盖IE的测试)
5.移动端要求
⦁ 当客户端有新版本,有更新提示
⦁ 当版本为非强制更新时,用户可以取消更新,老版本能正常使用,用户在下次启动app时,仍出现更新提示。
⦁ 当版本为强制更新时,用户没有更新则推出客户端,下次启动app时,仍出现更新提示。
⦁ 能正常使用相机、定位服务,当定位服务未开启时,会友好性弹出是否允许开启定位提示
⦁ 使用自带相机功能是,不应出现程序崩溃,能正常使用手机图片库
⦁ 所有的页面跳转,必需有返回按钮
6. Bug严重等级定义
⦁ 一级: 系统“挂起”或“崩溃”的错误,使得整个测试工作无法继续进行,如:程序死机、死循环、非法退出、数据库死锁、程序无法登录等;
—严重bug,需立即修复;对应bugdone 等级【急】
⦁ 二级: 软件功能未按产品需求文档规定的实现,导致功能报错,其他模块测试工作无法进行,如:功能不符、接口错误等;
—比较严重的bug,根据模块关联性依次修复;对应bugdone 等级【高】
⦁ 三级: 一般性错误:如界面UI不符/错误、错误未给出弹出框提示等;
—属于一般性bug,可在优先级为1和2之后修复;对应bugdone 等级【中】
⦁ 四级: 轻微bug,如:格式排版、个别文字错误等问题;
—轻微性bug,经讨论后可决定是否在下一阶段修复;对应bugdone 等级【低】
⦁ 五级:对软件的改进建议,如:需求说明中未明确但影响用户体验等;
—针对软件改进建议可以选择修复或不修复,由产品最终决定;对应bugdone 类型【需求】
7. 其他
此规范将随着项目经验的积累渐近优化和完善,欢迎拍砖以及补充。