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

3B39
2018/3/5

絵モーション：1 つの絵を描くだけでだれもが容易にさまざまなポーズの絵を描くことを可能にするツール
林 凌平1,a)鈴木 優1,b)

概要：本研究では，1 つの絵からさまざまなポーズを生成することのできるツール「絵モーション」を提案する．キャラクタの絵を描くとき，描くキャラクタが同じ場合であっても，違うポーズを生成するには絵をはじめから描き直す必要がある．近年では，画像データを作成することで違うポーズを生成することのできるソフトウェアが存在する．しかしながら，これらのソフトウェアを使用するにはスキルが必要である．そこで本研究では，だれもが容易にさまざまなポーズの絵を生成することを可能にするツールの開発をする．紙とペンを使用し絵を描き，キャラクタのポーズを人の身体動作から決定することにより，描いた絵のポーズをだれもが容易に生成することができるようになる．

E-motion：a Tool for Easily Generating Various Poses
with a Drawn Picture
Ryohei Hayashi1,a)Yu Suzuki1,b)

Abstract: In this research, we propose a tool “E-motion” which can generate various poses from a drawn
picture. When drawing a picture of a character, it is necessary to redraw the picture from the beginning inorder to generate a diﬀerent pose. Even if the characters to be drawn are the same. In recent years, software
exists that can generate diﬀerent poses by creating image data. However, skill is needed to use such software.
Therefore, in this research, we develop a tool for easily generating various various poses. Introduction I
draw pictures with paper and pen. Next, the pose of the character is determined from the movement of theperson’s body. By doing so, everyone can easily generate poses of the paintings drawn.

1. はじめに成することのできるソフトウェアが存在する．しかしながら，これらのソフトウェアを使用するにはスキルが必要でキャラクタの絵を描くとき，描くキャラクタが同じ場合ある．そのため，これらのソフトウェアを使用するスキルであっても，違うポーズをさせるには絵をはじめから描きのない人は，描画した 1 つの絵に，思い描いたポーズをさ直す必要がある．例えば，はじめに直立しているキャラクせることは難しい．

タの絵を描き，つぎに腕を上げるポーズをさせたいと思っ

本研究では，1 つの絵を描くだけで，だれもが容易にさたときには，少なくとも腕の部分を消して，腕を描き直す

まざまなポーズの絵を描くことを可能にするツールの開発必要がある．全ての部位のポーズを変えたいと思った場合を目指す．

は，すべて描き直さなければならない．このように，ポーズの異なる絵を何度も描き直すのは手間である．
近年では，画像データを作成することで違うポーズを生
1a)b)

宮城大学
Miyagi University, 1-1Gakuen, Taiwa-cho, Kurokawa-gun,
Miyagi 981–3298, Japan
p1422080@myu.ac.jp
suzu@myu.ac.jp© 2018 Information Processing Society of Japan

2. 関連研究1 つの絵からさまざまなポーズを生成することができるソフトウェアはいくつか存在する．例えば，Live2D [1] は，原画を動かしたい部位ごとに分けた画像データを作成し，変形するためのポリゴンを割り当てる．そして，ポリゴンに対して「デフォーマ」「パラメータ」等の編集機能を使

1020

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

3B39
2018/3/5

うことで，絵のタッチをそのままの状態で動かすことを可能にする．しかしながら，このソフトを使用する前提として，画像データを作成するスキルがなければ使用できないことから，だれでも容易にさまざまなポーズを生成することは難しい．
そのほかの類似システムとして Adobe Character Ani-mator [2] がある．Adobe Character Animator では，Photoshop または Illustrator を使い，キャラクタを作成し，体の部位を別々のレイヤーに配置する．そして，Web カメラで顔の表情の動きや音声に合わせて，リアルタイムにキャラクタをアニメーション化を可能にする．ソフトウェアを使用する前提として，画像データを作成するスキルが必要であることは，前途のソフトウェアと同じである．一方で，絵に動きをつける方法は，Web カメラで顔の表情を動かすだけで可能であるため操作しやすい．ただし，このソフトウェアでモーションキャプチャできるのは，顔の表情のみである．

3. ツールの設計
我々は，1 つの絵を描くだけで，だれもが容易にさまざまなポーズの絵を描くことを可能にするツールの開発を目指す．そのために，だれもが容易に絵を描けるようにする
ことと，だれもが容易にポーズを生成できるようにすることの 2 つの要素を取り入れる．

3.1 だれもが容易に絵を描けるようにする方法
だれもが容易に絵を描けるようにするため，紙とペンを使用する方法とる．この動作は，だれもが日常的に行う動作であるため，高度なスキルを要しない．また，紙とペンを使用する描画方法は，絵の質感をそのまま残すことが可能であるため，ユーザの個性を出しやすい．これらの点から，だれもが容易に絵を描くことができる手段として，紙とペンを使用する方法をとることとする．

