Page 1

ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

結合 HSV 與 K-means 之虛擬試裝間 陳同孝 1, 陳民枝 1, 蔡螢池 1,*, 王凱慶 2, 李智華 2, 陳師融 2 1

國立臺中技術學院 資訊科技與應用研究所 臺中 臺灣 2 國立臺中技術學院 資訊工程系 臺中 臺灣

*通訊作者 404 臺中市北區三民路三段 129 號 國立臺中技術學院資訊科技與應用研究所 Tel: +886-4-22196345 e-mail: bigear42@gmail.com

摘要 透過網路購買衣服趨勢快速增長,因應消 費者的需求,影音發展加上網頁互動的技術使 得現今網路購物打破以往侷限。線上虛擬試衣 間系統便是現今網路購物發展技術中最盛行 的項目,本研究將提供人體平面照合成來模擬 試穿的功能。 關鍵詞:虛擬試衣間,影像處理,網路購物。

ABSTRACT Using the Internet to buy clothes is fast-growing trend. Due to consumer demands, development in video technology and interactive web development resulted in offsetting traditional limits. Online virtual fitting room system is the most popular item of online shopping. This study provides a virtual clothe fitting function based on 2D human image.

表 1 電子商務 B2C 之市場規模統計 年度 B2C 市場規模 157.5 億元 2002 220.9 億元 2003 347.2 億元 2004 600 億元 2005 900 億元 2006 1855 億元 2007 2008 2529 億元 (預估) 在這廣大的網路購物市場中,幾乎沒有 買不到的物品,但主要還是以服飾、3C 產品、 食品、美容商品等為主,依據資策會公布 2009 網路商店預測銷售的商品類別之調查數據,如 圖 1.所示。

Keyword: virtual fitting room, image process, web shopping.

緒論 在近年來網路快速發展並迅速普及化, 網路購物早已不在是夢想,不用到外面曬太 陽,只要動動手指頭,就可以輕鬆上網購物, 使用線上 ATM 就可以進行轉帳、消費等服 務,這些便利的服務使得人們越來越倚賴網路 購物,市場上也有眾多公司逐漸參與競爭,舉 凡 Yahoo 奇摩、PChome 露天拍賣,近來更有 大陸淘寶網要來搶攻這一塊網購大餅,便利的 網路使得台灣的電子商務發展進步相當神 速,根據表 1.資策會市場情報中心(MIC, Market Intelligence Center)研究顯示台灣每年 透過網路的市場交易額成長率是相當驚人的。

圖 1 2009 網路商店預測銷售商品比例 由圖 1 可知服飾、珠寶、飾品等在網路 購物上佔有一席之地,然而目前市面上的網路 購衣系統,決大多數還是以圖文方式來介紹產 品,但畢竟僅依靠圖片或文字難以完整的呈現 產品原貌,使用者除了仰賴賣家提供的圖片之 外,必須依靠直覺、想像來挑選產品,常會發 生買到差異太大的商品或是完全不適用的情 況,這樣的事情發生太多次只會讓顧客對網路 購物失去興趣。為了提供使用者更進一步的產 品資訊,目前市面上雖有許多虛擬試衣間系統


ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

運用現今影像處理技術來摸擬實際情況,讓使 用者更有互動、真實的感觀,但仍然有需要改 進的空間,以下三點為目前虛擬試衣系統的主 要問題。 1.人體姿勢為固定的 2.可試衣的衣服太少 3.衣服上的摺痕及弧度無法表示出來 現今多數的摸擬試衣系統大都採用 3D 立體模組的方式來呈現,人體的姿勢只能選擇 系統所提供的,無法讓使用者更動想要的姿 勢,而一家網路服飾店販賣的衣服樣式可能有 上百、上千件,模組化的速度跟不上衣服樣式 的新增,可供試衣的模組化衣服卻僅有幾十 件,相對於販賣的數量來說,實在是太少,再 加上模組化後的試穿,缺少了摺痕、陰影等真 實感。 本研究在針對目前市面上的虛擬試衣間 系統所發現的主要缺點進行改良,透過影像處 理技術,讓平面照片在虛擬試衣間裡,可以增 強試衣的真實性及擴充性。

文獻探討 最初的虛擬試衣是藉由掃描儀器,將人 體三維數據掃描下來[11],在電腦中建立使用 者的虛擬三維影像,在將其應用到試衣方面。 虛擬試衣間最大的特點在於它可「先試後 買」 ,幫助使用者在未看到實體時,能知道其 衣服的搭配效果。 Smith, A.R.在 1978 年創立了 HSV 色彩 空間模型[1]。HSV 是比 RGB 擁有更準確的感 知 顏 色 聯 繫 , HSV 表 示 hue( 色 相 ) 、 saturation(飽和度)、value(明暗度)。其中,色 相是取 0-360 度的數值(0%-100%)來代表,飽 和度是指色彩的純度,數值越高純度就越高, 明暗度也稱「亮度」 。而圖 2 中其圓周的角度 為「色相」 ,而圓柱體內的點到中心軸的距離 為「飽和度」 ,而剛提到的圓柱體中心軸高度 為「明暗度」 。

