情報処理学会 インタラクション 2014
IPSJ Interaction 2014

C2-6
2014/3/1

iMake : 画像からアイメイクを生成するシステムの提案
西村

綾乃1

椎尾

一郎1

概要：アイメイクには通常のメイク方法の他に，音符や蝶などのキャラクターやシンボルをモチーフにした派手なアイメイク，いわゆるアイメイクアートが存在する．しかしながら，アイメイクアートはもちろん，通常のメイクでさえ難しいと感じる女性が多いのが実情である．そこで，本稿では画像からアイメイ
クのデザインを作り出すシステム「iMake」を提案し，実装した．本システムは，ユーザが任意に選択した
画像から色や特徴を抽出し，アイメイクのデザインに反映させ，更には転写シールに印刷することで，システム上で生成したデザインを現実世界で使用することが可能である．

iMake : An Eye Makeup Design Generator
Nishimura Ayano1

Siio Itiro1

Abstract: In addition to the standard makeup, ﬂashily eye makeup with the motif of character or symbol
such as a butterﬂy or note also exist. There are called “artistic eye makeup”. However, needless to say, it isdiﬃcult to apply “artistic eye makeup” for common people. Some females even feel it diﬃcult to makeup in
the standard way. Therefore, we propose and implement a computer aided eye make system named “iMake”.
This system generates eye makeup design from images by extracting color and characteristics from given
image that is selected by a user. Then, it prints the designed eye makeup pattern to a transfer seal that canbe applied to eyelids.

1. はじめに瞼にグラデーションを作り，更にその上からアイライナー
で目の縁に線を引くことでおおよそが完成する．そこか

第一印象は顔で決まると言っても過言ではない．web

ら，ビューラーを使い，まつ毛をカールさせ，マスカラや，

アンケート調査機関が行った第一印象に関するアンケー

つけまつ毛を施していくのが基本的なアイメイクの手順で*1

ト では，初対面の相手と互いに立って挨拶する際に，まず相手のどこを確認するか，という質問に対し，回答は男
女ともに「顔全体」が過半数以上を占めている．

ある．
その他にも，アイライナーを用いて細やかな模様や絵を描いたり，多数のアイシャドウを用いることで豊かな色彩

その一方で，化粧を施すことで顔の印象を変えることはを表現し，目元を派手に見せるアイメイクアート（図 1）

容易である．化粧は女性の身だしなみの一環であると言わが存在する．これらのデザインの多くは，何かをモチーフれると共に，多くの女性が化粧に関心を持っている．加えとしており，図 1 に示した音符や蝶などだけではなく，アて，最近では，化粧をする男性も珍しくはない．そして，ニメやゲームのキャラクターをモチーフにしたアイメイク

化粧の中でも特に，アイメイクは重要な部分であり，アイ

アートも存在する．

シャドウの色やアイライナーの引き方を少し変えるだけ

しかしながら，図 1 に示すようなアイメイクアートは専で，顔の印象が違ってくる．そこで，筆者らはアイメイク

門のメイクアップアーティストが行うものであり，高度なに着目し，これを支援するシステムを開発した．

技能を必要とする．プロや手先が器用な人は鏡を見ながらアイメイクは通常，4 - 5 色程のアイシャドウを使用し，
1*1

お茶の水女子大学大学院理学専攻情報科学コース
Ochanomizu University, Bunkyo, Tokyo 112-8610, Japan
http://c.filesend.to/plans2/ranks/body.php?dalist=20130314 1© 2014 Information Processing Society of Japan

自身の顔に絵や模様を描くことができるが，大半の女性は基本的なアイメイクの手順に含まれる，アイラインを引くことでさえ失敗することがある．また，手元にあるアイ

618

図 1

アイメイクアートの例.

Fig. 1 Example of artistic eye makeup.

シャドウの色が足りずアイメイクアートを断念せざるを得ない場合や，使う機会の少ない派手なアイシャドウの色は入手困難な場合が多い．アイメイクアートを誰でも簡単に施すことが出来，更には基本的なアイメイクも苦労することなく短時間で行えるようなシステムがあれば，新しいア
イメイクの方法として普及するだろう．
そこで本論文では，画像からアイメイクのデザインを生成し，転写シールに印刷することで実際に利用することができるシステム「iMake」を提案する．

