基于ImageMagick技术的网络虚拟试衣间的设计

刘志荣

摘  要： 网上购衣越来越受到广大用户的喜欢，但用户如何能在网上买到适合自己的衣服是网上购衣的最大问题。如果用户在购衣之前可以在网络上虚拟试衣，即将用户挑选的衣服“穿”在不同的模特上，则会大大增加用户的购衣兴趣，用户的购买欲也会随之增大。设计采用了ImageMagick技术来实现这一网络虚拟试衣功能。使用ImageMagick的遮罩技术，在Ruby On Rails开发平台中实现了网上在线试衣功能，在处理好的模特上生成二维试衣图像。测试表明，试衣图像的视觉效果良好。

关键词： ImageMagick; 虚拟试衣; 遮罩; Ruby On Rails

中图分类号：TP317.49          文献标志码：A     文章编号：1006-8228（2019）02-23-03

Design of network virtual fitting room based on ImageMagick technology

Liu Zhirong

（Hubei University of Technology， Wuhan， Hubei 430064， China）

Abstract： Buying clothes online is increasingly become the majority of the user's choice， but how users on the Internet can buy their own clothes is the biggest problem of buying clothes online.  If users can try on virtual clothes on the network before buying clothes， that is to say， the clothes they chosen will be "worn" on different models， which will greatly increase the user's interest in buying clothes， and the users' desire to buy clothes will also increase. This design uses ImageMagick technology to realize the virtual fitting function. The mask technology of ImageMagick is used， and the online fitting function is realized on Ruby On Rails environment， which generates a two-dimensional fitting image on a processed model. The test results show that the visual effect of the fitting image is good.

Key words： ImageMagick; network virtual fitting; mask; Ruby On Rails

0 引言

服裝作为非标准化商品，顾客必须知道衣服的尺码、颜色、款式等这些要素才能做出合适的选择。但是网购环境下，除衣服颜色比较直观外，其他几个要素很难被直观的了解到。网络购买服装始终面临着“无法试穿，退货率高”的问题。调查结果显示，服装类产品的网购用户普遍都会遇到号码、色差和款式风格不合适等问题。网购投诉量上升，顾客与商家之间常出现纠纷。出现了许多淘宝上的店家被顾客给了差评之后不断骚扰威胁顾客的不良事件。因此研发出解决此类问题的技术显得愈来愈重要，“网络虚拟试衣间”是应对此类问题的有效手段之一。

近几年前，关于试衣系统多有报道，例如德国弗劳恩霍夫学会的科学家开发出一套叫做“网络试衣间”的系统。在中国，2002年4月15日，腾讯公司推出了QQ秀。QQ秀可在固定模特身上搭配各种不同的衣服，颇满足了部分爱美年轻女性的搭配欲。随着QQ秀的流行，以其为代表的Avatar系统随之流行，2010年10月在美国成功上市的麦考林网等成功的开发出了这种网络试衣系统。不足之处是，这种系统只能在固定模特上穿衣。2007年前后，以face72、试衣网等为代表的试衣网站开始出现。但是，这些网站的认知度和接受度并没有想象中高。目前，市面流行的三维试衣系统有国外的mvm、Cme等，以及国内的C2pop和试衣网自主研发的三维试衣软件。

本设计采用了ImageMagick图形处理技术来实现网络试衣功能。该技术实现比较方便，能很好的结合Ruby On Rails开发平台来实现二维试衣效果。

1 ImageMagick简介

1.1 ImageMagick简介

ImageMagick包含有一套功能强大、稳定而且免费的图片处理软件工具集和开发包，可以用来处理超过90种的图片文件，包括流行的TIFF、JPEG、GIF、 PNG、PDF以及PhotoCD等格式的图片文件。利用ImageMagick，可以根据Web应用程序的需要动态地生成图片， 还可以对图片做改变大小、旋转、锐化、减色或增加特效等操作，并将操作的结果以相同格式或其他格式保存。对图片的操作，既可以用命令行，也可以用C/C++、Perl、Java、PHP、Python或Ruby编程来完成。ImageMagick提供了一个高质量的2D工具包，部分支持SVG。ImageMagic技术主要聚焦在性能、减少bug以及提供稳定的API和ABI上。同时ImageMagick是免费软件：全部源码开放，可以自由地使用，复制，修改，发布，并支持大多数的操作系统[6]。

