WISS2012

モザイク画像を利用した遠近画像の同時提示手法
鈴木 裕太

小池 英樹∗

概要. ディスプレイに表示される映像やスクリーンに投影される映像など，視聴者の位置に関することなく一方的に表示される映像には，表示領域やコンテンツのサイズに応じて最適な視聴距離がある．例えば，近年公共スペースを中心に普及を見せているデジタルサイネージを例にすると，大型のデジタルサイネージのすぐ前を通るユーザにとっては，当該サイネージに表示されている内容の全体像を認識することは難しく，逆に遠くから見るユーザにとっては，サイネージに表示されている細かい内容について理解することは難しい．しかし，視認可能な範囲にいる視聴者に対しては，機会損失を防ぐという意味でも，なるべく多くの人がコンテンツの内容を認識できる映像を表示することが望ましい．表示領域やコンテンツのサイズとユーザの視聴距離との間に生じうるこの問題の解決に向けて，本研究では，距離に応じて異なった映像を同時に提供することのできる映像の生成方法の提案・開発を行った．具体的には，「一定距離以降から内容が認識可能になる」といった「モザイク画像の特徴」を応用することによって，遠近 2 つの領域にいる視聴者に対してそれぞれ異なった情報を同時に提供できる画像の生成方法と，当該画像の視認性向上処理の提案・実装を行った．また，本提案手法を実装したインタラクティブなデジタルサイネージの開発も行った．

1

はじめにディスプレイに表示される映像やスクリーンに投影される映像など，視聴者の視聴位置によらず一方的に表示される映像には，動画・静止画問わず，画面やコンテンツの大きさに応じて最適な視聴距離がある．同じ大きさの画面領域に映像を表示する際，コンテンツのサイズが大きい場合は接近時の認識が難しくなり，逆に小さい場合は離れるにつれて認識が難しくなる．これは，当該映像を視聴できる範囲であっても，視聴者に対して最適な映像が提供できていない場合があることを意味する．

図 1. デジタルサイネージの問題点

かい内容について理解することは難しい（図 1）．しかし，視聴可能な範囲にいる視聴者に対しては，なるべく多くの人が認識できる映像を表示できた方が，機会損失を防ぐという意味でも望ましい．
表示領域やコンテンツのサイズとユーザの視聴距離との間に生じうるこの問題の解決方法のひとつとして，各距離に対して最適化されたそれぞれの映像を同時に表示する方法が考えられる．例えば，画面から離れている視聴者に対しては画像 A を，画面のすぐ傍にいる視聴者に対しては画像 B といったように，単一ディスプレイ上で異なる画像を同時に提供することで，遠近両視聴者はそれぞれの距離に適した映像を視認することができるようになる（図 2）．
本稿では，前述した方法によって距離に応じて適した映像を視認できる画像の生成方法についての我々の提案・開発結果を述べていく．具体的には，「モザイク画像」の特徴を応用することによって，遠近 2つの視聴領域に対してそれぞれ異なった映像を同時提供できる画像生成手法の提案・開発と，当該画像を利用したインタラクティブなデジタルサイネージの開発について述べていく．

このような問題は，画面サイズが大きくなるとより顕著化する．例えば，近年公共スペースを中心に普及を見せているデジタルサイネージを例にすると，大型のデジタルサイネージのすぐ前を通る視聴者にとっては，当該サイネージに表示されている内容の全体像を認識することは難しく，逆に遠くから見る視聴者にとっては，サイネージに表示されている細∗Copyright is held by the author(s).
Yuta Suzuki, Hideki Koike, 電気通信大学大学院 情報システム学研究科 情報メディアシステム学専攻

図 2. 映像の選択的な提供

WISS 20122

関連研究

複数のユーザに対して同時かつ選択的に情報提供を行うことのできる方法についての研究は，これまでにも数々の例がある．その中には，大型ディスプレイにパブリックな情報を表示すると同時にモバイ
ル端末にプライベートな情報やより詳細な情報を表示するマルチデバイス環境下で選択的情報提示を実現する研究も多い．このような方法は複数の異なる情報を同時提供するための実用的な方法ではあるが，我々は単一のディスプレイ下で複数ユーザに選択的な情報提示を行う技術について検討をしているため，単一ディスプレイ環境を対象とした研究に絞って関連研究を述べていく．