図 2

iMake 利用の流れ.

Fig. 2 The flow of making-up by iMake.

2. iMakeiMake は，キャラクター及びシンボルなどの画像から色や特徴を抽出し，アイメイクのデザインを作り，アイメイクを実施するシステムである．
図 2 に本システムの使用の流れを示す．アイメイクのデ
ザイン生成にはユーザが任意に選択した画像を利用する(図 2(a))．ユーザの好きなキャラクターやシンボルから色や特徴を捉えアイメイクのデザインを作り出し，これを身

図 3(左) 転写シールと (右) 通常のメイクの比較.

Fig. 3 Comparison of eye make by transfer seal (left), andstandard makeup (right).

2.1 転写シールに着けることによって，メイクそのものに愛着や意義が転写シールには家庭用のインクジェットプリンタで印

生まれることが期待できる．また，図 2(a) に示すように，刷することが可能なものを用いた．これは，車体，クリア

ユーザは，選択した画像の中でデザインに特に強く反映しファイル，肌などにシールとして貼ることのできる市販のたい箇所を指定することが可能である．本来，画像の特徴

印刷用紙である．使用する際には，絵の周囲を切り取り，をアイメイクのデザインに反映するには，メイクアップを水で濡らして貼り付ける．実際に転写シールがアイメイク

行う人間の技量やセンスが必要とされる．本システムを利のための化粧道具の代わりとして利用できるのか確認す

用することで，図 2(a) のように画像の中で特徴として活かるために，同じデザインのアイメイクを，通常のメイク方

したい部分をユーザが指定するだけで，自動的にアイメイ

法と転写シールを用いたものとで実施し，比較した．図 3

クのデザインを生成できる．デザインを生成する際に，図から分かるように，転写シールのアイシャドウ部分は発色

2(b) にてアイシャドウのグラデーションの作成や，図 2(c)が良く，色が綺麗に表現されている．また，アイライン部

で特徴を反映する処理を行う．これらの詳細は，次節で説分も違和感なく表現することを確認した．以上から，転写明する．

シールにアイメイクを印刷して利用することは有効である

また，デザインの派手さや色の濃さをユーザが調整できと考えられる．

る仕様にすることで，派手なアイメイクアート，普段使う本システムでは，作成したアイメイクのデザインを印刷

ような基本的なメイク，その中間にあたるような，結婚式

し，そのまま貼り付けるため，ユーザの化粧スキルに関わなどのドレスに合わせたアイメイクのデザイン，文化祭やらず，シミュレーションした通りのデザインを表現するこ

お祭りでの仮装のようなアイメイクのデザイン，ミュージとが可能である．更には，インクジェットによる印刷で，カルなどの舞台に立つ場面での特殊なデザインなども容易

多数の色が利用できることから，従来のように手元に多くに作り出すことが可能である．

の化粧品を置くことが不要となる．

ユーザはこうして完成したアイメイクのデザインを転写
シールに印刷し，図 2(d) に示すように，これを瞼に貼り付以上の利点により，アイメイクにおける多くの女性の悩みを解決できると考えている．

けることでアイメイクを実施できる．

© 2014 Information Processing Society of Japan619

図 4 アイメイクの３要素.

Fig. 4 Three elements of eye makeup.

図 6

アイシャドウ作成方法．(a) オリジナル画像を (b)8 色の代表色に減色し (c) 8 色の代表色の画素数を計数する．矩形の面積はそれぞれの色の画素数の割合を表す．(d) これを同色系グ
ループに分類し画素数の多いグループ順にならべる．グループ
内に複数の代表色がある場合はそれも画素数の多い順にならべる． (e) 代表色矩形のギャップをグラデーションで埋める．
ただし，この図で示した色と面積は説明のために作成したもの

図 5

特徴に反映させたい箇所の選択.

Fig. 5 Selection of the feature area.

で，正確ではない．