圖 2 HSV 色彩空間模型

在本研究中,主要是做 2D 影像合成, 藉由真實相片來模擬實際試穿,來加強虛擬試 衣間的效果,在處理過程中膚色偵測部分是採 用 C. Garcia, and G.Tziritas 提到的 YCbCr 色彩 空間中,膚色像素區域範圍比 HSV 色彩空間 的膚色像素區域範圍較集中,透過 YCbCr 對 光線變化較 HSV 不敏感,可令我們在偵測上 避免較多錯誤狀況[2]。 Avidan, S., Shamir, A 提出改變影像大 小,卻又不改變影像內主要物體的大小[3] , 我們將其運用在調整衣服尺度大小,因為影像 越平滑的區域代表其各點之間的像素值變化 量不大,因此當刪除變化量最小線條或增加變 化量最小線條較不易更改到影像內物影的大 小,主要做法是利用動態規劃的方式找出影像 內變化量最小的線條並將其刪除或增加。 在處理影像時使用到部份資料探勘(data mining)的技術,所謂資料探勘是從大量資料 中尋找有用的資訊,並進而分析或處理的技 術,其中的分群化(clustering)技術[4]即是將資 料依據某些條件劃分出不同的群組,根據方法 不同又細分為分割式(partitioning) 、階層式 (hierarchical) 、格子基礎(grid-based)、密度基 礎(density-based)、模型基礎(model-based)等數 種[7],而在分割式演算法當中最基礎且相當 常 用 的 K-means 演 算 法 又 稱 為 Forgy's algorithm[8],主要的目的是在大量高維度的資 料中找出具代表性的資料,在以這具代表性得 資料進行後續的處理,例如可用來降低資料計 算量,並避免雜訊所產生的不良影響。

研究方法 本論文主要分成二個部份,第一部份為 部位切割,從人體圖找出頭、領口、手臂、身 體四個部位,再從衣服找出袖子、領口、身體。 第二部份為合成動作,包括手臂合成、身體合 成、頭及領口的處理,本論文以 MATLAB 為 實驗工具,實驗的人體圖身上穿的衣服必需是 單色的衣服,以便於辦識與合成,欲合成模擬 試穿的衣服需與人體圖身上穿的衣服是同樣 類型的。


ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

圖6 去背後人體影像

圖 3 人體圖部位分割流程圖 如圖3所示,主要用於切割出頭部、手 臂、身體,根據輸入頭部的寬度及手臂粗細寬 度,讀入人體影像後利用梯度計算人體輪廓線 (圖4)並將輸廓線所包圍的區域(圖5)當成人體 區域(圖6),以垂直線長度小於輸入的手臂寬 方式切割出手臂部份(圖7)及身體頭部部份(圖 8),接著將身體及頭部影像以水平線長度小於 輸入頭部寬度方式切割出身體領口(圖9)及頭 部(圖11)兩影像,最後計算身體影像的膚色區 域取最靠近身體中間且最上面的區塊為領口 (圖12),並且將身體影像的膚色區域去除之後 當作身體(圖10)。

圖4 人體輪廓線

圖5 以照輪廓線推算出人體部份

圖7 切割後手臂圖

圖8 身體頭部影像

圖9 身體領口影像

圖10 身體影像

圖11 頭部影像

圖12 領口影像

由於去背景的研究已經有許多研究在這 方面 所以我們的文章沒有特別去針對此部份 研究,因此本研究採取手動去背,為了精確的 找出手臂及頭部,本研究採取手動輸入寬度來 確保分割出來的部位是正確的。


ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

讀入人體身體區域、衣服身體區域 將衣服身體區域大小調整至人體身體區 域一樣 將二張影像交集的區域由衣服身體區域 的像素值取代 計算人體身體區域比衣服身體區域多出 來的區域 判斷各多出來的區塊位於交集區域的額 外位置 將多出來的區域各自取的反方向同形狀 的區域向外拉長二倍 計算身體上的明亮度 圖 13 衣服部位的分割流程圖 由圖13可見,目的在於衣服的分割,並 將影象與前一步驟「人體圖部位分割」做比較 調整,以供下一合成步驟。方法與前一步驟大 同小異,根據輸入袖子粗細寬度,讀入衣服影 像以影像梯度擷取衣服輪廓,得到僅剩衣服的 影像,以垂直線長度小於輸入的袖子寬度方式 切割出衣身影像(圖14)與袖子影像(圖15),在 衣身領口部份使用閉合,閉合出來的區域取中 間最上面的區塊當作領口。最後將二邊袖子各 自由內到外以一個像素寬垂直切成n條線。