Vogel らはディスプレイとユーザの距離によってそれぞれのユーザに異なった映像を提示するシステムを提案した [1]．彼らは，ディスプレイとユーザ間の距離がディスプレイに表示されている内容に対するユーザの興味の指標になるという仮定のもと，ユーザの距離をセンシングすることで，いくつかに区分された距離ごとに異なった映像・インタラクティブ要素を提供するシステムを実現している．しかし，彼らのシステムは，複数ユーザに対して異なった映像を同時に提供できるものではない．また，彼らのシステムではユーザは特殊なデバイスを装着する必要があるため，公共空間での使用を前提とする我々の目的にはそぐわない．
MIT での The hybrid image project は，2 つの異なる画像を単一ディスプレイ上に同時提示できる手法を提案した [2]．一方の画像をローパスフィルタ，他方の画像をハイパスフィルタでそれぞれ処理した後，それらを合成することによって，異なる 2つのコンテンツが距離に応じて移り変わって見える画像を実現している．しかし，この方法で使用される 2 つの画像には形状的に高い類似性を持つ必要があり，なおかつ色の使用についての制限も大きい．
松下らは，Lumisight Table という，最大 4 方向にそれぞれ異なった映像を同時提供できるテーブルトップシステムを実現した [3]．当システムは，特定の角度から入射する光のみを拡散させることのできる Lumisity film というフィルムを 2 枚直交するように貼り合わせたものをテーブルトップとし，4つのプロジェクタでそれぞれ異なった映像をバックプロジェクションすることによって実現されている．
情報を選択的かつ同時に提供するという条件は満たしているが，水平ディスプレイシステムに特化したハードウェア構成，選択的情報提示方法であるため，デジタルサイネージのような垂直ディスプレイでの実現には適さないと言える．

3

提案手法

我々の提案する手法の基本となる考え方を図 3 を用いて説明する．この絵は Salvador Dali によって描かれた絵画である．

図 3. Salvador Dali による絵画

図 3 を見ると分かる通り，この絵はモザイク画像のように描かれた Abraham Lincoln の顔の中心部に，女性の全身が高解像度で描かれたものである．
興味深い点は, この絵を近くから見た場合と遠くから見た場合では認識される内容が異なってくる点である. 近くから見た場合，多くの人は女性に注意を向け，なおかつ解像度の粗い Lincoln の顔には気付きにくいが，逆に遠くから見た場合は，粗い解像度で描かれた Lincoln の顔が認識されるようになり，今度はそちらに意識がいくようになる．この絵画をアイデアの基盤として，今回我々は，モザイク画像の特徴を利用することによって距離に応じて異なった映像を提供する手法の提案を行う．具体的には，
図 4 に示すように，X[m] 離れたときに内容が認識しやすくなるような粗さのモザイク画像と，通常解像度の小画像複数枚を重畳することによって，X[m]を境に前後 2 つの領域に異なった映像を同時提供する方法を提案する．以降，X[m] より手前にいる視聴者向けの画像を「近画像」，X[m] よりも奥にいる視聴者を対称とした画像を「遠画像」と呼ぶ．

図 4. 提案手法の概要

モザイク画像を利用した遠近画像の同時提示手法

4

プロトタイプ画像

前章で説明した提案手法に基づいて，遠近 2 つのグループに対してそれぞれ異なった映像を同時提供できるプロトタイプ画像を作成した．具体的な作成プロセスは以下の通りである．
まず，遠画像として用いる画像をモザイク画像へと変換する．このときの遠画像のサイズは 1440 ×900[pxl]，モザイクタイルのサイズは 12 × 12[pxl]とする．その後，64 枚の近画像を遠画像上に配置する．最後に，近画像に透過率を設定して透過させることで重畳画像を得る．透過率としては，試験的に0.5〜0.9 までの 0.1 刻みの値を設定した．生成されたプロトタイプ画像を図 5 に示す．

図 5. プロトタイプ画像