3.2 だれもが容易にポーズを生成できるようにする方法
だれもが容易にポーズを生成できるようにするため，絵

4. 「絵モーション」の開発
4.1 概要「絵モーション」はユーザが紙に描いたキャラクタを，ユーザ自身が体を動かし再現することにより，キャラクタに思いどおりのポーズを生成させることが可能になるツールである．「絵モーション」の使用の流れは次のとおりである．はじめに，ユーザはこれから描画する体の部位を選択し，部位ごとに絵を描き分けながら描画していく．シス
テムは各部位が描画を終える度に絵を撮影し，データとして保存する．全ての部位の描画を終えたら，ユーザは描いたキャラクタにさせたいポーズを実際にする．システムはユーザの身体情報を取得し，キャラクタに適した関節を定め，得られた身体情報を与える．ユーザはキャラクタにさせたいポーズを生成することができたらスイッチを押す．
スイッチが押されたら，システムは画像を保存する．以上の流れによって，1 つの絵を描くだけで，だれでも容易にさまざまなポーズの絵を描くことを可能にする．本ツールを実現するために次の 4 つの方法を検討した．

• 描画した絵をデータとして保存する方法• 描画中の部位を識別する方法• 絵に適した関節点を定める方法• 絵のポーズを人の身体動作から決定する方法
4.2 描画した絵をデータとして保存する方法
システムは，ユーザが各部位の描画を終える度に絵を撮影していく．しかしながら，撮影した絵には不必要な情報も含まれていることから，背景差分法を用いることで，必要な情報のみを取得する．部位を描画する前の写真を背景画像，部位を描画し終わった写真を入力画像とし，これらの背景差分画像を取得する (図 1)．次に，背景差分画像から輪郭を抽出することによって，背景差分画像の座標 (x,y)と大きさ (width,height) を取得する．最後に，輪郭領域内の背景差分画像の色情報を 1px ごとに取得し点描することで，必要な情報のみを描画する．のポーズを人の身体動作から決定する．絵のポーズを変えるときの方法として，3D モデルを例として考えると，ユーザはマウス操作で部位を回転させ，ポーズを決定する方法が多く見られる．しかしながら，ユーザがその操作方法で絵にさせたいポーズを作成するには，どうやって部位を回転させれば，思い描いたポーズをさせることができるのか考えなければいけない．そのわずらわしさをなくすため，人の身体動作から絵のポーズを決定することとする．この方法をとれば，絵にさせたいポーズをユーザが実際にするだけで実現することが可能になる．
図 1: 2 枚の画像の差分を描画する様子
Fig. 1 Drawing the diﬀerence between two images© 2018 Information Processing Society of Japan1021

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

4.3 描画中の部位を識別する方法

3B39
2018/3/5

4.4 絵のポーズを人の身体動作から決定する方法

ユーザがキャラクタのポーズを変形させるにあたり，思ユーザの身体動作を絵にさせるために kinect を使用し，い描いたポーズをさせるには，描画した体の部位がどこでユーザの骨格情報を取得する．システムは，kinect で得らあるのかをシステムに正しく認識すさせる必要がある．各れた骨格情報から各部位の角度を求める．求められた角度

部位の認識が正しくされていなければ，ユーザの動きに対を絵の関節点に反映させることで，人と同じ動きをさせる

応した動きを，キャラクタにさせることができなくなってことが可能になる (図 4)．

しまう．しかしながら，絵には上手い下手の違いや，キャラクタの骨格の違いがあることから，ユーザが描画した体の部位がどこであるのかをシステムが自動で識別することは困難である．そこで，ユーザが描画する際に，体の部位ごとに描き分けることで，システムが各部位の情報を正しく取得できるようにする．
システムが各部位を正しく認識できるよう，ユーザが描画する際に，どの部位を描画しているのかを知らせるため，からだパズルを作成した (図 2)．各部位のピースが所定の位置にはめられており，ユーザがこれから描画する部位の

図 4: 人の骨格情報を絵に反映させた画面
Fig. 4 The screen reflecting the skeleton information of a human on a picture

ピースを外してから絵を描く．そのときに外れているピースの部位が，描画中の部位であるとシステムは識別が可能になる．

5. 絵に適した関節点を定める方法
人が身体を伸ばしたり，曲げたりできるのは関節があるからである．これは絵を動かすのにも同じことがいえ，関節点がなければ体を動かすことはできない．よって，絵にも関節点を定める必要がある．
関節点を定める方法として，ユーザに関節となる点を指定してもらう方法 [3] も考えられるが，ユーザが子どもである場合を想定すると，関節点を定めるのは困難であると考えられるため，システムが関節点を自動で定める方法を考える必要がある．
そこで，我々は体の部位ごとに絵を描き，部位の付け根

図 2: からだパズルの外観に関節点を定め，ポーズを変えてみることで，違和感がな

Fig. 2 The appearance of the body puzzle