圖 14 衣身影像

將合成後的身體的衣服區域乘上明亮度 比例 圖 16 身體合成流程圖 由圖16所見,此步驟將身體與衣身的合 成過程、輪廓及明亮度的表現。分別讀入前兩 步驟處理好的身體、衣身影像,將衣身影像調 整至與身體影像一樣大,調整完畢後將二張影 像交集的區域由衣服身體的像素值取代,計算 人體身體區域比衣服身體區域多出來的區 域,判斷各多出來的區塊位於交集區域的額外 位置,將多出來的區域各自取的反方向同形狀 的區域向外拉長二倍,例如多出來的區域是在 交集區域的右邊,則反方向向左邊外拉長(結 果如圖17)。最後計算計算明亮度,明亮度的 比例=原人體灰階圖*(1/原人體灰階圖平均 值),並將合成後的身體衣服乘上明亮度比例 (圖18)。

圖15 袖子影像

圖17 身體合成後結果

圖18 加上明亮度比例後的輪廓效果


ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

由 Avidan, S., Shamir, A 兩人提出改變 影像大小後主體不改變概念得知[3],衣服越 接近中間的部份越為重要,所以本研究在處理 二張影像形狀不一樣時,將之間的差距在邊緣 部份做處理,為了使合上去的衣服呈現紋路, 本研究先將原始衣服的明亮度計算出來,等合 成完畢在加入明亮度。

讀入手臂區域和袖子的線條

取出手臂邊界

計算手臂膚色平均值

將手臂以k-means分二群

將手臂接近膚色那一群的區域跟身體部 份的輪廓線去掉

服輪廓。讀取先前處理好的手臂影像及袖子切 割後線條,首先處理手臂影像,擷取手臂邊界 (圖20),計算出膚色區域的平均值,將手臂轉 成HSV的色彩空間用k-means以S跟V為資料 分二群,並以此數據將鄰近膚色區域與膚色相 近的群聚跟身體部份的邊界線去掉之後會剩 下二條手臂的邊界線(圖21),上下二條線各以 最靠近身體區域的點編號成1,下一個點為2, 直到累加至整條線都完成編碼,手臂合成前置 作業到此為止,接著將袖子上下二條線上的資 料點調整與手臂線上編號一樣數量,以較多資 料點那條線當作標準,調整較少資料點那條 線,計算上下二條線的比例(公式:較少點的 線 條 長 度 /較 多 點 的 線 條 長 度 ) 及 相 對 應 的 點。當袖子上的點完全對應到手臂上的點後, 便進行像素合成,將要合成上去袖子的每條線 調整長度後依相對應的點貼上線條。貼完後會 發現有一些缺陷(圖22),即系統未處理的部 份,以三乘三遮罩取平均值當作該點的像素值 來填補這些未處理的部份(結果如圖23)。最後 計算明亮度,並乘上貼上袖子的手臂,完成輪 廓重現(圖24),圖20~24以右手臂為例,左手 臂亦為相同做法。

將上下二條線編碼 將袖子線條數量調整至跟編碼後的二條 線條中編號最大一樣

圖20 手臂邊界線

圖21 上下邊界線

圖22 合成後的缺陷

圖23 修補後成果

計算上下二條線的比例

從比例計算出上下二條線相對應的點 將要合成上去袖子的線條依照二條線相 對應的點調整長度後貼上線條 修補合成上產生的黑點

計算手臂上的明亮度比例 圖24 乘上明亮度比例後的輪廓效果 將貼上袖子的手臂乘上明亮度比例 圖 19 手臂合成流程圖 如圖19所示,此步驟將手臂進行處理並 與袖子合成,修補合成後產生的缺陷,重現衣

為了找出手臂非衣服的區域,本研究除 了 使 用 膚 色 偵 測 [2] 以 外 , 另 外 也 使 用 K-MEANS 分群演算法[7][8]以 HSV 色彩空間 的 S 跟 V 為資料進行分群,由於 H 會使分群 後更不明顯所以在做分群時沒有將 H 加入, 這樣可以更精確找出手臂非衣服的區域。


ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

讀入切割後的頭部影像、人體領口影 像、衣服領口影像 將衣服領口區域移動至人體領口區域