図 5 を見ると，プロトタイプ画像が，遠画像と近画像の両方を同時に提供できていることが窺える．
しかし，近画像の透過率が 0.5〜0.7 における遠画像の視認性は低く，また，透過率が 0.8〜0.9 の場合は，内容の認識ができない程近画像の視認性が低くなっていることが分かる．遠画像および近画像の視認性は本システムの情報提供能力に直接影響を与える要素であるので，これら視認性の向上は我々の提案手法において重要である．そこで我々は，プロトタイプ画像生成プロセスに視認性改善処理の実装を行った．処理の詳細を次章より説明する．

5

視認性改善処理

視認性改善処理追加後の重畳画像生成プロセスを
図 6 に示す．本章では，各視認性改善処理の詳細について説明していく．

5.1

近画像の再配置

プロトタイプ画像の生成プロセスでは，近画像は読み込まれた順かつラスター走査順に遠画像上に配置していた．しかし，遠画像に近画像を重畳する際，両画像の色が大きく異なると重畳画像における各画像の視認性は低下するため，両者の色がなるべく近くなるように近画像を配置する方が視認性改善の観点からは好ましい．そこで，遠画像の色情報に基づいて近画像の配置を決定する処理を実装した．具体的には，一般的なフォトモザイク生成方法と同様に，まず遠画像を格子状に分割した後，各領域の色特徴

図 6. 重畳画像生成プロセス

ベクトルを基に近画像群から最も似た画像を選び出し，選出された近画像を当該領域に配置していく．
しかし，一般的なフォトモザイクのように大量の画像が使用可能な状況とは異なり，近画像の枚数内で最適な近画像配置を行う必要がある．そこで，遠画像内の重要領域から優先的に近画像群の選択ができるような処理内容とした．本処理のプロセスを図 7に示す．

図 7. 近画像の再配置プロセス

まず，遠画像の原画像からサリエンシーマップを生成し，領域を近画像の枚数分，格子状に分割する．
次に，分割された各領域ごとにピクセル値の総和を求め，その値が大きい順に優先順位を付けていく．
その後，優先順位の高い領域から順に，対応するモザイク画像内領域の色特徴ベクトルをキーとして，最も色の類似した近画像を選出し，当該領域に配置する．これを全分割領域に対して実行する．
ここで，サリエンシーマップとは，画像内の各領域に対する視覚的な注意のいきやすさを数値的に表したマップである [5]．画像には主となる被写体が写っている場合が多く，なおかつ被写体領域はサリエンシーが高くなる傾向にある．つまり，画像内においてサリエンシーの高いオブジェクトとは，その画像内容の認識を左右する重要なオブジェクトであると言える．サリエンシーマップの生成については様々な手法が提案されているが，本研究では ChengWISS 2012

らの提案する手法を用いた [4]．

5.2近画像透過率の設定

プロトタイプ画像生成プロセスでは，近画像の透過率として 0.5〜0.9 の範囲の 0.1 刻みの値を手動で設定していた．しかし，透過率の設定は入力される画像を基に自動的に行われることが望ましい．
そこで我々は，遠画像と近画像の双方がなるべく高い視認性を得ることのできる透過率を求める処理を実装した．具体的には，重畳画像が遠近両画像に対して同程度に類似しているときの透過率を当該近画像の透過率として設定した．アルゴリズムの詳細を図 8 を用いて説明する．
図 9. 近画像透過率自動設定結果

図 8. 透過率の自動決定プロセス

まず，i 番目の近画像 N Ii と，N Ii が重なる位置に対応する遠画像領域 F Ii を近画像の透過率 α で合成して重畳画像 M I(i,α) を生成する．ここで，透過率は 0.0 から始めて 0.05 刻みで 1.0 までの全 21段階の値を用いる．M I(i,α) が生成されたら，次にN Ii ，F Ii ，M I(i,α) を，それぞれ 9 つの領域に分割し，領域ごとに HSV 色空間における各値 H，S，V値の平均値を求め，これらを各画像の特徴ベクトルとする．つまり，画像ごとに H，S，V 値の平均値×9 領域分の計 27 要素を持つ特徴ベクトルが得られる．N Ii ，F Ii ，M I(i,α) から特徴ベクトルが得られたら，次に N Ii と M I(i,α) 、および F Ii と M I(i,α)の間の類似度 SN(i,α) ，SF(i,α) を，コサイン類似度によって求める．以上の処理を全 α について実行し，SN(i,α) と SF(i,α) の差分の絶対値が最も小さくなる
時の α を当該近画像 N Ii の透過率として設定する．
本処理適用後の混合画像を図 9 に示す．

