虛擬眼鏡試戴中鏡片染色算法的設計與實現

陳清華

（溫州職業技術學院 信息技術系，浙江 溫州 325035）

虛擬眼鏡試戴中鏡片染色算法的設計與實現

陳清華

（溫州職業技術學院 信息技術系，浙江 溫州 325035）

虛擬眼鏡試戴以計算機為輔助工具，實現眼鏡佩戴效果的預覽。結合鏡片染色的虛擬試戴方法，通過人像拍攝、鏡架幾何變換、鏡框圖像分割、鏡片染色、圖像合成等步驟，以Sobel邊緣檢測、掃描線填充、漸變混色合成算法為核心，實現集成于E-galsses在線眼鏡購物系統的眼鏡試戴模塊的開發。實踐證明，鏡片試戴效果提升了用戶購物體驗，提高了在線購買率。

虛擬眼鏡試戴；鏡片染色；圖像處理；顏色填充；混色

0 引 言

隨著生活水平的提高，人們對眼鏡產品的要求也從單一的視力保健朝著多樣化、時尚性、個性化轉變，開始更注重眼鏡的品牌、款式、顏色、材料等[1-2]。然而，一些眼疾患者在眼鏡店挑選鏡架時難以看清自身的試戴效果，更不能預先看到各種鏡片顏色的試戴效果，在鏡架、鏡片的選擇上產生了一定的困難[3-4]。虛擬眼鏡試戴以計算機為輔助工具，在原有業務邏輯的基礎上，利用數字圖像處理技術，包括圖像合成、分割等關鍵技術，實現眼鏡佩戴效果的預覽[5-6]。開發的交互式虛擬眼鏡試戴網購系統具有方便、友好、直觀的特點[1]，開啟了一種全新的眼鏡在線定制模式，滿足了用戶需求。

虛擬眼鏡試戴系統采用圖像疊加技術，通過幾何變換，將鏡架投到人像上繪制合成效果展現給用戶。但試戴過程并未對眼鏡中的重要組成部分—鏡片進行色彩處理，特別是對鏡片顏色有多樣化需求的消費者無法滿足預覽鏡片染色效果的需求。針對消費需求的變化，在虛擬眼鏡試戴基礎上，使用鏡架邊緣識別、漸變色填充技術，提出結合鏡架圖像分析的鏡片試戴過程，結合中小企業網站營銷的現狀與趨勢[7]，將該過程應用于E-galsses在線眼鏡購物系統。虛擬眼鏡試戴功能允許用戶以照片為原型，通過選擇品牌、鏡架款式、鏡片顏色等，進行全方位虛擬試戴，加深了用戶體驗。

1 虛擬眼鏡試戴系統設計

1.1 系統結構

系統設計時將鏡片顏色試戴需求集成于現有的E-glasses在線眼鏡購物系統。集成后的虛擬眼鏡試戴模塊結構設計如圖1所示。用戶可通過U I界面對頭像、試戴數據等信息進行管理；當存在購物前的試戴需求時，用戶可通過試戴信息處理功能將選購的物品與用戶頭像相結合，呈現試戴效果；用戶通過效果分享功能，邀請好友提出購物建議，分享成果。

圖1 虛擬眼鏡試戴模塊結構設計

1.2 試戴過程

結合系統結構設計與用戶鏡片顏色的選購需求，在原有虛擬眼鏡試戴系統的選擇信息中添加鏡片顏色的選擇。改進后鏡片染色的虛擬試戴過程如圖2所示。在整體試戴效果輸出前，對輸入的鏡架事先做邊緣識別，并在識別出的鏡框內進行漸變色顏色填充，最后再做圖像合成與效果輸出。

圖2 鏡片染色的虛擬試戴過程

1.3 鏡片染色處理方案

在鏡片試戴信息處理過程中，系統需要在識別出的人臉圖像中找到瞳孔位置，計算瞳孔間距離得出適當的鏡架比例；按照比例對標準鏡架圖像進行平移與縮放；通過對縮放后的鏡架圖像進行邊緣檢測得到二值鏡架圖像，并掃描找出鏡片對應的位置，對區域內的鏡片進行染色處理。鏡片染色技術方案如圖3所示。為提高系統的圖片處理效率，在實際過程中顏色填充與混色過程合二為一。