いか試作をしてみた．その結果，描く絵によってポーズに違和感が生じてしまった．描く絵によって，隣接する部位

ピースの底には金属が接着されており，フレームには導の位置関係や部位の形が異なることから体型に違いが生電性インクが塗られている．ピースをフレームにはめる際

じ，関節点にも違いが生じてしまったと考えられる．このに，ピースの底面にある金属と導電性インクが接触するこことから，絵にはそれぞれの体型に適した関節点を定めるとにより電流が流れ，システムはピースがはまっているこ必要があると考えた．とを認識する (図 3)．

そこで，それぞれの絵に適した関節点を定める方法を検討した．部位をいくつも描き分けることは手間になるため，最小限の関節の数に減らし，頭と腕と脚の 3 種類とする．なお，描く絵の対象は二足歩行型とし，正面向き，直立，腕は横に伸ばして絵を描くこととする．

5.1 各部位の関節点を定める方法の検討
まず，頭の関節点の定め方を検討をした．関節点の水平方向の座標は正面向きで描くことを条件としているため，
図 3: からだパズルのしくみ
Fig. 3 Mechanism of the body puzzle

頭の幅の中点とした．垂直方向の座標の定め方については

3 種類の高さと，頭と体を連動させて動かす方法の 4 種類を検討した (図 5)．点線は関節点を定めるのに使用したガ© 2018 Information Processing Society of Japan1022

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

3B39
2018/3/5

イド，バツ印は関節点を表す．

(1)

(2)

(3)

(4)

図 5: 頭の関節点の位置

図 8: 実験で被験者に見せた画面

Fig. 5 Position of head joint

Fig. 8 The screen shown to the subject in the experiment

次に，腕の関節点の定め方の検討を行った．関節点の垂5.3 アンケートの結果直方向の座標は，高さの中点とした．水平方向の座標につ実験の結果，首が太いキャラクタの頭の関節点を除いたいては，腕を回転させたときに，肩が外れて見えないよう，全ての体型の絵から，適しているといえる関節点の位置を内側に関節点を置くことを考え 3 種類を検討した (図 6)．

定めることができた [4]．
頭の関節点については，アンケートの結果から，(2) と(4) の方法を合わせた方法を提案すれば，よりよい関節点を定めることができると考えられる．腕の関節点について
は，腕が長い絵は (1) の方法，腕が短い絵には (3) の方法を適応させることが最も適している．脚の関節点について
(1)

(2)

(3)

図 6: 腕の関節点の位置

は，脚が縦長の絵は (1) の方法，脚が短い絵は (4) の方法，頭と体が一体の絵は (2) の方法を適応させる．

Fig. 6 Position of arm joint

6. まとめと今後の展望
次に，脚の関節点の定め方の検討を行った．絵によって脚の生え方が異なることと，腰のあたりから脚を回転させる方法を考慮し，6 種類を検討した (図 7)．

本研究では，1 つの絵を描くだけで，だれもが容易にさまざまなポーズの絵を描くことを可能にするツール「絵モーション」の開発を行った．これにより，画像を作成するスキルがない人でも絵のポーズを容易に変えられるようになった．
本研究の制限として，キャラクタに与えられるのは骨格情報から得られた角度のみであるため，各部位の傾きは(1)

(2)

(3)

正確であるが，部位間の相対関係は不正確である．また，キャラクタのポーズの変更は，各部位の傾きを変えることで表現しているが，より人の身体動作を忠実に再現するた
めには，画像の伸縮・湾曲させる必要がある．
今後の展望としては，本研究では，絵の描画のしやすさを重視し，描き分ける部位を 6 種類としたが，描画の際に，

(4)

(5)

(6)

図 7: 脚の関節点の位置より細かい描き分けを可能にすれば，ユーザの身体動作をより忠実にキャラクタに再現させることが期待できる．

Fig. 7 Position of leg joint

参考文献

5.2 アンケートの実施

[1]
[2]

検討した関節点の定め方を使用し部位を動かしたときに，どの定め方を使用することが絵に適しているのかを確認す[3]

るためのアンケートを，大学生 15 人に実施した [4]．人の骨格と 6 種類の絵を並べ，検討した関節点の定め方を，それぞれの絵に適応させ，頭４種類，腕 3 種類，脚 6 種類の順に，部位を回転させるアニメーションを見せた (図 8)．

© 2018 Information Processing Society of Japan

[4]

Live2D.http://www.live2d.com/ja/
Adobe Character Animator.
https://www.adobe.com/jp/products/characteranimator.html
鈴木啓晃, 岡良祐, 宮岡伸一郎. 人物イラストのポーズ変更ツールの開発. 情報処理学会第 73 回全国大会公演論文集, pp.481-482, 2011 年.
林凌平, 鈴木優. 部位ごとに描き分けられた絵の関節点を一意に定める方法の検討. エンタテインメントコンピュー
ティングシンポジウム 2017 論文集, pp.163-167, 2017 年.

1023