虚拟眼镜试戴中镜片染色算法的设计与实现

陈清华

（温州职业技术学院 信息技术系，浙江 温州 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 图像合成

试戴效果生成时，需要将人脸与按瞳孔距离缩放的镜架进行合成。合成处理过程为：一是图片叠加处理。镜架部分合成时，人脸作为背景，镜架为前景，进行叠加。二是均匀混色处理。为体现真实性，镜片上应透出人眼镜片部分。因此，镜片区域需要的是混色处理，而不是简单的叠加。混色时，系统将透明度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—），女，浙江温州人，温州职业技术学院信息技术系讲师，硕士.