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

2C63
2018/3/5

人物シルエットをペンライトアート風に表現するシステム
土屋 桃子1,†1,a)伊藤 貴之1

新田 善久2

Michael Neﬀ3

Yuhan Liu3,†2

概要：ペンライトアートとは，ペンライトで空中に絵を描き，光の軌跡を記録するアートのことである．
1 枚のペンライトアート写真を制作するには約 10 秒から 20 秒を要すると言われている．よって，ペンラ
イトアート写真をつなぎ合わせたペンライトアート動画を制作するには膨大な時間を必要とする．そこで我々は，実時間でペンライトアート風ビデオが作成できるシステムを提案する．また，本システムを用いてインタラクティブ作品を制作することで，鑑賞者も参加できるペンライトアート風ビデオを実現する．
現段階では，人物シルエットをペンライトアート風に表現する．さらに本報告では，本システムの応用例としてインタラクティブ作品を制作し評価した結果を示す．

A System for Light-Art-Like Representation of Human Silhouettes
Momoko Tsuchiya1,†1,a)Takayuki Itoh1

Yoshihisa Nitta2

Michael Neff3

Yuhan Liu3,†2Abstract: Light art represents various objects by a light stroke drawn in the air. It takes 10 to 20 seconds tocreate a light art picture. We could create a light art movie by binding the pictures. It is a time-consuming
task because we need large number of frames to create a movie. Based on this discussion, we developed asystem incorporates interactivity into light art so the system can represent a new light art. For now we focus
on human silhouettes for light art like representation. As an example application of this system, we createdan interactive art work and conducted an evaluation.

1. はじめに
ペンライトアート（図 1）とは，カメラのシャッタースピードを長時間に設定し，その間ペンライトで空中に絵をライトアートビデオを制作するには膨大な時間が必要となる．そこで我々は，このペンライトアートビデオを実時間で制作することで，実時間でペンライトアート風ビデオを制作できるシステムを開発した．

描き，光の軌跡を記録するアートのことである．ペンライ
トアート写真を何枚もつなぎ合わせることで，ペンライトアート動画を制作することができる．1 枚のペンライトアート写真を作成するのに 10 秒から 20 秒かかると言われている．ペンライトアートビデオを制作するには大量のペンライトアート写真を制作しなくてはならないため，ペン123†1†2a)

お茶の水女子大学
2-1-1 Otsuka Bunkyo-ku Tokyo, 112–8610, Japan
津田塾大学2-1-1 Tsuda-chou Kodaira-shi Tokyo 187-0025, Japan
University of California
1 Shields Ave, Davis, CA 95616, USA
現在，お茶の水女子大学
Presently with Ochanomizu University
現在，カリフォルニア大学デイビス校
Presently with UC Davistsuchiya.momoko@is.ocha.ac.jp© 2018 Information Processing Society of Japan

図 1: ペンライトアート写真 [1]

本研究の位置づけはメディアアートに近い．メディア
アートとは，映像や音声などのマルチメディアを利用した作品を指し，コンピュータ技術の発展とともに同様に発展を続けてきた．そこで本研究ではメディアアートの中でも，インタラクティブアートに着目した．インタラクティ

771

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

2C63
2018/3/5

ブアートは，観客が参加をすることで楽しむものであり，が動くことによって，背景にエフェクトを残すことが可能

今後もさらなる発展が見込まれる．本研究ではコンピューとなり，自分自身が動くことでアートを制作することがでタを用いて，ペンライトアート風ビデオを制作することかきるシステムである．VIDEOPLACE[2] は，人物シルエッら，このインタラクティブアートの特徴を採り入れることトとコンピュータグラフィックスを融合させたシステムとができないかと考えた．一方，従来のペンライトアートビなっている．このシステムでは，違う部屋にいる人とのイデオでは，鑑賞者はその作品にリアルタイムに参加するこンタラクションを体験することが可能となっている．そのとはできないが，インタラクティブアートは誰でもリアル

他にも，人物の影にさまざまな色やデザインで装飾したシタイムに参加することができ，参加をすることで完成されステム [4] であったり，パーティクルで表現するようなイるアートであるともいえる．そこで本システムを用いて，ンタラクションシステム [5] も開発されている．これらのペンライトアート風のインタラクティブ作品を制作するこ研究では，人物を捉えるために普通のカメラから画像処理とで，従来のペンライトアートでは実現できなかった「鑑によって人物シルエットを抜き出している．

