CN111045924B - 用户界面视觉验收的处理方法、装置及设备 - Google Patents

用户界面视觉验收的处理方法、装置及设备 Download PDF

Info

Publication number
CN111045924B
CN111045924B CN201911055650.5A CN201911055650A CN111045924B CN 111045924 B CN111045924 B CN 111045924B CN 201911055650 A CN201911055650 A CN 201911055650A CN 111045924 B CN111045924 B CN 111045924B
Authority
CN
China
Prior art keywords
acceptance
information
standard
attribute
elements
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201911055650.5A
Other languages
English (en)
Other versions
CN111045924A (zh
Inventor
苗森
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Koubei Shanghai Information Technology Co Ltd
Original Assignee
Koubei Shanghai Information Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Koubei Shanghai Information Technology Co Ltd filed Critical Koubei Shanghai Information Technology Co Ltd
Priority to CN201911055650.5A priority Critical patent/CN111045924B/zh
Publication of CN111045924A publication Critical patent/CN111045924A/zh
Application granted granted Critical
Publication of CN111045924B publication Critical patent/CN111045924B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F11/00Error detection; Error correction; Monitoring
    • G06F11/36Preventing errors by testing or debugging software
    • G06F11/3604Software analysis for verifying properties of programs

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Computer Hardware Design (AREA)
  • Quality & Reliability (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请公开了一种用户界面视觉验收的处理方法、装置及设备,涉及信息处理技术领域,可节省人工验收成本,可提高UI视觉验收的效率和准确性。其中方法包括:首先获取目标软件待验收节点对应上传的UI效果图,以及获取与所述待验收节点对应预先设定的UI视觉验收规范;然后将所述UI效果图与所述UI视觉验收规范进行匹配分析,得到所述待验收节点对应的UI视觉验收结果。本申请适用于用户界面视觉验收的处理。

Description

用户界面视觉验收的处理方法、装置及设备
技术领域
本申请涉及信息处理技术领域,尤其是涉及到一种用户界面视觉验收的处理方法、装置及设备。
背景技术
用户界面(User Interface,UI)视觉,指的是由UI设计师根据软件设计模型设计的UI最终视觉规范效果图。
目前,在软件开发完成后,需要UI设计师人工进行最终的UI视觉验收,具体是根据软件开发工程师开发的实际效果图进行人工查找判别,找出软件中UI视觉不规范的地方。
然而,通过这种人工验收方式,验收工作量大,会增加人工成本以及增加UI视觉验收的时长,影响UI视觉验收的效率。并且人工验收方式难免会存在遗漏,进而也会影响UI视觉验收的准确性。
发明内容
有鉴于此,本申请提供了一种用户界面视觉验收的处理方法、装置及设备,主要目的在于解决目前UI视觉验收多采用人工验收方式,会影响UI视觉验收的效率和准确性、以及会增加人工成本的技术问题。
根据本申请的一个方面,提供了一种用户界面视觉验收的处理方法,该方法包括:
获取目标软件待验收节点对应上传的UI效果图,以及获取与所述待验收节点对应预先设定的UI视觉验收规范;
将所述UI效果图与所述UI视觉验收规范进行匹配分析,得到所述待验收节点对应的UI视觉验收结果。
可选的,所述将所述UI效果图与所述UI视觉验收规范进行匹配分析,具体包括:
识别所述UI效果图中的各个元素以及所述各个元素的属性信息;
确定所述各个元素以及所述各个元素的属性信息是否符合验收标准条件。
可选的,确定所述各个元素是否符合验收标准条件,具体包括:
检测所述UI效果图中是否缺少原设计元素和增加额外元素;
若缺少原设计元素、或增加额外元素,则确定不符合所述验收标准条件。
可选的,确定所述各个元素的属性信息是否符合验收标准条件,具体包括:
检测所述各个元素的属性信息是否符合各自对应的验收标准;
若存在不符合对应验收标准的元素,则确定不符合所述验收标准条件。
可选的,所述属性信息至少包括:颜色信息、形状尺寸信息、与其他元素之间的间距信息、透明度信息、背景色信息中的一个或多个;
检测目标元素的属性信息是否符合与所述目标元素对应的验收标准,具体包括:
按照所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
可选的,若所述目标元素为动态元素,则按照所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准,具体包括:
按照所述目标元素的颜色变化信息、和/或形状尺寸变化信息、和/或与其他元素之间的间距变化信息、和/或透明度变化信息、和/或背景色变化信息的验收变化范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
可选的,所述待验收节点对应UI视觉验收规范的设定过程,具体包括:
获取所述待验收节点对应预先配置的UI标准效果图;
识别所述UI标准效果图中的各个原设计元素,以及所述各个原设计元素的标准属性信息;
根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准。
可选的,所述根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准,具体包括:
按照终端屏幕背光灯的不同灯光信息,对所述标准属性信息进行调整,生成各个原设计元素的属性验收范围标准。
可选的,所述根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准,具体包括:
根据不同的终端屏幕尺寸信息,对所述标准属性信息进行调整,以便生成不同屏幕尺寸信息分别对应的各个原设计元素的属性验收范围标准。
可选的,所述按照所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准,具体包括:
获取与所述UI效果图对应截屏终端的目标屏幕尺寸信息;
根据与所述目标屏幕尺寸信息对应的所述目标元素的属性验收范围标准,执行所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准检测,以便确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
可选的,在得到所述待验收节点对应的UI视觉验收结果之后,所述方法还包括:
生成所述UI视觉验收结果的验收报告并进行输出。
可选的,所述方法还包括:
获取所述目标软件各个待验收节点对应的UI视觉验收结果;
根据所述各个待验收节点对应的UI视觉验收结果,生成所述目标软件的UI视觉验收报告并进行输出。
根据本申请的另一方面,提供了一种用户界面视觉验收的处理装置,该装置包括:
获取模块,用于获取目标软件待验收节点对应上传的UI效果图,以及获取与所述待验收节点对应预先设定的UI视觉验收规范;
处理模块,用于将所述UI效果图与所述UI视觉验收规范进行匹配分析,得到所述待验收节点对应的UI视觉验收结果。
可选的,所述处理模块,具体用于识别所述UI效果图中的各个元素以及所述各个元素的属性信息;
确定所述各个元素以及所述各个元素的属性信息是否符合验收标准条件。
可选的,所述处理模块,具体还用于检测所述UI效果图中是否缺少原设计元素和增加额外元素;
若缺少原设计元素、或增加额外元素,则确定不符合所述验收标准条件。
可选的,所述处理模块,具体还用于检测所述各个元素的属性信息是否符合各自对应的验收标准;
若存在不符合对应验收标准的元素,则确定不符合所述验收标准条件。
可选的,所述属性信息至少包括:颜色信息、形状尺寸信息、与其他元素之间的间距信息、透明度信息、背景色信息中的一个或多个;
所述处理模块,具体还用于按照目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
可选的,所述处理模块,具体还用于若所述目标元素为动态元素,则按照所述目标元素的颜色变化信息、和/或形状尺寸变化信息、和/或与其他元素之间的间距变化信息、和/或透明度变化信息、和/或背景色变化信息的验收变化范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
可选的,所述装置还包括:
配置模块,用于获取所述待验收节点对应预先配置的UI标准效果图;
识别所述UI标准效果图中的各个原设计元素,以及所述各个原设计元素的标准属性信息;
根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准。
可选的,所述配置模块,具体用于按照终端屏幕背光灯的不同灯光信息,对所述标准属性信息进行调整,生成各个原设计元素的属性验收范围标准。
可选的,所述配置模块,具体用于根据不同的终端屏幕尺寸信息,对所述标准属性信息进行调整,以便生成不同屏幕尺寸信息分别对应的各个原设计元素的属性验收范围标准。
可选的,所述处理模块,具体还用于获取与所述UI效果图对应截屏终端的目标屏幕尺寸信息;
根据与所述目标屏幕尺寸信息对应的所述目标元素的属性验收范围标准,执行所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准检测,以便确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
可选的,所述装置还包括:
输出模块,用于生成所述UI视觉验收结果的验收报告并进行输出。
可选的,所述装置还包括:输出模块;
所述获取模块,还用于获取所述目标软件各个待验收节点对应的UI视觉验收结果;
所述输出模块,用于根据所述各个待验收节点对应的UI视觉验收结果,生成所述目标软件的UI视觉验收报告并进行输出。
依据本申请又一个方面,提供了一种存储介质,其上存储有计算机程序,所述程序被处理器执行时实现上述用户界面视觉验收的处理方法。
依据本申请再一个方面,提供了一种用户界面视觉验收处理的实体设备,包括存储介质、处理器及存储在存储介质上并可在处理器上运行的计算机程序,所述处理器执行所述程序时实现上述用户界面视觉验收的处理方法。
借由上述技术方案,本申请提供的一种用户界面视觉验收的处理方法、装置及设备。与目前采用人工验收的方式相比,本申请可获取待验收的软件UI效果图,然后自动与对应预先设定的UI视觉验收规范进行匹配分析,然后得到相应的UI视觉验收结果。可有效代替人工进行UI视觉验收操作,节省了人工成本和缩减了验收时长,可提高UI视觉验收的效率和准确性。
上述说明仅是本申请技术方案的概述,为了能够更清楚了解本申请的技术手段,而可依照说明书的内容予以实施,并且为了让本申请的上述和其它目的、特征和优点能够更明显易懂,以下特举本申请的具体实施方式。
附图说明
此处所说明的附图用来提供对本申请的进一步理解,构成本申请的一部分,本申请的示意性实施例及其说明用于解释本申请,并不构成对本申请的不当限定。在附图中:
图1示出了本申请实施例提供的一种用户界面视觉验收的处理方法的流程示意图;
图2示出了本申请实施例提供的另一种用户界面视觉验收的处理方法的流程示意图;
图3示出了本申请实施例提供的一种应用场景系统架构实例的流程示意图;
图4示出了本申请实施例提供的应用场景的实施流程示意图;
图5示出了本申请实施例提供的一种用户界面视觉验收的处理装置的结构示意图。
具体实施方式
下文中将参考附图并结合实施例来详细说明本申请。需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。
针对UI视觉验收多采用人工验收方式,会影响UI视觉验收的效率和准确性、以及会增加人工成本的技术问题。本实施例提供了一种用户界面视觉验收的处理方法,如图1所示,该方法包括:
101、获取目标软件待验收节点对应上传的UI效果图,以及获取与待验收节点对应预先设定的UI视觉验收规范。
其中,目标软件可为新开发的软件,或者为需要UI视觉验收的软件等。待验收节点可根据实际需求预先设定,如需要验收软件某一功能的展示效果,进而设定相应的待验收节点等。上传的UI效果图可为目标软件开发的与该节点对应的实际效果图,具体可通过截屏方式或拍照方式等获取该UI展示效果图。
UI视觉验收规范中可包含对UI效果图进行UI视觉验收的判断标准内容,即参照UI视觉验收规范中的标准进行UI视觉验收。具体可预先根据该节点UI设计师设计的UI标准效果图设定该节点对应的UI视觉验收规范。
对于本实施例的执行主体可以为用于UI视觉验收处理的装置或设备,具体可配置在客户端侧,用于辅助用户对开发的软件进行UI视觉验收。或者根据实际需求,本实施例的执行主体也可配置在服务端侧,相当于验收平台,用于在线进行UI视觉验收处理,从而线上返回相应的UI视觉验收结果。
例如,软件开发人员在开发完软件后,将软件需要验收的界面截图进行上传,然后由本执行主体进行UI视觉验收的处理,具体可执行步骤101至102所示的过程。
102、将获取到的UI效果图与UI视觉验收规范进行匹配分析,得到待验收节点对应的UI视觉验收结果。
例如,通过预先设定的UI视觉验收规范,读取UI效果图中的像素点信息,自动比对颜色、大小、间距等,然后得到相应的UI视觉验收结果。
通过应用本实施例提供的用户界面视觉验收的处理方法,与目前采用人工验收的方式相比,本实施例可获取待验收的软件UI效果图,然后自动与对应预先设定的UI视觉验收规范进行匹配分析,然后得到相应的UI视觉验收结果。可有效代替人工进行UI视觉验收操作,节省了人工成本和缩减了验收时长,可提高UI视觉验收的效率和准确性。
进一步的,作为上述实施例具体实施方式的细化和扩展,为了完整说明本实施例的具体实施过程,本实施例提供了另一种用户界面视觉验收的处理方法,如图2所示,该方法包括:
201、获取目标软件待验收节点对应上传的UI效果图,以及获取与待验收节点对应预先设定的UI视觉验收规范。
为了保证自动进行准确的UI视觉验收操作,需要预先准确设定对应的UI视觉验收规范。可选的,该待验收节点对应UI视觉验收规范的设定过程,具体可包括:首先获取待验收节点对应预先配置的UI标准效果图(如可由UI设计师进行配置,即配置该节点需要达到的UI最终视觉规范效果图);再识别该UI标准效果图中的各个原设计元素(如图中存在的文字、图案、背景、按钮等),以及各个原设计元素的标准属性信息;最后根据各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准。
例如,可通过图像识别技术识别该UI标准效果图中的各个原设计元素,然后根据这些原设计元素各自包含的像素点信息(如像素点颜色值、像素点覆盖区域大小等),识别这些原设计元素的标准属性信息(如原设计元素的颜色、形状尺寸、元素间距、透明度、背景色等)。最后根据这些原设计元素的标准属性信息,参考实际操作中可能造成展示效果存在差异化的影响因素(如屏幕色差、屏幕背光灯强度等会造成实际UI效果图存在细微偏差),生成各个原设计元素的属性验收范围标准,即每个原设计元素允许的误差值,以便后续按照这些原设计元素的设定标准,进行UI视觉自动验收。
示例性可选的,上述生成各个原设计元素的属性验收范围标准的过程具体可包括:按照终端屏幕背光灯的不同灯光信息(如灯光亮度、灯光颜色等),对各个原设计元素的标准属性信息进行调整,生成各个原设计元素的属性验收范围标准。
由于截屏或拍照等方式,获取到的实际UI效果图,会受到终端屏幕背光灯因素的影响,所以针对背光灯不同的灯光信息,调整标准属性的大小(如添加上下限值等),即允许的误差值,最后生成各个原设计元素更加合理的属性验收范围标准,从而保证后续UI视觉验收的准确性。
除了上述屏幕背光灯因素对实际UI效果图造成允许的误差以外,屏幕的尺寸大小也会影响UI效果图的实际拉伸效果,因此可选的,上述生成各个原设计元素的属性验收范围标准,具体还可包括:根据不同的终端屏幕尺寸信息,对各个原设计元素的标准属性信息进行调整,以便生成不同屏幕尺寸信息分别对应的各个原设计元素的属性验收范围标准。
例如,参照不同的终端屏幕尺寸信息对实际UI效果图的拉伸或缩小等影响,对各个原设计元素的标准属性信息进行相应的调整,进而生成在不同屏幕尺寸信息的条件下,各个原设计元素的属性验收范围标准,以方便后续进行UI视觉验收时可参考截屏终端的屏幕尺寸信息,找到对应的各个原设计元素的属性验收范围标准进行验收操作,保证UI视觉验收的精确性。
进一步的,上述两种可选方式还可进行结合,即根据不同的终端屏幕尺寸信息,按照同一屏幕尺寸信息的终端屏幕背光灯的不同灯光信息,对标准属性信息进行调整。进而得到在不同的屏幕尺寸信息条件下,按照屏幕背光灯因素生成各个原设计元素的属性验收范围标准,后续按照实际情况,选择屏幕尺寸对应的参照标准进行UI视觉验收,可进一步提高UI视觉验收的精确性。
202、识别获取到的UI效果图中各个元素以及各个元素的属性信息。
可选的,元素的属性信息可至少包括:元素的颜色信息(如对比度、)、形状尺寸信息(如线条粗细、尺寸大小、字体、艺术效果等)、与其他元素之间的间距信息、透明度信息、背景色信息中的一个或多个。除此之外,根据实际情况还可包括元素的亮度信息、对比度信息、底纹信息、水印信息等。
例如,可通过图像识别技术识别UI效果图中的各个元素(如文字、图案、按钮等),然后根据这些元素各自包含的像素点信息(如像素点颜色值、像素点覆盖区域大小等),识别这些元素的属性信息。
203、确定UI效果图中各个元素以及各个元素的属性信息是否符合验收标准条件。
可选的,UI视觉验收规范可包含UI设计中原设计元素的验收标准条件,相应的,步骤203中确定各个元素是否符合验收标准条件,具体可包括:检测UI效果图中是否缺少原设计元素和增加额外元素;若缺少原设计元素、或增加额外元素,则确定不符合验收标准条件。其中,额外元素指的是这些原设计元素中不存在的其他元素。
对于上述可选方式,可在UI效果图中的元素验收角度,准确实现对UI效果图的UI视觉验收。
而对于UI效果图中的元素属性的验收角度,可选的,UI视觉验收规范可还包含这些原设计元素对应的属性验收标准条件,相应的,步骤203中确定各个元素的属性信息是否符合验收标准条件,具体包括:检测各个元素的属性信息是否符合各自对应的验收标准;若存在不符合对应验收标准的元素,则确定不符合验收标准条件。
由于不同元素的属性信息具有差异性,因此在上述可选方式中,每个元素的属性信息都有自己对应的验收标准,进而通过验证这些元素的属性信息是否符合各自对应的验收标准,可针对每个元素属性实现个性化的UI视觉验收,从而可更加精确的实现对UI效果图的UI视觉验收。
基于上述两种可选方式,如果UI效果图中不缺少原设计元素、且不增加额外元素,以及图中每个元素的属性信息都符合各自对应的验收标准,则说明UI效果图中各个元素以及各个元素的属性信息符合验收标准条件。
进一步的,为了说明元素属性信息是否符合验收标准条件的具体检测过程,示例性可选的,检测目标元素(以UI效果图中的一个元素为例)的属性信息是否符合与目标元素对应的验收标准,具体可包括:按照目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定目标元素的属性信息是否符合与该目标元素对应的验收标准。
例如,检测目标元素的颜色信息是否符合与目标元素对应的预设颜色范围标准;和/或,检测目标元素的形状尺寸信息是否符合与目标元素对应的预设形状尺寸范围标准;和/或,检测目标元素与其他元素之间的间距信息,是否符合目标元素与其他元素之间的预设间距范围标准;和/或,检测目标元素的透明度信息是否符合与目标元素对应的预设透明度范围标准;和/或,检测目标元素的背景色信息是否符合与目标元素对应的预设背景色范围标准等。除此之外,根据元素属性的实际情况,还可检测目前元素的亮度信息、和/或对比度信息、和/或底纹信息、和/或水印信息等是否符合对应的预设范围标准等。如果目标元素的这些属性都在各自对应的预设标准范围内,那么可确定该元素属性符合对应的验收标准;如果存在至少一个属性不在对应的预设标准范围内,可确定该元素属性不符合对应的验收标准。通过这种多角度的综合检测方式,可提高元素属性标准检测的准确度,进而可提高UI视觉验收的精确性。
进一步的,若目标元素为动态元素(如动画图案、闪动的按钮或文字等),则上述目标元素的判断过程,具体可包括:按照目标元素的颜色变化信息、和/或形状尺寸变化信息、和/或与其他元素之间的间距变化信息、和/或透明度变化信息、和/或背景色变化信息等的验收变化范围标准的检测结果,确定目标元素的属性信息是否符合与目标元素对应的验收标准。
例如,动态元素的颜色都变化了哪些颜色,这些颜色变化的顺序,如何拉伸或缩小,与其他元素之间的间距变化等动态属性,如果都符合预设的动态变化标准,那么可确定该动态元素符合对应的验收标准;否则,确定该该动态元素不符合对应的验收标准。通过这种方式可准确检测动态元素属性是否符合对应的验收标准,进而满足包含动态元素的UI视觉验收的准确性,使得本实施例方法可适用于更多的应用场景,满足更多的业务需求。
基于步骤201中针对不同屏幕尺寸信息,生成各个原设计元素的属性验收范围标准的可选方式。相应的,上述按照目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息等的验收范围标准的检测结果,确定目标元素的属性信息是否符合与目标元素对应的验收标准,具体可包括:首先获取与UI效果图对应截屏终端的目标屏幕尺寸信息;然后根据与目标屏幕尺寸信息对应的目标元素的属性验收范围标准,执行目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息等的验收范围标准检测,以便确定目标元素的属性信息是否符合与目标元素对应的验收标准。
通过这种可选方式,考虑了不同屏幕尺寸对UI效果图的影响,找到截屏终端尺寸对应的各个原设计元素的属性验收范围标准进行验收操作,进而可保证UI视觉验收的精确性。
对于本实施例,在经过步骤203的检测过程之后,根据检测结果具体可执行步骤204a或204b所示的过程。
204a、若根据UI效果图中的各个元素以及各个元素的属性信息判定符合验收标准条件,则确定目标软件待验收节点通过UI视觉验收。
例如,若各个元素的属性信息都符合各自对应的验收标准、且不缺少原设计元素和未增加额外元素,则确定目标软件待验收节点通过UI视觉验收。
即目标软件针对该节点上传的UI效果图符合预先设计的标准,可通过UI视觉验收。
与步骤204a并列的步骤204b、若根据UI效果图中的各个元素以及各个元素的属性信息判定不符合验收标准条件,则确定待验收节点未通过UI视觉验收。
例如,若存在不符合对应验收标准的元素、或缺少原设计元素、或增加额外元素,则确定待验收节点未通过UI视觉验收。
例如,如果UI效果图中有至少一项元素不符合预先设计的标准,或者缺少必要的原设计元素,又或者增加除了这些原设计元素以外的其他元素,都可视为存在异常,进而确定该节点上传的UI效果图不符合预先设计的标准,不能通过UI视觉验收。
205、在得到待验收节点对应的UI视觉验收结果之后,生成UI视觉验收结果的验收报告并进行输出。
其中,验收报告可包含需要和不需要修改的内容。验收报告中还可包含哪些原因导致的UI视觉验收未通过,进而帮助用户尽快对应修正。
例如,可将验收报告发送给软件开发人员以便快速了解UI视觉验收结果。还可以发送给UI设计师进行进一步人工审核等。
在实际情况中,由于软件中待验收节点的个数可为多个,因此进一步可选的,本实施例还可包括:首先获取目标软件各个待验收节点对应的UI视觉验收结果;然后根据各个待验收节点对应的UI视觉验收结果,生成目标软件的UI视觉验收报告并进行输出。进而帮助用户了解软件整体UI视觉验收的结果,进而后续可一并修改,提高一定的修改效率。
基于上述如图1和图2所示的具体实施方式内容,为了有更好的理解,给出如下具体应用场景,但不限于此,其具体的系统架构可如图3所示。
例如,预先根据本实施例提供的用户界面视觉验收的处理方法,开发出自动化的UI视觉验收平台,前期通过UI设计师将UI视觉标准在平台定义好,后续软件开发人员开发完软件后,将软件需要验收的界面截图上传到该UI视觉验收平台,然后UI视觉验收平台通过UI设计师设定好的验收规范,读取截图中的像素点信息,自动比对颜色、大小、间距等产生报告给软件开发人员。与目前需要人工验收的方式相比,效率更高且节省资源。具体可执行如图4所示的过程:
S1、UI设计师按照软件设计模型设计好软件的最终效果图,并在视觉验收平台上定义好UI规范;
S2、软件开发工程师开发好最终的软件后,根据UI设计师设定的UI规范一一上传最终的软件效果图;
S3、视觉验收模块(视觉验收平台)通过读取上传的效果图中元素的颜色、大小、间距等与UI规范进行匹配;
S4、视觉验收模块将最终的比对结果,输出验收报告给软件开发工程师。
通过应用上述场景的方案,通过UI设计师在视觉验收平台设定的视觉规范,与软件开发工程师开发好的软件最终效果截图,经过视觉验收平台的图像计算比较,自动输出视觉验收报告。与目前人工验收方式相比,无需UI设计师再参与人工验收过程,节省人力且可提高UI视觉验收的效率和准确性。
进一步的,作为图1和图2方法的具体实现,本申请实施例提供了一种用户界面视觉验收的处理装置,如图5所示,该装置包括:获取模块31、处理模块32。
获取模块31,可用于获取目标软件待验收节点对应上传的用户界面UI效果图,以及获取与所述待验收节点对应预先设定的UI视觉验收规范;
处理模块32,可用于将所述UI效果图与所述UI视觉验收规范进行匹配分析,得到所述待验收节点对应的UI视觉验收结果。
在具体的应用场景中,所述处理模块32,具体可用于识别所述UI效果图中的各个元素以及所述各个元素的属性信息;确定所述各个元素以及所述各个元素的属性信息是否符合验收标准条件。
在具体的应用场景中,所述处理模块32,具体还可用于检测所述UI效果图中是否缺少原设计元素和增加额外元素;若缺少原设计元素、或增加额外元素,则确定不符合所述验收标准条件。
在具体的应用场景中,所述处理模块32,具体还可用于检测所述各个元素的属性信息是否符合各自对应的验收标准;若存在不符合对应验收标准的元素,则确定不符合所述验收标准条件。
在具体的应用场景中,可选的,所述属性信息至少包括:颜色信息、形状尺寸信息、与其他元素之间的间距信息、透明度信息、背景色信息中的一个或多个;
所述处理模块32,具体还可用于按照所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
在具体的应用场景中,所述处理模块32,具体还可用于若所述目标元素为动态元素,则按照所述目标元素的颜色变化信息、和/或形状尺寸变化信息、和/或与其他元素之间的间距变化信息、和/或透明度变化信息、和/或背景色变化信息的验收变化范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
在具体的应用场景中,本装置还可包括:配置模块;
配置模块,可用于获取所述待验收节点对应预先配置的UI标准效果图;识别所述UI标准效果图中的各个原设计元素,以及所述各个原设计元素的标准属性信息;根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准。
在具体的应用场景中,所述配置模块,具体可用于按照终端屏幕背光灯的不同灯光信息,对所述标准属性信息进行调整,生成各个原设计元素的属性验收范围标准。
在具体的应用场景中,所述配置模块,具体还可用于根据不同的终端屏幕尺寸信息,对所述标准属性信息进行调整,以便生成不同屏幕尺寸信息分别对应的各个原设计元素的属性验收范围标准。
在具体的应用场景中,所述处理模块32,具体还可用于获取与所述UI效果图对应截屏终端的目标屏幕尺寸信息;根据与所述目标屏幕尺寸信息对应的所述目标元素的属性验收范围标准,执行所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准检测,以便确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
在具体的应用场景中,本装置还可包括:输出模块;
输出模块,可用于生成所述UI视觉验收结果的验收报告并进行输出。
在具体的应用场景中,所述获取模块31,还可用于获取所述目标软件各个待验收节点对应的UI视觉验收结果;
所述输出模块,还可用于根据所述各个待验收节点对应的UI视觉验收结果,生成所述目标软件的UI视觉验收报告并进行输出。
需要说明的是,本实施例提供的一种用户界面视觉验收的处理装置所涉及各功能单元的其它相应描述,可以参考图1和图2中的对应描述,在此不再赘述。
基于上述如图1和图2所示方法,相应的,本申请实施例还提供了一种存储介质,其上存储有计算机程序,该程序被处理器执行时实现上述如图1和图2所示的用户界面视觉验收的处理方法。
基于这样的理解,本申请的技术方案可以以软件产品的形式体现出来,该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM,U盘,移动硬盘等)中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本申请各个实施场景所述的方法。
基于上述如图1和图2所示的方法,以及图5所示的虚拟装置实施例,为了实现上述目的,本申请实施例还提供了一种用户界面视觉验收处理的实体设备,具体可以为计算机,智能手机,平板电脑,智能手表,智能手环,或者其他网络设备等,该实体设备包括存储介质和处理器;存储介质,用于存储计算机程序;处理器,用于执行计算机程序以实现上述如图1和图2所示的用户界面视觉验收的处理方法。
可选的,该实体设备还可以包括用户接口、网络接口、摄像头、射频(RadioFrequency,RF)电路,传感器、音频电路、WI-FI模块等等。用户接口可以包括显示屏(Display)、输入单元比如键盘(Keyboard)等,可选用户接口还可以包括USB接口、读卡器接口等。网络接口可选的可以包括标准的有线接口、无线接口(如WI-FI接口)等。
本领域技术人员可以理解,本实施例提供的一种用户界面视觉验收处理的实体设备结构并不构成对该实体设备的限定,可以包括更多或更少的部件,或者组合某些部件,或者不同的部件布置。
存储介质中还可以包括操作系统、网络通信模块。操作系统是管理上述用户界面视觉验收处理的实体设备硬件和软件资源的程序,支持信息处理程序以及其它软件和/或程序的运行。网络通信模块用于实现存储介质内部各组件之间的通信,以及与信息处理实体设备中其它硬件和软件之间通信。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到本申请可以借助软件加必要的通用硬件平台的方式来实现,也可以通过硬件实现。通过应用本实施例的技术方案,与目前采用人工验收的方式相比,本申请可获取待验收的软件UI效果图,然后自动与对应预先设定的UI视觉验收规范进行匹配分析,然后得到相应的UI视觉验收结果。可有效代替人工进行UI视觉验收操作,节省了人工成本和缩减了验收时长,可提高UI视觉验收的效率和准确性。
本领域技术人员可以理解附图只是一个优选实施场景的示意图,附图中的模块或流程并不一定是实施本申请所必须的。本领域技术人员可以理解实施场景中的装置中的模块可以按照实施场景描述进行分布于实施场景的装置中,也可以进行相应变化位于不同于本实施场景的一个或多个装置中。上述实施场景的模块可以合并为一个模块,也可以进一步拆分成多个子模块。
上述本申请序号仅仅为了描述,不代表实施场景的优劣。以上公开的仅为本申请的几个具体实施场景,但是,本申请并非局限于此,任何本领域的技术人员能思之的变化都应落入本申请的保护范围。

Claims (26)

1.一种用户界面视觉验收的处理方法,其特征在于,包括:
获取目标软件待验收节点对应上传的用户界面UI效果图,以及获取与所述待验收节点对应预先设定的UI视觉验收规范,所述UI视觉验收规范包括UI标准效果图中原设计元素的验收标准条件以及所述UI标准效果图中的各个原设计元素对应的属性验收标准条件,所述验收标准条件用于检测所述UI效果图中是否缺少原设计元素和增加额外元素,所述属性验收标准条件是参考实际操作中可能造成展示效果存在差异化的影响因素生成的原设计元素允许的误差值,所述属性验收标准条件用于检测所述UI效果图中的各个元素的属性信息是否符合各自对应的验收标准;
将所述UI效果图与所述UI视觉验收规范进行匹配分析,得到所述待验收节点对应的UI视觉验收结果;
其中,对于所述UI效果图中的动态元素,按照所述动态元素的属性信息的动态属性,确定所述动态元素以及所述动态元素的属性信息是否符合所述属性验收标准条件。
2.根据权利要求1所述的方法,其特征在于,所述将所述UI效果图与所述UI视觉验收规范进行匹配分析,具体包括:
识别所述UI效果图中的各个元素以及所述各个元素的属性信息;
确定所述各个元素以及所述各个元素的属性信息是否符合验收标准条件。
3.根据权利要求2所述的方法,其特征在于,确定所述各个元素是否符合验收标准条件,具体包括:
检测所述UI效果图中是否缺少原设计元素和增加额外元素;
若缺少原设计元素、或增加额外元素,则确定不符合所述验收标准条件。
4.根据权利要求2所述的方法,其特征在于,确定所述各个元素的属性信息是否符合验收标准条件,具体包括:
检测所述各个元素的属性信息是否符合各自对应的验收标准;
若存在不符合对应验收标准的元素,则确定不符合所述验收标准条件。
5.根据权利要求3所述的方法,其特征在于,所述属性信息至少包括:颜色信息、形状尺寸信息、与其他元素之间的间距信息、透明度信息、背景色信息中的一个或多个;
检测目标元素的属性信息是否符合与所述目标元素对应的验收标准,具体包括:
按照所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
6.根据权利要求5所述的方法,其特征在于,若所述目标元素为动态元素,则按照所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准,具体包括:
按照所述目标元素的颜色变化信息、和/或形状尺寸变化信息、和/或与其他元素之间的间距变化信息、和/或透明度变化信息、和/或背景色变化信息的验收变化范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
7.根据权利要求5所述的方法,其特征在于,所述待验收节点对应UI视觉验收规范的设定过程,具体包括:
获取所述待验收节点对应预先配置的UI标准效果图;
识别所述UI标准效果图中的各个原设计元素,以及所述各个原设计元素的标准属性信息;
根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准。
8.根据权利要求7所述的方法,其特征在于,所述根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准,具体包括:
按照终端屏幕背光灯的不同灯光信息,对所述标准属性信息进行调整,生成各个原设计元素的属性验收范围标准。
9.根据权利要求7所述的方法,其特征在于,所述根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准,具体包括:
根据不同的终端屏幕尺寸信息,对所述标准属性信息进行调整,以便生成不同屏幕尺寸信息分别对应的各个原设计元素的属性验收范围标准。
10.根据权利要求9所述的方法,其特征在于,所述按照所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准,具体包括:
获取与所述UI效果图对应截屏终端的目标屏幕尺寸信息;
根据与所述目标屏幕尺寸信息对应的所述目标元素的属性验收范围标准,执行所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准检测,以便确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
11.根据权利要求1所述的方法,其特征在于,在得到所述待验收节点对应的UI视觉验收结果之后,所述方法还包括:
生成所述UI视觉验收结果的验收报告并进行输出。
12.根据权利要求1所述的方法,其特征在于,所述方法还包括:
获取所述目标软件各个待验收节点对应的UI视觉验收结果;
根据所述各个待验收节点对应的UI视觉验收结果,生成所述目标软件的UI视觉验收报告并进行输出。
13.一种用户界面视觉验收的处理装置,其特征在于,包括:
获取模块,用于获取目标软件待验收节点对应上传的用户界面UI效果图,以及获取与所述待验收节点对应预先设定的UI视觉验收规范,所述UI视觉验收规范包括UI标准效果图中原设计元素的验收标准条件以及所述UI标准效果图中的各个原设计元素对应的属性验收标准条件,所述验收标准条件用于检测所述UI效果图中是否缺少原设计元素和增加额外元素,所述属性验收标准条件是参考实际操作中可能造成展示效果存在差异化的影响因素生成的原设计元素允许的误差值,所述属性验收标准条件用于检测所述UI效果图中的各个元素的属性信息是否符合各自对应的验收标准;
处理模块,用于将所述UI效果图与所述UI视觉验收规范进行匹配分析,得到所述待验收节点对应的UI视觉验收结果;其中,对于所述UI效果图中的动态元素,按照所述动态元素的属性信息的动态属性,确定所述动态元素以及所述动态元素的属性信息是否符合所述属性验收标准条件。
14.根据权利要求13所述的装置,其特征在于,
所述处理模块,具体用于识别所述UI效果图中的各个元素以及所述各个元素的属性信息;
确定所述各个元素以及所述各个元素的属性信息是否符合验收标准条件。
15.根据权利要求14所述的装置,其特征在于,
所述处理模块,具体还用于检测所述UI效果图中是否缺少原设计元素和增加额外元素;
若缺少原设计元素、或增加额外元素,则确定不符合所述验收标准条件。
16.根据权利要求14所述的装置,其特征在于,
所述处理模块,具体还用于检测所述各个元素的属性信息是否符合各自对应的验收标准;
若存在不符合对应验收标准的元素,则确定不符合所述验收标准条件。
17.根据权利要求16所述的装置,其特征在于,所述属性信息至少包括:颜色信息、形状尺寸信息、与其他元素之间的间距信息、透明度信息、背景色信息中的一个或多个;
所述处理模块,具体还用于按照目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
18.根据权利要求17所述的装置,其特征在于,
所述处理模块,具体还用于若所述目标元素为动态元素,则按照所述目标元素的颜色变化信息、和/或形状尺寸变化信息、和/或与其他元素之间的间距变化信息、和/或透明度变化信息、和/或背景色变化信息的验收变化范围标准的检测结果,确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
19.根据权利要求17所述的装置,其特征在于,所述装置还包括:
配置模块,用于获取所述待验收节点对应预先配置的UI标准效果图;
识别所述UI标准效果图中的各个原设计元素,以及所述各个原设计元素的标准属性信息;
根据所述各个原设计元素的标准属性信息,生成各个原设计元素的属性验收范围标准。
20.根据权利要求19所述的装置,其特征在于,
所述配置模块,具体用于按照终端屏幕背光灯的不同灯光信息,对所述标准属性信息进行调整,生成各个原设计元素的属性验收范围标准。
21.根据权利要求19所述的装置,其特征在于,
所述配置模块,具体用于根据不同的终端屏幕尺寸信息,对所述标准属性信息进行调整,以便生成不同屏幕尺寸信息分别对应的各个原设计元素的属性验收范围标准。
22.根据权利要求21所述的装置,其特征在于,
所述处理模块,具体还用于获取与所述UI效果图对应截屏终端的目标屏幕尺寸信息;
根据与所述目标屏幕尺寸信息对应的所述目标元素的属性验收范围标准,执行所述目标元素的颜色信息、和/或形状尺寸信息、和/或与其他元素之间的间距信息、和/或透明度信息、和/或背景色信息的验收范围标准检测,以便确定所述目标元素的属性信息是否符合与所述目标元素对应的验收标准。
23.根据权利要求13所述的装置,其特征在于,所述装置还包括:
输出模块,用于生成所述UI视觉验收结果的验收报告并进行输出。
24.根据权利要求13所述的装置,其特征在于,所述装置还包括:输出模块;
所述获取模块,还用于获取所述目标软件各个待验收节点对应的UI视觉验收结果;
所述输出模块,用于根据所述各个待验收节点对应的UI视觉验收结果,生成所述目标软件的UI视觉验收报告并进行输出。
25.一种存储介质,其上存储有计算机程序,其特征在于,所述程序被处理器执行时实现权利要求1至7中任一项所述的用户界面视觉验收的处理方法。
26.一种用户界面视觉验收的处理设备,包括存储介质、处理器及存储在存储介质上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述程序时实现权利要求1至7中任一项所述的用户界面视觉验收的处理方法。
CN201911055650.5A 2019-10-31 2019-10-31 用户界面视觉验收的处理方法、装置及设备 Active CN111045924B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201911055650.5A CN111045924B (zh) 2019-10-31 2019-10-31 用户界面视觉验收的处理方法、装置及设备

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201911055650.5A CN111045924B (zh) 2019-10-31 2019-10-31 用户界面视觉验收的处理方法、装置及设备

Publications (2)

Publication Number Publication Date
CN111045924A CN111045924A (zh) 2020-04-21
CN111045924B true CN111045924B (zh) 2021-03-23

Family

ID=70231981

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201911055650.5A Active CN111045924B (zh) 2019-10-31 2019-10-31 用户界面视觉验收的处理方法、装置及设备

Country Status (1)

Country Link
CN (1) CN111045924B (zh)

Families Citing this family (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111754488A (zh) * 2020-06-27 2020-10-09 北京百度网讯科技有限公司 界面的视觉可读性检测方法、装置、设备以及存储介质
CN112150431A (zh) * 2020-09-21 2020-12-29 京东数字科技控股股份有限公司 Ui视觉的走查方法和装置、存储介质、电子装置
CN113742021B (zh) * 2021-09-06 2023-01-17 北京字节跳动网络技术有限公司 一种数据验收方法、装置、电子设备以及存储介质
CN113722039A (zh) * 2021-09-06 2021-11-30 北京字节跳动网络技术有限公司 一种界面校验方法、装置、电子设备以及存储介质
CN113722038A (zh) * 2021-09-06 2021-11-30 北京字节跳动网络技术有限公司 一种数据匹配方法、装置、计算机设备以及存储介质
CN113742233B (zh) * 2021-09-06 2023-12-01 抖音视界有限公司 数据上传方法、装置、系统、电子设备以及存储介质

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US5974254A (en) * 1997-06-06 1999-10-26 National Instruments Corporation Method for detecting differences between graphical programs
CN109542431A (zh) * 2018-09-28 2019-03-29 中国平安人寿保险股份有限公司 控件属性分析方法、装置、电子设备及存储介质
CN109992518A (zh) * 2019-04-10 2019-07-09 禄鹏 Ui界面的检测方法、装置、电子设备及存储介质

Also Published As

Publication number Publication date
CN111045924A (zh) 2020-04-21

Similar Documents

Publication Publication Date Title
CN111045924B (zh) 用户界面视觉验收的处理方法、装置及设备
CN110443110B (zh) 基于多路摄像的人脸识别方法、装置、终端及存储介质
US11006505B2 (en) Automated re-creation of lighting visual for a venue
JP2010002370A (ja) パターン抽出プログラム、方法及び装置
CN110346704B (zh) 板卡测试中测试文件的确定方法、装置、设备及存储介质
CN112634227A (zh) Pcb拼板的检测标识方法、装置、电子设备以及存储介质
TWI794718B (zh) 電路板檢測方法、電子裝置及存儲介質
CN110879131B (zh) 目视光学系统的成像质量测试方法、成像质量测试装置和电子设备
CN111027450A (zh) 银行卡信息识别方法、装置、计算机设备及存储介质
WO2021159736A1 (zh) 应用程序兼容性测试的方法、装置及计算机设备
CN105678301A (zh) 一种自动识别并分割文本图像的方法、系统及装置
CN112087661A (zh) 视频集锦生成方法、装置、设备及存储介质
KR101399061B1 (ko) 호환성을 평가하기 위한 화면 동등성 판별 장치 및 방법
CN116993654A (zh) 摄像头模组缺陷检测方法、装置、设备、存储介质及产品
CN107179181B (zh) 显示屏均匀性的测试方法、终端及计算机可读存储介质
KR101383827B1 (ko) 인쇄회로기판의 솔더링 영역 자동검출 시스템 및 방법
WO2017219562A1 (zh) 一种二维码生成方法及装置
KR20190001873A (ko) 객체 탐지 및 추적 장치 및 그 방법
CN114549533B (zh) 模板图像存储方法、装置、设备及存储介质
TW201327243A (zh) 自動判別零件正確性的方法
JP6175904B2 (ja) 照合対象抽出システム、照合対象抽出方法、照合対象抽出プログラム
JP2020038215A (ja) 検査装置およびその制御方法
CN114782710B (zh) 一种图像特征提取方法及装置、显示面板的修复方法
CN111226437A (zh) 一种对拍摄装置的拍摄质量评测方法、装置及终端设备
KR102129970B1 (ko) 전자부품 검사 데이터 매칭 방법 및 장치

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant