無線適配智慧化測試-以影像識別之名

何大蝦發表於2017-08-04

背景

隨著當下國內外手機廠商的百花齊放,Android和ios都呈現出一定的碎片化。同時,作為App應用載體的無線終端,在不同的系統版本、品牌、解析度和容器等各方面也都相差甚遠。因此,為了保證大多數手機使用者的體驗,我們在實際業務迭代變更中出現新頁面、模組釋出時所需要進行的適配工作也愈加繁重。

image.png

如上圖所示,我們可以看到,在適配工作的整個流轉機制中,研發和測試之間最為積累的往往是bug修復、驗證以及期間的溝通成本。儘管樣式問題往往`食之無味`,一來二去的溝通通常也會是 專案Delay人員陷入測試疲勞期 的罪魁禍首,但bug未能及時修復依然令人`夜不能寐`。 由此我們看到,適配工作亟待提效的部分,首先就需要減少測試與開發之間往復的bug修復和驗收環節。減少這個環節的前置條件即,提交給測試或外包同學做質量驗收的功能頁面/模組在多數主流機型中已得到較為充分的自測。

除此外,我們收集了幾個前臺導購型專案的大改版適配bug池,發現了以下兩個要素,這兩大問題也直接引導我們一期方案的落地。

  • ①.研發同學缺乏自測所需的大多數主流機型,無法較為全面的瞭解當前頁面的質量表現
  • ②.適配過程往往是發現和解決一些常見的頁面問題,且這些問題基本集中在安卓手機中

    • 載入效能差(白屏、模糊、持續載入)
    • 資料/模組載入失效(空窗)
    • 元件載入失敗(安卓的中低端機型常見)

一種基於影像識別提效適配工作的方法

得益於測試智慧化的趨勢性啟發,我們看到了 影像識別 在適配中能夠作為的可能性。因為既然要減少”往復”溝通的積累,又要從適配最相關的UI Check涉及的UI自動化“指令碼維護成本高”的歷史詬病中掙脫,還要儘可能多的檢查出適配工作的常見問題。所以,我們制定出了以下的智慧適配流程。

  • 流程圖
    image.png
  • 步驟

    • Step1.確定 基線圖 (即最標準的頁面視覺圖)
    • Step2:由自動化截圖工具獲得當前機型和系統下適配的頁面,即 對比圖
    • Step3:對step2中的截圖進行 預處理檢查(白屏、模糊、空窗等) ,如有異常,則直接過濾
    • Step4:通過直方圖對比的方式 對比基線圖和對比圖大致的相似性 ,相似性低,則直接過濾
    • Step5:通過 影像特徵對比 ,檢查並標識出兩張圖片中存在 差異的模組
    • Step6:返回檢查結果,繼續適配下一個機型的對比圖

在整個流程的最上層,是由我們的無線適配平臺提供當前功能頁面在不同機型、系統、App版本的執行截圖,除了在各種真機和模擬機上所使用的截圖和輪播技術略有技術方面的差別,其餘無論是預處理流程還是對比檢查環節,均不涉及任何指令碼的維護。研發同學在適配流程前,可在我們的平臺前置執行預交付功能頁面,尤其可重點關注的中低端機型中的問題並提前fix。基於此,再將質量已進一步保障的頁面流轉給測試同學驗收。整個工作的流程,在影像識別助力之下,使 `發現問題->解決問題->驗收問題` 的過程得以縮減,實現提效。

核心演算法技術

  • 基於直方圖的影像相似性預處理技術

    • 概述

      • 先獲取影像的直方圖資料(即影像各畫素點的數量Array)
      • 對比基準圖和對比圖各畫素分佈差異(演算法處理邏輯見貼圖程式碼)
      • 輸出相似性百分比
    • 技術實現方案
      image.png
  • 基於FAST+SIFT+FLANN演算法處理影像相似特徵技術

    • 概述

      • 通過FAST+SIFT演算法計算得到對比圖和基線圖的特徵點向量描述運算元, ReferKeyPints、CompareKeyPoints.
      • 基於FLANN特徵向量匹配得到兩張圖片的相似特徵向量 MatchPoints
      • 通過計算公式:差異特徵向量=基線圖特徵向量-相似特徵向量 得到差異特徵
      • 將差異特徵繪製在對比圖中(即描繪出差異、缺失等情況下的模組特徵點)
      • 通過比例分割對比圖ROI區域,以形狀顯示的模式繪製差異區域
    • 技術實現方案
      image.png

落地效果

目標明確,一期方案也在我們滿懷期待中浮出水面。實際落地時,我們看到,目前基於影像識別能夠檢測到的問題,已經較為完整地覆蓋了適配測試中常見的異常。無論是開發自測,還是外包同學正式介入驗收,都能夠藉助我們的平臺,對當前的功能頁面做一次針對多機的適配測試,讓往日需要來回溝通的常見適配問題得以前置,也間接推進專案進度,縮減適配環節人力和精力 。

  • 常見異常問題檢查
    image.png
  • 中低端機常見模組載入問題檢查

    • icon缺失且有資料載入差異
      image.png

- 模組缺失

image.png

展望

經過`影像識別`去提效適配工作讓我們初次感受到`智慧化`真正的魅力,近來年,深度學習的概念與應用也越來越火。我們也發現:由無監督學習、聚類演算法等構建起來的神經網路架構,其自適應和自學習能力或許比我們的影像特徵識別來的更加智慧。同時,集團也有bu對此作出一定的研究和場景應用。但嘗試對比後,我們發現無論是測試領域還是我們集團,由適配場景所積累的樣本幾乎為0,故對於深度學習(無監督、半監督學習)而言,即缺乏其運作的養料;與此同時,適配是一項講究速成速得的工作,於是我們初期無論是試錯與否,都無法容忍深度學習(無監督、半監督學習)較長的訓練週期。

也正是如此,我們發現,由我們平臺所帶來的,除了基於影像識別去解決適配的問題,我們還能形成一個自取自存的頁面異常大資料樣本庫。而形成這個庫的時間和人力成本,不過是舉手之勞而已( 將適配平臺中標識error的頁面留存即可,見下圖右部 ) 。有了這個大資料樣本庫,似乎感受到了深度學習在適配提效未來以及我們大資料庫開源的可能性。

激動之餘,不忘再複習一下無線適配的定義。即驗證所需功能在不同機型、系統中功能、互動、效能、安全等指標的正常表現。所以,我們所做的基於影像識別提效無線適配的方法,僅僅只是無線適配工作所覆蓋的一部分。所以,真正能將適配能力建立一套較為完整的解決方案,讓頁面功能冒煙、頁面在不同終端的效能表現、頁面的安全指數等指標都能歸一地輸出給研發、測試、外包甚至PM,相信這會是一件功德圓滿的事情。

image.png

很高興地是,以上的設想,已由我們的天雲平臺小組成員合力設計產出,設計的簡要模式如上圖所示,大家可以見個預告。目前天雲平臺已在逐個功能模組釋出內測,相信不久的未來,天雲平臺會給大家帶來一份更大的驚喜。

專案成員

基於影像識別提效適配的方法(專利)

  • 御之、賺儉、玄揚、初枝

天雲平臺

  • 西涯、玄揚、賺儉、園直、靜陽、御之
  • 如有合作需求和疑問,歡迎聯絡我們


相關文章