賞者も参加できるペンライトアート風ビデオ」を目指した．
本手法の課題として，画像処理や CG の技術を応用した

2.2 手描き風の線画表現

ペンライトアート風の線画表現があげられる．ペンライト

Curtis らのシステム [6] では，3D アニメーションからアートは人が手で描いているため，手描き風の線を生成し手描き風に変換したビデオを出力する．このアルゴリズムなくてはならない．またペンライトを用いて描いているたでは，ベクター場とパーティクルを用いて手描き風の線をめ，ペンライトの色であるネオン色を表現しなくてはなら表現している．しかし，1 フレームあたり 50 60 秒の処理ない．本研究では線画表現処理をいくつかの段階に分け時間がかかるため，実時間処理には向いていない．そこでて，ペンライトアート風の線画を表現するための処理を実Haller らのシステム [7] では，Curtis らの手描き風アルゴ装した．さらに本システムでは，実際のペンライトアートリズムを実時間で処理できるよう改善し，AR システムをでは表現できないようなデジタルエフェクトをいくつか追開発した．カメラを通して周囲を見ることで，周囲を手描加した．

き風に見ることができる．しかし，各フレームごとに手描また，ペンライトアートによるインタラクティブアート

き風の線を表現しているため，映像がちらついているよ作品を制作するためには，運動する物体の線画表現を実時うに見えてしまう．本研究では，手描き風に変換する線を間で処理することが重要となる．そこで我々は高速な線画限定したことで，ちらつきを抑える処理を行った．Wood

処理アルゴリズムを実装するとともに，対象物を「人物」

ら [8] は図形を手描き風に出力する Processing 言語のライに定め，その輪郭線抽出を専用ハードウェア（本研究ではブラリを公開している．我々のシステムでも Wood らの手Microsoft 社の Xbox One Kinect）に頼ることにした．

描き風描画のアルゴリズムを実装した．

本報告では，ペンライトアート風に人物シルエットを描くシステムを提案する．本システムを利用することで，従3. 提案手法

来のペンライトアートでは実現できなかった鑑賞者の参3.1 概要

加が可能になる．本システムでは，撮影画像のうち人体が( 1 ) 深度を用いたエッジ検出

写っている画素の深度 (距離) にもとづき，エッジを実時間( 2 ) エッジの簡略化で検出する．次にエッジの簡略化により，エッジを構成す( 3 ) 手描き風描画

るピクセルの中から特定のピクセルを選んで線画のための( 4 ) ネオン風描画制御点とする．次に，制御点の移動処理によって手描き風( 5 ) エフェクトの付与の線画に近い図形を形成し，ペンライトアート表現のため

なお現時点での著者らの実装では，Microsoft 社の Xboxのネオン風描画を適用することでエッジを描く．最後に，

One Kinect の深度センサと人物認識ライブラリを利用しペンライトアートをより印象深くするためにエフェクトをている．

付与する．
また本報告では，本システムを利用した動画作品の制作例を提案する．

2. 関連研究2.1 人物インタラクション

3.2 深度を用いたエッジ検出
本システムでは，Kinect に内蔵される深度センサを利用して深度を取得し，それを濃淡でイメージ化することによりエッジを検出する．この方法により，身体に重なる手などの部分のエッジも検出できるようになる．そこで，人物を対象としたインタラクション作品の例として Rec-

人体と認識された画素における深度の最大値と最小値をollection Six[3] がある．これは，人物シルエットにさまざ「0(黒) 255(白)」で正規化する．D を人物領域内におけるまなエフェクトをリアルタイム付与する作品である．人物

深度情報，DepthMax,DepthMin を人体領域内における最© 2018 Information Processing Society of Japan772

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

2C63
2018/3/5

大の深度情報と最小の深度情報として，以下の式により正き風描画を実装した．

規化結果 R を求める．

dnor =

255 × D(x, y)
DepthM ax − DepthM in(1)深度を正規化した濃淡画像の例を図 2a に示す．図 2b は濃淡画像 (図 2a) からエッジを検出した結果画像である． 身体に重なる手部分と身体部分の濃淡に差が出ていることで，手のエッジを検出できた．なおエッジ検出には，OpenCVライブラリに実装されている Canny の手法を利用した．
図 4: 選択したノード

本システムは，始点・終点・形状頂点のノードを選択し，それぞれの位置を乱数的に移動する．しかし，ただ乱数的に移動するのでは，フレーム間でのノード位置の連続性が(a) 濃淡画像(b) エッジ検出画像