圖3 鏡片染色技術方案

2 主要算法設計

2.1 邊緣識別算法

邊緣識別算法主要有Sobel算子、Canny算子、Difference邊緣檢測和均勻度方法[1]。通過不同鏡架實驗結果比較發現，Sobel算子應用于鏡架識別效果最佳，因而輸出二值鏡架圖像采用Sobel算子。

Sobel算子針對鏡架數字圖像的每個像素，計算像素點周邊各個鄰點的顏色加權差，離像素點最近的點權值最大。Sobel邊緣檢測算子如圖4所示。

圖4 Sobel邊緣檢測算子

依據Sobel邊緣檢測算子，得出像素點(i,j)水平邊緣的計算值Sx(i,j)為：

Sx(i,j)=[RGB(i-1,j+1)+2×RGB(i,j+1)+RGB(i+1, j+1)]-[RGB(i-1,j-1)+2×RGB(i,j-1)+RGB(i+1,j-1)]

垂直邊緣的計算值Sy(i,j)為：

Sy(i,j)=[RGB(i-1,j-1)+2×RGB(i-1,j)+RGB(i-1, j+1)]-[RGB(i+1,j-1)+2×RGB(i+1,j)+RGB(i+1, j+1)]

將水平檢測值與垂直檢測值相加得到S(i,j)，即：S(i,j)= Sx(i,j)+Sy(i,j)

比較S(i,j)與設定的閾值Y：當S(i,j)的值大于Y時，則像素點(i,j)為邊界點，令其顏色值為白色，否則該點為黑色。此處，Y值設為經驗值1 6。

2.2 鏡架圖像生成

根據解析出的二值鏡架圖像，與鏡架原圖像進行合成，當二值鏡架圖像中像素點(i,j)的值為白色時，生成的鏡架圖像在該點的值為原圖像的RG B值，否則為白色。解析后的輸出結果為獨立的純鏡架圖像。

2.3 鏡片遍歷填充

在對鏡架圖像進行填充過程中，采用遍歷的掃描線方法進行。掃描過程中，像是有一條從左至右的掃描線穿過得到的鏡架圖像，當該位置的二值鏡架圖像由白變黑時，說明要進入鏡片的不規則區域，開始填充鏡片色彩；當該位置的二值鏡架圖像由黑變白時，走出鏡片區域，停止填充鏡片色彩。因此，在這相鄰配對的黑白變換的交點間的所有像素都應在鏡片區域內，需要進行鏡片顏色填充。

2.4 鏡片染色算法

系統使用的鏡片染色模式根據實際需求分為均勻染色和漸變染色。均勻染色鏡片每處顏色均相同，因而均勻染色的處理過程只要將識別的鏡框內的顏色設置為統一的GColor值即可。漸變染色鏡片根據工學設計原理，其漸變規律是從底端到頂端顏色逐漸加深。漸變染色中各個像素點的顏色深淺隨位置的變化而變化。一般情況下，當縱坐標數值變大時，顏色也隨之變淺。

假設鏡框中最高點縱坐標的值為y1，最低點值縱坐標的值為y2，則像素點(i,j)的漸變率為grdient=(jy1)/(y2-y1)。相應地，該像素點(i,j)的顏色值RGBij(r, g, b)中的r=backij.r×grdient+GColor.r×(1-grdient)，其中backij為背景圖片中像素點(i,j)的顏色值RGB。以此類推，可得出g和b的值。同一水平位置的像素點，顏色相同。

2.5 圖像合成

試戴效果生成時，需要將人臉與按瞳孔距離縮放的鏡架進行合成。合成處理過程為：一是圖片疊加處理。鏡架部分合成時，人臉作為背景，鏡架為前景，進行疊加。二是均勻混色處理。為體現真實性，鏡片上應透出人眼鏡片部分。因此，鏡片區域需要的是混色處理，而不是簡單的疊加?；焐珪r，系統將透明度alpha值設為30%。

當頭像像素點(i,j)的顏色值為f(i,j).color時，該像素的顏色合成結果值RGBij(r, g, b)中的r值為：

r=f(i, j).Color.R+GColor.R×alpha

以此類推，可得出g和b的值。

3 應用實例