1.2 ImageMagick的功能特点

ImageMagick的主要功能有：①将图片从一种格式转换到另一种格式，包括直接转换成图标;②动态改变图片的尺寸、旋转、锐化（sharpen）、减色等特效操作;③将不同的缩略图进行合成，合并成一张图片;④将一组图片作成gif动画;⑤在一幅图片上打上水印或画其他图形，并可以带文字阴影和边框渲染;⑥给图片加边框或框架，增加图片的美感;⑦取得一些图片的特性信息，例如图片的长度、宽度、大小、修改时间等属性;⑧包括了gimp可以做到的常规插件功能，还包括了各种曲线参数的渲染功能。

ImageMagick几乎可以在任何非专有的操作系统上编译，无论是32位还是64位的CPU，包括LINUX、Windows、Macintosh、VMS、OS/2等主流操作系统。

2 ImageMagick的技术原理

2.1 Alpha[4]通道遮罩[5]的含义

alpha合成是将图像与背景相结合的过程，以产生部分或完全透明的外观。它通常是用于渲染图像元素，将所得的多个2D图像合成一个单一的图像。为了正确地组合这些图像元素，需要为每个元素保持相关的光照。在一个2D图像元素中，存储了每个像素的颜色，额外的数据存储在一个0～1之间的值的alpha通道。如果值为0，意味着像素没有任何覆盖信息，是透明的，即没有从任何几何形状的颜色贡献。如果值为1，意味着像素是不透明的，因为几何形状完全重叠的像素。

如果一个Alpha通道在图像中使用，常见的用法有两种：直Alpha通道和相关Alpha通道。在直alpha通道中，RGB代表对象或像素的颜色，则不考虑其不透明度。在相关alpha通道中，RGB分量代表像素的对象的颜色，用乘法调整其不透明度。使用直alpha通道明显的优点是，在某些情况下它可以保存一个乘法的结果。然而，使用相关alpha通道最显著的优点是合成颜色的正确性和简单性，即alpha允许正确进行过滤和混合。两幅图像的层叠关系有以下五种类型，分别是“over”、“in”、“out”、“atop”、“xor”，按透明度分别进行层叠的效果如图1所示。

2.2 Alpha通道遮罩的工作原理

alpha通道的存在，可以使用合成代数来表示合成图像操作。例如，给定两个图像元素A和B，最常见的合成操作是结合图像，例如图像A出现在前面，图像B出现在后面。这可以表示为A OVER B，还有诸如A IN B、A OUT B、A ATOP B、A XOR B等关系，如图1所示。实际上，OVER操作符是正常的绘画操作，而IN运算符是alpha合成等效剪辑。作为一个例子，可以通过下面的公式来实现每个像素值的OVER運算符。

其中C0是操作结果，Ca是颜色的像素单元，Cb是在B元素的像素的颜色，αa和αb分别是图像元素A和图像元素B的像素值，假定所有的颜色值被组合为alpha值，可以改写为输出颜色的方程C0=Ca+Cb（1-aa），由此产生的alpha通道值为

3 基于ROR[3]环境的虚拟试衣功能的实现

该网络虚拟试衣间在Ruby On Rails开发环境中实现了网上试衣功能。系统的设计思想是采用遮罩原理，将不同的衣服、花型等不同的图案在已选择好的模特上显示，用户则可以根据显示的不同效果作出购衣选择。功能的具体实现过程如下。

3.1 精选不同风格的试衣模特

首先挑选一些适当的模特，在线试衣功能就是在这些模特上进行的。这些模特的分辨率必须要够高，至少是1000*1000分辨率，分辨率如果太低则会影响模特的试衣效果。其次就是模特必须是白色或接近白色，只有这样才能制作出遮罩效果。

3.2 处理试衣模特