図 2: エッジ検出画像

失われてしまう．そこで我々は，一つ前のフレームを参照し，現フレームのノードの位置に対応する前フレームのノードがあれば，その座標に乱数を加算し配置するよう3.3 エッジの簡略化に実装した．実装方法を図 5 に示す．まず，現フレームのエッジの簡略化のために本システムでは，エッジを構成ノードを囲む正方形領域（縦横 40 画素）の中から最も近いする画素から一定数の画素を選択する．以下，それらを位置にある前フレームのノードを探索（図 5 右）する．前ノードと定義する．図 3 ではノードを緑色で示している．

フレームのノードが存在すれば，2 点間距離の中点（距離 3

これらのノードの位置を以降の処理で移動することで，人画素以内）に現フレームのノードを乱数的に配置する（図物の形状を手描き風にデフォルメする．プログラム内部で5 左）ことにした．以上の処理によって，フレーム間の変はノードはクラスとなっており，隣接するノードやエッジ化の差分を小さく保ち，手描き風の線画形状を形成する．

が何本あるか，といった情報を保持する．

図 3: 選択したノード

図 5: ノードの配置方法

3.4 手描き風描画
手描き風描画を実装するに先立ち，現実のペンライト

3.5 ネオン風描画

アートでの線画にはどのような特徴があるかを観察した．

ペンライトアートは，光源を利用して描画しているため，

図 4 の 1 より，二つの形状を比べると，どちらも同じ形で見た目はネオン管によく似ている．ネオン管は明度が高いはあるが，完全に同一の形状にはならない．また図 4 の 2部分が人間の目には白く見える．言い換えれば，ネオン線

より，描くべき形状の頂点付近では腕の動きが直線的な形の内側は彩度が低く明度が高いのに対して，外側は彩度が状部分より遅くなるため，強く光っているように見える．

高く明度が低い．以上を踏まえてネオン風描画手法を開発

さらに，図 4 の 3 より，円や正方形などを描くとき，本来した．本システムでは，ネオン風描画における外側と内側なら始点と終点が一致するような軌跡を描くべきであるの線の色を特定のために，HSV 色空間で彩度と明度を調が，実際には必ずしも始点と終点は一致していない．以上節する．描画時にはあらかじめ HSV 色空間から RGB 色のことから，始点・終点・形状頂点の表現を意識して手描空間へと 画素値を変換する．

© 2018 Information Processing Society of Japan773

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

2C63
2018/3/5

間表現が可能となったので，インタラクション作品を制作

3.6 エフェクトの付与
本システムではペンライトアートをより印象的に演出すした．今回の制作では，図 7 のようなシャッタースピードるためのエフェクトを付与する機能を実装している．現時を変化させた写真を題材とした．これらの写真は，周りが点の我々の実装では残像効果を実装している．この実装でせわしなく動いているように撮影し，中心人物にピントをは，現在のフレーム X ′ の直近 n 枚のフレームを保存し，合わせることで，中心人物の存在感を強めている．この写それぞれのフレームの各 RGB に対し明度を段階ずつ下げ，真を見た時，街中で周りにたくさん人はいるけれど，誰もX から n 枚の論理和を取ることで，新たなフレーム X’ を自分のことを気にしていないような孤独感を感じ，このよ生成する． X の i フレーム前の画素値を Pi とするとき，∑残像を付与した画素値をCi Pi とする．ここで Ci は，うな孤独感を表現したインタラクション作品を本システム

C0 = i，Ci < Ci − 1 を満たす定数であるとする．

情まで表現していないので，逆に本システムを使うことでで表現できないかと考えた．本システムでは人物は顔の表他人感を表現できると考えた．また，夜の街で光るネオン

4. 実行結果

色の看板が存在感を放つように，暗い背景にネオン色のコ以上の処理による結果を図 6a に示す．手などの身体に重なる部分のエッジが検出できている．また，手描き風描ラボレーションが人の存在感をより強められるのではないかと考えた．