Fig. 6 Generation of eye shadow. (a) Original image, and (b)reduced-color (8 colors) image. (c) Each size of 8 color
box reflects the number of pixels with the color. (d)3. アイメイクデザイン生成
本節では，ユーザが任意に選択した画像からアイメイクのデザインを作り出す手法を説明する．本システムではアThe color boxes are grouped to 19 color groups, andsorted by number of pixels in each color group and reduced color. (e) Gaps between color boxes are filled bygradation. Note: colors and box-size used in this figure
are not precise.

イメイクのデザイン要素を「アイシャドウ」「アイライン」「アイペイント」の３要素に分類し，構造を単純化した (図なお，本システムは，Mac OS X の Xcode 開発環境上で4)．アイシャドウ，アイラインはメイク用語として一般的OpenGL 及び，OpenCV ライブラリを利用して，C++にに使われる用語である．これらに加えて本稿では，図 4 により開発した．

示すような，通常のアイメイクには現れないような模様やデザイン部位のことをアイペイントと呼ぶことにした．以上のように，アイメイクのデザインを３要素に分類することで，システムによる生成を容易にした．

3.1 アイシャドウ
アイシャドウを施す時に，最も難しい過程は，グラデー
ションの作成である．通常は瞼にアイシャドウパウダーを現段階の実装では，まず初めにユーザは任意の画像を選のせた後，指で擦ったり，綿棒などを使うことによって色択し，次に，アイメイクのデザインに，より顕著に特徴とと色の間をぼかし，グラデーションを瞼の上に作成する．

して反映させたい特徴領域を，図 5 に示すように矩形で選しかしながら，本システムを利用して，自動的にグラデー択する．この画像とユーザが選択した矩形の特徴から，アションを作成することにより，ユーザが自身の手でアイ

イシャドウ及びアイペイントを自動生成し，あらかじめ用

シャドウパウダーを使ってグラデーションを作成した時よ意されたアイラインを組み合わせることで，アイメイクのりも，より自然で美しいグラデーションを表現することがデザインが作り出される．ユーザは，本システムによって可能になる．

生成されたデザインを転写シールに印刷し，絵の周囲を切アイシャドウを作成するために，まず初めに，ユーザがり取り，瞼に貼ることで，アイメイクを施すことが可能で提供した画像から代表的な色を 8 色選択する．代表色を 8ある．

色とした理由は，アイメイクを行う際に，通常は 4 - 5 色程

© 2014 Information Processing Society of Japan

620

度のアイシャドウパウダーを瞼に置き，これをぼかしてグ
ラデーションを作る事から，置いた色とそれぞれの中間の色の数である 7 - 9 色があれば，瞼を覆うのに十分なグラデーションが作れると考えたからである．そこで，図 6(b)に示すように，画像を K-means クラスタリングにより 8 色に減色し，それにより得た色を代表色とした．
通常のメイク方法でアイシャドウを作る場合，テーマとなる色を目の内側に使うことが多い．本システムにおいてもより画素数の多い代表色を画像を表現する色と考えて，より内側に配置することを考えた．しかしながら，画素数
順に機械的に並べてしまうと，画像によっては同系色が離散的に配置され縞模様状になり，不自然になる場合がある
ことがわかった．
これを避けるため，減色により取得した 8 代表色 (図6(c)) を，まず同系色にグループ化した (図 6(d))．ここで用いた同系色グループは，白，黒，灰，茶，肌，橙，カー

図 7

蝶から自動生成したアイシャドウとアイライン.

Fig. 7 Generated eye shadow and eye line from butterfly.

キ，黄，黄緑，深緑，緑，水色，青，群青色，紺，紫，ピンク，マゼンタ，赤の 19 色である．このグループは，マンセル表色系*2 を参考に，化粧に適した色分けに修正したものである．代表色の RGB 値を HSV 値に変換し，色相，
明度，彩度を判定し，この同系色グループに振り分けた．
このグループ化において，白および黒に振り分けられた代
表色については，アイシャドウの色として不適切と考え，以下の処理から除外することにした．こうして 8 代表色を同系色にグループ化した後に，画素の多い同系色グループ
をより内側に配置する．同じ同系色グループ内に 2 種類以
上の代表色が割り当てられた場合には，画素の多い代表色を，グループに割り当てられた領域の内側に配置する．これにより，8 色の代表色に対して，色の変化を自然に保ちつつ，色数の多い代表色が内側に配置される傾向にある配置順を実現した．