试衣效果的关键就是处理以上选择的各类模特，将模特的不同部位用专业图形处理软件（例如photoshop等）进行分割，到最后再通过程序进行定位并合并。在此过程中，由于衣服是由不同部分“拼”起来的，所以不能简单的将模特处理为一个整块，否则衣服“穿”在模特身上就没有立体感，试衣将没有效果。模特不同的部位可以采用魔术棒工具进行分割，在分割时必须将模特放大，这样在分割时就不容易错位。但是整个模特也不能分割得太碎，否则在定位合并时不容易精准对齐。如果碰到有阴影的部位，为了增强试衣时的三维效果，在切割时须要绕过阴影部分，这样在图形遮罩时会保留阴影部分不变。另外将模特切割的每一部分的底色都要置换成黑色，这是遮罩技术所必须的步骤。

3.3 在线试衣的实现过程

⑴ 模特定位

即将上述步骤切割出的不同模特部分利用程序进行精准定位，最终还原出模特原型。在定位的同时，就是将模特的不同部位进行合并，在ROR环境中可以利用如下程序语句进行定位：system “convert mote1.jpg yi1.jpg -compose multiply-geometry+100+200 -composite tu1.jpg”。其中“mote1.jpg”为切割出的模特部分，yi1.jpg为衣服或花型的jpg图，参数“compose”为不同的图形进行组合，参数“multiply”为两幅图形进行相乘，参数“geometry”为坐标参数，参数“composite”为最终合成图形。上述的转换过程可以用图2进行模拟。模特定位的作用就是要确定每个模特部分的精确位置，为下一步的模特“穿衣”做好准备。

⑵ 模特“穿衣”

通过模特定位可以得出模特的每个部分精准的位置坐标。再由程序将模特的每一部分进行遮罩操作，为它们分别“穿衣”。最终将这些“穿”好衣服的不同模特部分拼装在一起，就构成了一幅完整的模特服装。在操作上，用户只要点击不同的衣服或花型的图形，则相应的模特便会“穿”上这些衣服，以供用户选择。

⑶ 操作过程中的关键点

在上述的操作过程中，为了很好的实现在线试衣功能，必须注意以下几个关键点。第一，模特的选择。模特的分辨率要高，三维立体感要强。第二，切割模特时需要很好的处理模特的阴影部分，使其在试衣过程中具备立体感。第三，事先要确定切割的块数。对于一个比较复杂的模特既不能切割的太少，太少则不能显示出模特穿衣的立体感，又不能切割的太多，太多则定位合并会比较复杂，不好精准定位，因为要对模特的每一部分都进行遮罩操作，所以模特“穿衣”过程就会比较缓慢。至于模特要切割为几块，则视不同的模特而定，要反复测试，直到“穿衣”速度和效果达到平衡为止。第四，处理好模特不同部位的坐标，这些部位的坐标要非常精准，否则在“穿衣”的过程中就会在模块衔接部位出现白边。

4 结束语

本文网络虚拟试衣间的设计是基于二维的，与现有的一些三维试衣效果相比，它有以下两点优势。一是设计比较简单，仅仅利用ImageMagick技术中的遮罩技术即可实现，而且模特的设计也简单，模特完全可以从网上下载，仅做一些简单的处理即可成为试衣模特。二是模特在“穿衣”速度上则要快于三维试衣，但是二維图形最大的不足之处在于试衣的效果显然不能和三维的相比，三维图像的试衣效果则非常逼真，而且可以实现多角度、多方位的视觉。

该设计需改进之处：①在现有设计的基础上进一步增强模特的试衣效果，不断地改进试衣方法，加快模特试衣时的速度;②将模特换成真人，通过摄像头将用户扫描进电脑，然后将真人替换模特进行试衣，这样效果便会更加逼真，应用范围将可以扩大。

参考文献（References）：

[1] 软件开发技术联盟.PHP开发实例大全（提高卷）[M].清华大学出版社，2016.

[2] 邓酩，杨铁军.基于水平集和ImageMagick的发货确认管理系统设计[J].计算机工程与设计，2012.33（6）：33-37

[3] （加）.海德，刘申.Rails开发者指南[M].机械工业出版社，2009.

[4] David A.Black，钟凤鸣译.Ruby程序员之道[M].人民邮电出版社，2016.

[5] （美）雷蒙德.Ajax on Rails[M].东南大学出版社，2007.

[6] 顾韦华.基于ImageMagick和Magickwand的Web图像处理[C].南京大学，2010：45-49