画とネオン描画により，ペンライトアートのような表現が実現できている．図 6b はエフェクトとして残像効果を付与した場合の実行結果である．残像効果を付与したことにより，直前の動きの軌跡を視認しやすくなった．この結果，残像効果を付与した画面を見ながら Kinect の前でジェスチャをしたユーザには，それまでよりも大きな動作をする傾向が見られた．一方で表 1 に示すとおり，1 フレームあたり 0.017 秒の処理時間で実行できており，ほぼ実時間で本システムが動作することがわかる．
図 7: スローシャッター写真 [9]5.1 概要本インタラクション作品では図 8 のような展示を想定する．本システムによるインタラクティブな人物シルエット表示に加えて，ペンライトアート風に加工した背景と，背景を歩く人々を追加表示している．そして，Kinect とその前に立つ人物の距離によって背景が変化するようなインタラクションを搭載している．
(a) 実行結果(b) 残像効果を付与

図 6: 実行結果

表 1: 処理時間
手法

実行時間 (秒)深度を用いたエッジ検出

0.010

エッジの簡略化

0.001

手描き風描画

0.001

ネオン風描画0.002

エフェクトの付与

0.003

5. インタラクション作品の制作
本システムでペンライトアート風人物シルエットの実時© 2018 Information Processing Society of Japan

図 8: 展示例

5.1.1 背景のペンライトアート風描画
本システムを用いて，背景画像（図 9）からエッジを抽

774

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

2C63
2018/3/5

出する．その際，ガウシアンフィルタによるぼかしの強度を用いて膨張処理を行うことで，黒の人物シルエットを小を 10 段階に分けた背景画像を 10 枚用意し，それぞれからさく表現し背景に描画した．図 11b に結果を示す．

エッジを抽出する．ぼかしの強度が比較的高い背景画像とと比較的低い背景画像の例を図 10 に示す．本作品ではこの 10 枚の画像のうちいずれかを，Kinect の前に立つ人物と Kinect の距離によって選択的に表示する．そして本システムにより，人物と背景の両方に対してペンライトアー
ト風描画を適用する．

(a) 黒色人物シルエット適用前 (b) 黒色人物シルエット適用後

図 11: 黒色人物シルエットの適用

6. 実行結果
図 9: 背景画像の原画 [10]以上の処理を背景に適用した結果を図 12 に示す．Kinectの前に人が立つと，Kinect からの距離によって背景の明るさや描画が変化するようなインタラクションを実装している．Kinect から 1 メートル以内の範囲に立ったときに背景は最も詳細に描画され，背景を歩く人々が増加し，明度が上がる．それより遠い範囲に立ったときに背景は徐々に簡略に描画され，背景を歩く人が減り，明度が下がる．

(a) ぼかしの強度高(b) ぼかしの強度低

図 10: 背景画像加工結果

5.1.2 背景を歩く人のペンライトアート風描画
背景に歩く人のペンライトアート風人物シルエットを追加するにあたり，Kinect で歩く人物シルエットを取得し，(a) Kinect から 1 メートル以内(b) Kinect から 1 メートル以外

図 12: 実行結果

本システムにより手描き風描画とネオン風描画を適用した．しかし，Kinect の人物認識機能は最大 6 人までである
ため，6 人を超える人物を検知することはできない．よっ7. インタラクション作品の評価て本制作では，本システムで 1 人ずつ人物が歩く様子を撮

本インタラクション作品を体験した他の観客は，どのよ影し，ペンライトアート風描画を適用し，それらの動画をうな印象をこの作品から受けるのかをアンケート調査し合成することで多数の人物を描画した．

た．被験者はカリフォルニア大学デイビス校のデザインを5.1.3 人物シルエット内部の黒塗り専攻する 22 名．本インタラクションを制作した意図を説

本インタラクション作品では，人が Kinect の前に立つ

明せずに，ペンライトアート風に人物を表現するシステムと，ペンライトアート風の人物シルエットが描画される．

であることだけを被験者に説明した．無作為に選んだ 3 名

しかし本システムでは，人物シルエットをペンライトアーに本インタラクション作品を体験してもらい，他の 19 名

ト風に適用したエッジを描画しているため，背景を描画すにその様子を観覧してもらった．その直後にアンケート 1

ると内側から背景が見えてしまう（図 11a）
．それを防ぐたに答えてもらい，その後本インタラクション作品についてめに，Kinect から黒の人物シルエットを取得し，OpenCVの説明をし，アンケート 2 に答えてもらった．

© 2018 Information Processing Society of Japan775

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

7.1 アンケート 1 の結果

2C63
2018/3/5

クティブアートの特徴を取り入れた新たなペンライトアー

本インタラクション作品を体験・鑑賞してみてどのようト表現を提案する．本システムが実時間で動くことが確認な印象を持ったかを，幸福・孤独・悲しさ・ワクワク・困惑されたので，インタラクティブ作品を本システムで制作し，の 5 つについてリッカード尺度を用いて答えてもらった．