8 色の代表色の配置順が確定したところで，次にそれぞれの色の表示幅とグラデーションを施す幅を決定する．前図 8

初音ミクから自動生成したアイシャドウとアイライン.

Fig. 8 Generated eye shadow and eye line from Miku Hatsune.

述と同じく，画素数の多い代表色が画像を表現する色と考えて，画素数の多い代表色には幅の広い領域を割り当てた．

させている．

この際に，隣り合う代表色を隣接させず，色領域の間に適当な幅の空間を設けて，そこを OpenGL のグラデーション
機能を使って滑らかに接続した (図 6(e))．

3.2 アイペイント
アイペイントは，ユーザが矩形で指定した特徴領域 (図以上の手順で作成したアイシャドウの例を図 7，図 8 に5) の画像から作成する．多くのアイメイクアートのデザイ示す．ここでは，アイシャドウの下に後述する黒色アイラ

ンにおいて，アイペイントは図 1 に示すように，目尻部分インも描かれている．図 7，図 8 の結果より，アイシャド

が持ち上がるようにモチーフを描くことが多い．そこで，

ウのグラデーションがユーザが提供した画像の特徴色を反アイペイント領域の形状として，図 9(a) のような図形を用映していることを確認した．なお，上記の手順で画素数を意した．これは，右目に適用する図形であり，左目に適用計数する際に，ユーザが特徴領域として指定した矩形領域

する場合は画像の反転を行う．この図形に合わせ，ユーザの画素数を３倍することで，特徴領域の色をより強く反映が選択した特徴領域矩形 (図 9(b)) の画像をテクスチャとして貼り付け，変形させることで，アイペイントを生成す*2

マンセル表色系 (Munsell color system) とは，色を定量的に表す体系である表色系の 1 つ．色彩を色の三属性（色相，明度，彩度）によって表現する．

© 2014 Information Processing Society of Japanる (図 9(c))．これを，目尻部分に付加することでデザインの一部とした (図 10)．一方，図 11 には，初音ミク画像の621

4. 関連研究
日々のメイクアップ技術の向上支援やシミュレーションなどのシステムについて，多くの研究や実装が行われている．例えば，ユーザの写真などから顔を認識・検出し，ユー
図 9(a) テクスチャを貼り付ける図形 (b) 選択範囲内の画像(c) 生成されるアイペイント.

Fig. 9 (a) Eye paint area, (b) Image in the selection(c) Generated eye paint.

ザの顔の上にメイクを施した様子を画面上に提示するシ
ミュレーションシステムが数多く存在する [6][12][14]．このうち [11][4] は，メイクアップシミュレーション及び人肌のリアルな質感表現に注目している．また，他者のメイク
アップデザインを参考にして，ユーザの顔画像上でシミュ
レーションを行うシステム [3][10] や，システムがユーザに似合うメイクアップ方法を提示し，シミュレーションを行図 10生成されたアイメイクデザイン.

Fig. 10 Generated eye makeup design.

う研究もある [9]．その他にも，ユーザが自身の顔に実施した実際のメイクアップに対してアドバイスする機能を持つ
３次元メイクアップアドバイスシステム [15] や，ディスプレイの上部に高解像度カメラを設置することで，メイク作
業箇所へ自動的にズームしたり，メイク完了後の写真をログとして保存することが可能なシステム [13] も研究されている．また，ユーザが化粧品に付けた RFID タグをシステ
ムに読み取らせると，その製品を使って化粧を施した結果
を，カメラで撮影しているユーザの顔に対してシミュレー
ションするシステムもある [8]．更には，コンピュータ上で顔の上にメイク，ヘアアレンジ，フェイスペイントを施しカモフラージュアートを示すことで，メイクアップアー
ティストやデザイナーを支援するシステムがある [2]．また，ユーザが施した化粧画像をログとして保存し，web 上
で他者と共有することで化粧のバリエーション増加を支援するものがある [7]．その他には，ユーザーの写真から肌の色調を検出し，化粧品を推薦するようなモバイルサービス

図 11

初音ミク画像の一部を選択し生成されたアイペイントを用いたアイメイクデザイン.