依身體領口膚色區域找出其中心點 衣服領口標記區域找出中心點 圖 25 衣服樣本 1 將上述二個中心點計算偏移量 將人體領口區域拉長至衣服領口區域一 樣的垂直長度 將衣服的領口區域的每一列線條長度調 整到與人體領口區域同一列長度一樣長 圖 24 頭部及領口處理流程圖 如圖24所示,最後步驟處理了頭部與領 口部份。讀入切割後的頭部、人體領口、衣服 領口影像,將衣服領口區域移動至人體領口區 域,使其重疊,接著分別計算衣服、人體領口 的每一列中心點的x座標(每一列中心點=每一 列最左邊x座標+每一列最右邊x座標/2),並取 平均值來作為衣服、人體領口區域的中心點, 將計算出的二個中心點相減其偏移量(人體中 心點x座標-衣服中心點x座標),並依照偏移量 移動頭部位置(垂直高度),最後將衣服的領 口區域的每一列線條長度調整到與人體領口 區域同一列長度一樣長。 因為要合上去的衣服領口跟人體圖的頭 不一定為正中間,所以本研究先去算出這個部 份的中心點之後在去移動,合上去的領口大小 不一定都相同大小,因此會調整大小再合成。

圖 26 衣服樣本 2

圖 27 衣服樣本 3

實驗結果 在實驗部份,本研究使用一張人體影像 與三件衣服影像來進行模擬試衣,由圖 25 至 圖 39 可見,本研究的模擬試衣於真實相片上 呈現逼真效果,而且衣服上的圖像文字等,在 模擬試衣後,圖像依然清晰可見並不會過於模 糊或是難以辦識。

圖 28 人體樣本 1


ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

圖 37 實驗成果 7

圖 38 實驗成果 8

圖 29 人體樣本 2

圖 39 實驗成果 9

結論

圖 30 人體樣本 3

圖 31 實驗成果 1

圖 32 實驗成果 2

圖 33 實驗成果 3

圖 34 實驗成果 4

從實驗結果可以看出本研究提出來的方 法在身體部份幾乎看不出有不協調的地方,在 手臂彎曲之後將袖子合成上去的部份看起來 相當正常,符合實際穿上衣服的感覺,從多個 實驗結果可以得知,我們提出來的方法可以使 同一件衣服適用於不同的手臂姿勢。研究中因 礙於論文篇幅,實驗結果中雖然只放三件衣服 樣本,但是從實驗中,還是看得出可試穿同類 型的衣服,以增加使用者試穿衣服的件數進而 增加使用者的選擇。以下兩圖(圖 40、41)可看 出本研究中提出的手臂摺痕演算法有較為顯 著的效果,且能更吸引使用者,實際的參考價 值也相對的增加。

圖 40 無摺痕演算法的雙臂

圖 35 實驗成果 5

圖 36 實驗成果 6


ICDC’09 2009 International Conference on Digital Content. Chungli, Taiwan.

圖 41 經過摺痕演算法改良的雙臂

參考文獻 [1]

Smith, A.R., “Color Gamut Transform Pairs,” Computer Graphics, Vol. 12(3), pp.12-19, 1978. [2] C. Garcia, and G.Tziritas. “ Face Detection Using Quantized Skin Color Regions Merging and Wavelet Packet Analysis.” in IEEE Transactions on Multimedia vol. 1 , No. 3 , pp. 264-277, 1999. [3] Avidan, S., Shamir, A ,”Seam Carving for Content-Aware Image Resizing,” ACM Trans. on Graph., 26, 3, Article 10(July 2007), 9 pages. [4] M. S. Chen, J. Han, and P. S. Yu, “Data Mining:An Overview from a Database Perspective,” IEEE Trans. on Knowledge and Data. [5] J. Han and M. Kamber, Data Mining: Conceptsand Techniques, Morgan Kaufmann, 2000. [6] K. Alsabti, S. Ranka, and V. Singh, “An EfficientK-Means Clustering Algorithm,” PPS/SPDPWorkshop on High Performance Data Mining,1997. [7] Seber, G. A. F., Multivariate Observations, Wiley, New York, 1984. [8] Spath, H., Cluster Dissection and Analysis: Theory, FORTRAN Programs, Examples, translated by J. Goldschmidt, Halsted Press, New York, 1985. [9] Find,EC Consultant 電子商務顧問, 2009, http://netcash.netcash.com.tw/details/ec.as px?id=224 [10] Rafacel C. Gonzalez, Richard E.Woods & Steven L.Eddins 著,數位影像處理:運用 MATLAB 繆紹綱 譯,東海書局,2008. [11] Protopsaltou D, Luible C, Arevalo M, Magnenat-Thalmann N. (2002), “A body and Garment Creation Method for an Internet Based Virtual Fitting Room,” Proc. Of the 2002 International Conference on Computer Graphics, Springer Verlag, pp. 105-122, July.

ASP.net  

ASP.net ln

Read more
Read more
Similar to
Popular now
Just for you