5.3減することによって遠画像の視認性を改善する処理を実装する．ただし，この処理には「近画像の視認性をできるだけ維持する」という条件も同時に要求される．
遠画像における色の非連続性に大きな影響を与えている要素としては，各近画像の背景領域が考えられる．隣接する近画像間で背景色の違いが大きい場合や，近画像の背景色と遠画像の対応領域の間の色差が大きい場合，混ぜ合わせた際に遠画像の非連続性を高める結果となる．そこで我々は，近画像内における背景領域などといった比較的重要性が低いと考えられる領域の透過率を上げることによって，近画像の視認性をなるべく維持しつつ遠画像の視認性向上を実現する処理の実装を行った．
本処理の処理フローを図 10 に示す．まず，各近画像からサリエンシーマップを生成する．サリエンシーマップを求めた後は，当該サリエンシーマップから特にサリエンシーの高い重要領域と，そうでない領域とを区別するための二値画像を生成する．この二値画像は，重要領域を白領域，それ以外の領域を黒領域で表している．ここで，二値化アルゴリズ
ムには大津のアルゴリズムを用いた．最後に，この二値画像を基に，白領域に対応する近画像内ピクセ
ルには前章で求めた透過率 α を設定し，黒領域に対応するピクセルにはそれよりも高い透過率を設定していく．

近画像透過率の重み付け

前処理までの結果画像を見ると，近画像についてはその内容が概ね認識できる程度の視認性が得られていることが確認できるが，遠画像については視認性にやや難があるように見える．これは，近画像領域単位で透過率の最適化を行なったことによって，遠画像が色空間において非連続になってしまったためであると考えられる．よって，この非連続性を低図 10. 透過率の重み付けプロセス

モザイク画像を利用した遠近画像の同時提示手法

本処理適用後の重畳画像を図 11 に示す．

図 13. 視認性改善処理結果画像
図 11. サリエンシーマップ処理適用後

5.4

モザイクタイル間エッジの部分的平滑化

前章では，近画像内における低サリエンシー領域の透過率を上げることによって遠画像の視認性を向上させる処理について説明した．当処理によって，近画像は画像の一部が認識しづらい状態になるため，その分重要領域はより認識が容易な状態であることが望ましい．しかし現状では，それら重要領域内においても，重畳されている遠画像のモザイクタイル間エッジがノイズになり，認識が厳しくなっている箇所が多くある．
そこで，近画像内の重要領域に対応する遠画像領域においては，隣接するモザイクタイルを平滑化し，色勾配をなめらかにする処理を実装した．本処理を適用した結果を図 12 に示す．

図 14. 透過率 0.5 のプロトタイプ画像像の場合よりも視認性が落ちている近画像も見受けられる．しかしそのような画像においても，内容の認識について大きな問題は無いことが窺える．これらのことから，本視認性改善処理は「近画像の認識に大きな問題を与えることなく遠画像の視認性を向上する」という目的を達成できていると言える．

7
図 12. モザイクタイル間エッジの平滑化

6

視認性改善処理適用結果と比較

前章までに説明した視認性改善処理をすべて実装
した重畳画像生成プロセスによって出力された重畳画像を図 13 に示す．また，比較のため，4 章で紹介した α = 0.5 のプロトタイプ画像も図 14 に示す．
2 つの画像を比較すると, 遠画像の視認性については，視認性改善処理適用後の重畳画像の方が高いことが窺える．一方，近画像については，視認性がほぼ変わらない画像も多くあるが，プロトタイプ画

アプリケーション