Fig. 11 Final design with eye shadow and eye paint that is
generated from the selected box.

一部から作成したアイペイントを用いたアイメイクデザイ
ンを示す．

3.3 アイライン

に関する研究もある [5]．
非日常の化粧支援として，演劇（京劇）における化粧デザイン支援の研究がある [1]．ここでは京劇における化粧のデザインを，目，鼻，口などの部位に分けて組み合わせ，

3D レンダリングすることで，新しい化粧のパターンを作成してユーザに提示している．
以上は，シミュレーションや SNS を用いてメイクアップ
技術の向上を支援する目的で研究されていた．本研究は，アイメイクの結果を転写シールに出力することで，ユーザ

アイラインは多くの女性にとって，最も難易度の高い部のメイクアップ技術や所有する化粧品，道具の種類に関係分である．メイクの際に使う道具に関しても，リキッドやなく，優れたメイクアップを実現することを目的としてペンシル，ジェルライナーなど多数の種類が存在し，更にいる．

は，特にメイクが落ちやすい部分でもある．本システムでは，アイラインもデザインの中に含めることで，印刷した

5. まとめ及び今後の予定

転写シールを貼るだけで瞼に再現することが可能になる．
現段階の実装では，アイラインの形及び色については，あらかじめ用意した１種類のみである．

ユーザが用意した任意の画像からアイメイクのデザインを生成し，転写シールに印刷することで，実際にアイメイクとして利用が可能になる手法を提案し，実装を行った．

© 2014 Information Processing Society of Japan622

現段階の実装では，画像を K-means クラスタリングにより 8 色に減色し，RGB 値を HSV 値に変換することで色のグループ化を行い，画素数による並べ替えを実行すること[3]

で，特徴色を反映したアイシャドウのグラデーションを生成する．これに加えて，ユーザが選択した画像の特徴領域[4]からアイペイントを作成する．
今後，以下に示す様々な機能を実装して，より多様なア
イメイクデザインを実現させたいと考えている．
現在は，アイシャドウを生成する場合，取得した色を並[5]べ替え，グラデーションを施しているが，今後は，本来のアイメイク方法により近いグラデーションに近づけたい．
アイペイントについては，画像の流線方向を検出すること
で引き伸ばし方向を自然にし，更により多くの特徴を抽出[6]

し，デザインに反映したい．現時点では，アイペイントの形状を図 9(a) としているが，今後は画像から輪郭や特徴的な形を抽出し，マスク画像として利用することで，より[7]

バリエーション豊かなアイペイントの生成を目指したい．
アイラインについても，画像から抽出した色を反映することで色を複数選択可能にしたり，一重や二重，奥二重など
様々な目の形に対応できるよう実装する予定である．その[8]

他にも，ツリ目やタレ目など顔の印象を変えるようなアイ
ラインの引き方のテクニックにも対応したい．現在の実装
では，ユーザが調整できる要素は特徴領域の選択のみであるが，今後は，アイペイントの派手さ，色の明るさや，鮮やかさも調節できるようにしたい．
また，単色画像や白黒画像について考慮が成されていな[9]

いため，そのような画像でもアイメイクのデザインを生成できるようなアルゴリズムを開発したい．更には，複数のデザイン生成結果を提示し，その中からユーザが気に入っ[10]たものを選択することができる機能を検討している．そして，気に入ったデザイン及び元画像はデータベースに保存[11]

し，いつでも呼び出せる機能，SNS を通して生成したア
イメイクのデザインを他者に公開できる機能などを拡張したい．
瞼の上のデザインだけではなく，目の下の部分もアイメ
イクとしては重要な部分である．そこで，上下ともにデザインが行えるようシステムを拡張したい．また，ユーザの[12]

顔画像を入力することで，実際に身につけた際のアイメイ
クのデザインのシミュレーションを行うような機能も検討している．さらには，Web アプリケーションとして公開す[13]ることで，様々なデバイスに対応できるようにしたい．
参考文献
[1]

[2]