在后續研發過程中，將算法應用于E-glasses在線眼鏡購物系統，完成了眼鏡銷售系統的鏡片虛擬試戴功能的開發、測試與應用，并獲得1項實用新型專利[8]。該試戴方法主要通過人像拍攝、鏡架幾何變換、鏡框圖像分割、鏡片染色、圖像合成等步驟完成鏡片虛擬試戴算法的應用，滿足了消費者對鏡架、鏡片的個性化、多樣化的試戴需求。

選用棕色系鏡片為測試效果，以白色為背景，展現染色鏡片與鏡架結合效果及與人像合成后試戴效果的alpha值為30%。均勻染色鏡片試戴效果、漸變染色鏡片試戴效果如圖5~圖6所示。

圖5 均勻染色鏡片試戴效果

圖6 漸變染色鏡片試戴效果

虛擬眼鏡試戴功能，對于各種不同類型的鏡框、不同顏色的鏡片，均能取得較好的試戴體驗效果。2014年E-glasses在線眼鏡購物系統數據顯示，成功購買鏡架與鏡片的用戶中9 2%都嘗試使用虛擬眼鏡試戴功能；同時，較之前的11%的鏡片購買率提高了8%，鏡片試戴功能間接促進了鏡片在線消費和鏡架購買。實踐證明，虛擬眼鏡試戴功能得到消費者的一致好評，特別是對于試戴效果的分享提高了網站的互動性，加深了用戶體驗。

4 結束語

鏡片染色算法在原有鏡架試戴的基礎上，利用圖像邊緣識別和漸變色填充技術，實現了基于鏡架邊緣檢測的鏡片試戴體驗，解決了在真實環境中鏡片顏色無法試戴的難題，提高了試戴效果的逼真度。該算法在現有的E-glasses在線眼鏡購物系統中取得了良好的應用。然而，隨著硬件技術的逐漸發展，人們不再拘泥于2 D靜態效果的試戴，為滿足人們的消費需求，下一步研究將嘗試將鏡片染色算法應用于動態人像跟蹤和3 D虛擬試戴環境。

[1]劉麗余.基于虛擬試戴技術的眼鏡銷售系統的研究與實現[D].成都:電子科技大學軟件工程學院，2 0 1 1.

[2]盧洋，王世剛，趙文婷，等.基于人臉姿態估計的虛擬眼鏡試戴技術[J].中國光學，2015(4):582-588.

[3]童天添，張振國.眼鏡零售業計算機虛擬試戴方法研究[J].計算機工程與設計，2008(4):1011-1012，1015.

[4]劉成，汪豐，祁長紅，等.一種基于增強現實的虛擬眼鏡試戴的方法[J].工業控制計算機，2014(12):66-68.

[5]李方芬，伍靜文.便于近視患者的虛擬試鏡裝置[J].藝術科技，2013(4):339.

[6]李鵑.基于特征點定位的虛擬試戴的研究[D].上海:上海交通大學電子與電氣自動化學院，2 01 1.

[7]胡林娜.溫州中小企業網絡營銷存在的問題及對策[J].溫州職業技術學院學報，2010(3):18-20.

[8]陳清華，翁正秋.一種基于漸變色的虛擬眼鏡試戴方法及系統:ZL 201620270537.4[P].2016-10-12.

[責任編輯：王志梅]

Design and Practice: Lens Dyeing Algorithm for Virtual Glasses Try-on System

CHEN Qinghua
(Information Technology Department, Wenzhou Vocational & Technical College, Wenzhou, 325035, China)

With computer as a supporting tool, virtual glasses try-on system can realize “previewing” of glasses wearing. With Sobel edge detection, scan line filling, gradient mixed-colored synthesis algorithm as its core, and steps like, portrait shooting, frame geometric shift and image segmentation, lens dyeing, and image synthesis, virtual wearing of dyed lens achieves the development of glasses trial wearing mode for E-glasses on-line purchase system. It is proved that lens trial wearing can improve users’ purchase experience and increase on-line sale rate.

Virtual glasses try-on system; Lens dyeing; Image processing; Color filling; Color mixing

TP391.41

A

1671-4326(2016)04-0059-03

10.13669/j.cnki.33-1276/z.2016.085

2016-10-20

溫州職業技術學院科研項目（WZY2016018）

陳清華（1983—），女，浙江溫州人，溫州職業技術學院信息技術系講師，碩士.