我々は今回，提案手法を用いたデジタルサイネージの開発を行った．本デジタルサイネージは，空港などといった公共空間に設置されることを想定したものであり，コンテンツとしては，観光客向けの情報として，遠近両画像にその土地を代表する画像を表示する．今回は，「沖縄」をテーマにし，遠画像には「首里城」の画像を，近画像には沖縄の名産物や観光地などの画像を 64 枚分用いた．視認性改善処理を含めた提案手法によって生成された本アプリケーション用の重畳画像を図 15 に示す.
本デジタルサイネージシステムは，58[inch] の大型ディスプレイと処理用 PC，および Microsoft

WISS 20128

図 15. アプリケーション用重畳画像

Kinect によって構成されている．Kinect の設置理由については後述する．重畳画像は 1440 × 900[pxl] で表示し，近画像の対象範囲を画面から 80〜390[cm]の範囲、それ以降を遠画像の対象範囲とする．
上記に加えて，本システムにインタラクション要素の実装も行なった．視聴者がディスプレイに十分近い位置にいる場合，その正面のディスプレイ領域は当該視聴者によって遮られるので，遠くにいる視聴者にとっては死角となる．つまり，ディスプレイに接近している視聴者に対しては，透過率 0 の近画像，つまり近画像の原画像を表示しても，遠画像対象領域内にいる視聴者への映像提供の邪魔にはなりにくい．この状況を利用するために，ディスプレイの直下に Kinect を設置し，近画像対象領域内にいる視聴者の距離および顔の位置をセンシングすることで，特定の位置の近画像の透過率をインタラクティブに変化させ，ディスプレイに接近してきたユーザに対して鮮明な近画像の提供を可能にした．具体的には，Kinect が近画像対象領域内にユーザを検出した場合，当該ユーザの顔の正面領域にある 9 枚の近画像の透過率を徐々に上げていく処理を追加した（図 16）．

図 16. インタラクションの概要

まとめ

本稿では，画面やコンテンツの大きさと視聴者の視聴距離との関係によって生じうる映像視認時の機会損失問題への対処方法として，距離に応じて異なった映像を同時提供できる方法の提案・開発について述べた．具体的には，「一定距離以降から内容の認識が可能になる」といった「モザイク画像の特徴」を応用し，モザイク画像と通常解像度の画像とを重畳することによって，遠近 2 つの距離区分にいるそれぞれの視聴者に対して異なった映像を同時提供できる方法の提案・開発を行った．提案手法は画像の重畳によって映像の同時かつ選択的提供を行なっているが，単純な重畳では映像の視認性に難があったた
め，各画像の視認性を向上させるための処理を実装することでこれに対処し，提供映像の見やすさの改善を実現した．また，本手法の応用例として，遠近両距離にそれぞれ異なった映像の提供が可能なインタラクティブデジタルサイネージの開発も行った．
今後は，モザイクタイルサイズとモザイク画像内容の認識可能距離との関係性を明らかにし，任意の境界距離で遠近領域を分離できるモザイク画像の生成方法の確立に向けて取り組んでいく予定である．

参考文献[1] D. Vogel and R. Balakrishnan. Interactive Public Ambient Displays: Transitioning from Implicit
to Explicit, Public to Personal, Interaction withMultiple User. In Proceedings of the ACM 2004
UIST, pp. 137–146. 2004.
[2] A. Oliva and A. Torralba and P. Schyns. Hybrid Images. In ACM Transactions on Graphics(TOG), vol. 25, no. 3, pp. 527–532. 2006.
[3] M. Matsushita and M. Iida and T. Ohguro and Y.
Shirai and Y. Kakehi and T. Naemura. Lumisight
Table: A Face-to-face Collaboration Support System That Optimizes Direction of Projected Information to Each Stakeholder. In Proceedingsof the 2004 ACM Conference on Computer Supported Cooperative Work (CSCW), pp. 274–283.
2004.
[4] M.-M. Cheng, G.-X. Zhang, N. J. Mitra, X.
Huang, and S.-M. Hu. Global contrast basedsalient region detection. Proceedings of the IEEE
2011 Computer Society Conference on ComputerVision and Pattern Recognition, pp. 409–416.
2011.
[5] L. Itti, C. Koch, and E. Niebur. A Model ofSaliency-Based Visual Attention for Rapid SceneAnalysis. IEEE Transactions on Pattern Analysis
and Machine Intelligence, pp. 1254–1259. 1998.