Cai, F. and Yu, J.: Transactions on Edutainment IV,
Springer-Verlag, Berlin, Heidelberg, chapter A Real-time
Interactive System for Facial Makeup of Peking Opera,
pp. 256–265 (2010).
Feng, R. and Prabhakaran, B.: Facilitating Fashion© 2014 Information Processing Society of Japan

[14]

[15]

Camouﬂage Art, Proceedings of the 21st ACM International Conference on Multimedia, MM ’13, New York,NY, USA, ACM, pp. 793–802 (2013).
Guo, D. and Sim, T.: Digital face makeup by example,
2013 IEEE Conference on Computer Vision and Pattern Recognition, Vol. 0, pp. 73–79 (2009).
Huang, C.-G., Lin, W.-C., Huang, T.-S. and Chuang, J.H.: Physically-based Cosmetic Rendering, Proceedingsof the ACM SIGGRAPH Symposium on Interactive 3D
Graphics and Games, I3D ’13, New York, NY, USA,ACM, pp. 190–190 (2013).
Jain, J. and Bhatti, N.: Snap and Match: A Case Studyof Virtual Color Cosmetics Consultation, CHI ’10 Extended Abstracts on Human Factors in Computing Systems, CHI EA ’10, New York, NY, USA, ACM, pp. 4743–
4754 (2010).
Liu, L., Xu, H., Xing, J., Liu, S., Zhou, X. and Yan,S.: ”Wow! You Are So Beautiful Today!”, Proceedingsof the 21st ACM International Conference on Multimedia, MM ’13, New York, NY, USA, ACM, pp. 3–12
(2013).
Nakagawa, M., Tsukada, K. and Siio, I.: Smart Makeup
System: Supporting Makeup Using Lifelog Sharing, Proceedings of the 13th International Conference on Ubiquitous Computing, UbiComp ’11, New York, NY, USA,ACM, pp. 483–484 (2011).
Rahman, A. S. M. M., Tran, T. T., Hossain, S. A. andSaddik, A. E.: Augmented Rendering of Makeup Features in a Smart Interactive Mirror System for Decision
Support in Cosmetic Products Selection, Proceedings ofthe 2010 IEEE/ACM 14th International Symposium
on Distributed Simulation and Real Time Applications,
DS-RT ’10, Washington, DC, USA, IEEE Computer Society, pp. 203–206 (2010).
Scherbaum, K., Ritschel, T., Hullin, M., Thormählen,T., Blanz, V. and Seidel, H.-P.: Computer-suggested Facial Makeup, Comp. Graph. Forum (Proc. Eurographics
2011), Vol. 30, No. 2 (2011).
Tong, W.-S., Tang, C.-K., Brown, M. S. and Xu, Y.-Q.:
Example-Based Cosmetic Transfer, Computer Graphics
and Applications, Pacific Conference on, Vol. 0, pp.
211–218 (2007).
Tsumura, N., Ojima, N., Sato, K., Shiraishi, M.,
Shimizu, H., Nabeshima, H., Akazaki, S., Hori, K. andMiyake, Y.: Image-based Skin Color and Texture Analysis/Synthesis by Extracting Hemoglobin and Melanin
Information in the Skin, ACM SIGGRAPH 2003 Papers, SIGGRAPH ’03, New York, NY, USA, ACM, pp.
770–779 (2003).
Wang, S., Wang, Y. and Li, B.: Face Decorating System
Based on Improved Active Shape Models, Proceedingsof the 2006 ACM SIGCHI International Conference
on Advances in Computer Entertainment Technology,
ACE ’06, New York, NY, USA, ACM (2006).
岩渕絵里子，椎尾一郎：電脳化粧鏡 : メイクアップを効果的に支援するための電子的な鏡台 (生活におけるイ
ンタラクションへの挑戦)，情報処理学会研究報告. HCI,
ヒューマンコンピュータインタラクション研究会報告，Vol. 2008, No. 79, pp. 1–8 (2008).
古川貴雄， 塚田章：解説魔法の化粧鏡–実時間顔画像認識に基づくメークアップシミュレーション，画像ラボ，
Vol. 13, No. 10, pp. 34–38 (2002).
高木佐恵子：メイクアップ技術上達のためのアドバイス
システム，芸術科学会論文誌，Vol. 2, No. 4, pp. 156–164(2003).

623