それに関する評価実験も実施した．評価実験からは，本イ

結果とそれに対応するコメントを表 2 に示す．我々の予想

ンタラクション作品を体験してみて，被験者は幸福やワクとは異なり，幸福やワクワクといった意見が多く見られた．

ワクを感じたという印象が多く見られた．これらの結果か

その理由として，ペンライトアート風に人物シルエットをら，本システムを用いてインタラクション作品を制作する表現するという方法を見たことがないため，幸福やワクワ

場合，幸福やワクワクを感じるようなインタラクション作クを感じたという意見が多くあった．

品を制作するのに向いているということがわかった．
今後の課題として，幸福やワクワクを感じるようなイン

表 2: アンケート 1 の結果
印象
幸福
孤独
悲しさ

コメント
見たことない新しい技術表現だったため
リアルタイムのインタラクション作品は楽しかった
色や表現の仕方から孤独感を感じた
広い暗い空間で自分だけならば孤独感を感じていた

ワクワク

特にコメントはなし
初見なので，まずワクワクした
インタラクション作品からはワクワクを最初に感じる困惑

特にコメントはなし

タラクション作品の制作をしたい．評価実験においてインタラクションのアイデアを募った際に，その場にいない人とのインタラクションという意見があった．そこで，このような要素を採り入れた作品を制作し，孤独を表現した作
品と幸福を表現した作品とを比較する評価実験を実施することで，評価結果が変化するかを確認したい．
参考文献
[1]

7.2 アンケート 2 の結果[2]

本インタラクション作品について説明し，2 つ目のアンケートを実施した．被験者がデザイン専攻の学生ということもあって，他に実装できるようなインタラクション，本

[3]
[4]

システムで表現できるインタラクション作品についてのアイデアなどをコメントとしていただいた．

[5]

7.3 アンケートの考察[6]

本インタラクション作品では孤独を表現したかったにも関わらず，被験者の多くは幸福やワクワクを感じたという[7]

意見が多かった．このことから，本システムでインタラクション作品を制作する場合，幸福やワクワクを感じるような作品を制作するのに向いているということがわかった．
また孤独感を感じたという意見が少なかった一因として，[8]

実際にはいないけれど，作品内では大勢の人が後ろを歩いているように見えるという錯覚を用いた作品にも関わらず，調査を実施した教室には 22 名の人がおり，インタラクション作品を体験するには空間が十分ではなかったこと

[9]
[10]

PiKAPiKA(Light Painting) - Flash at BEAT IT, https://www.youtube.com/watch?v=nVJJC17Un6Y&t=185s(2017/11/4).
M. W. Krueger, et al. VIDEOPLACE an artificial reality,
ACM SIGCHI Bulletin, 16(4) (1985): 35-40.
E. Tannenbaum. Recollections Six, (1981).
Y. Minomo, et al. A Basic Study on ”Graphic Shadow”
on a Wall, Special Interest Group on Entertainment
Computing (EC), 2005(59) (2005): 3-8.
T. Amaoka, et al. Collective Body Interactive art using
3D Scanner Technology, The Journal of the Society for
Art and Science, 8(4) (2008): 145-150.
CJ. Curtis, Loose and sketchy animation, ACM SIGGRAPH 98 Electronic art and animation catalog ACM,(1998) 145.
M. Haller, et al. A loose and sketchy approach in a mediated reality environment, Proceedings of the 3rd international conference on Computer graphics and interactive
techniques in Australasia and South East Asia, (2005)
371-379.
J. Wood, et al. Sketchy rendering for information visualization, IEEE Transactions on Visualization and Computer Graphics, 18(12) (2012): 2749-2758.
William Lulow,
http://williamlulow.com/blog/
creative-use-of-shutter-speed/ (2017/11/4).
Pictures from a taxi, http://picturesfromataxi.
blogspot.jp/ (2017/11/4).

があげられる．

8. まとめと今後の課題
本報告では，人物シルエットをペンライトアート風に表現するインタラクティブシステムを提案した．本システム
では，人物認識によって身体形状のエッジを実時間取得し，手描き風描画，ネオン風描画や残像効果を施すことによってペンライトアートのようにエッジを表現する．また，従来のペンライトアートビデオでは実現できない観客参加型のペンライトアート風ビデオを実現することで，インタラ© 2018 Information Processing Society of Japan776