WISS2010

写真の上にスケッチと制約を記入していくことによるモデリングシステム
Modeling-in-Context: User Design of Complementary Objects with a Single Photo

Manfred Lau

大河原 昭

三谷 純

五十嵐 健夫∗

Summary. 我々が日常利用しているモノの多くは，一般向けに大量生産されたものである．しかし，このような大量生産品では，消費者の個別のニーズを満たすことが難しい場合が多い．たとえば，個人が所有している物品の大きさに適した棚が必要なときには，既成品を探すよりも，目的に合った棚を自分でデザインできることが望ましい．本論文では，このような個人特有の環境にあわせたモノの形状設計を支援するシステムを提案する．従来の形状設計システムでは，何も存在しない空の座標系に立体形状をデザインしていくことが多いが，この方法では個人特有の環境に適合した形を作ることが困難である．そこで本論文
では，参照用の写真を読み込み，その上に目的とする物体の形状と制約を記入していくことで，立体形状を計算機内に構築するシステムを提案する．つまり，入力は 2 次元の図と，各部位に対する平行や直角といった制約条件であり，システムはこれらの情報に基づく最適化手法によって３次元形状を自動的に構築する．
作成したシステムについては実際にエンドユーザに使用してもらい，簡単に実用的な棚やケースをデザインできることを確認した．

1

はじめに我々が日常的に使っている製品は，大量生産システムのもとでデザインされている．しかし，このアプローチでは，個々人のニーズに適合したモノを得ることは難しい．例えば，ユーザが所有するカップの口に合致する蓋を，大量生産品の中から見つけることは難しいと考えられる [7, 11]．そこで我々は，エンドユーザが自分の状況にあわせた必要なモノを自分でデザインできるようにすること，を目指して研究開発を行っている．本論文では，その目的のためのひとつの方法として，写真の上に簡単な図を描くことによって形状モデリングを行う方法 [12] を紹介する．ユーザは，まず自分が必要としているモノを使う環境の写真を撮影する．そして，その写真の上に，必要としているモノの概形を描く．さらに，その図の上に必要な制約を加える．システムは，その情報を元に，３次元形状を計算する．得られた３次元形状は，レーザーカッターや３次元プリンタなどのラピッドプロトタイピング機械に送られ，実体化される．図１に，本システムによる棚のデザインの例を示す．
現在のプロトタイプシステムでは，大きく分けて，棚のような平面の板からなる物体と，皿やポットの蓋などの回転体からなる物体のデザインをサポートしている．平面の板からなる物体については，主にレーザーカッターで板を切断し手作業で組み立てることを想定している．回転体については，樹脂を利∗Copyright is held by the author(s).
Manfred Lau, Akira Ohgawara, Jun Mitani and Takeo
Igarashi, JST ERATO 五十嵐デザインインタフェースプ
ロジェクト

図 1. (a) 小型棚の写真とスケッチ (b) 微調整された 3次元のバーチャルデータ (c) 既存のオブジェクトとぴったり当てはまる小型棚用した３次元プリンタによる出力を主に想定している．実際に，本システムを利用してさまざまなモノをデザインした上で実物を製作し，提案手法の有効性を確認した．
写真の上にユーザが輪郭などを描くことで３次元モデルを作成するものとして PhotoModeler[4] などがあるが，これらは画像中にすでに存在するモノの形状を推測するためのものであり，画像中に存在しない新たなモノのデザインを目的とする我々のシステムとは異なるものである．特に，これらのビジョンベースのシステムでは入力として３次元モデルの正確な投影図が与えられることを仮定できるのに対し，我々のシステムへの入力はユーザによる想像上の物体のラフスケッチであり，かなり誤差が大きいと考えられる．そのために，ユーザによる制約の追加というユーザインタフェース上の工夫や，大まかな推測と細かな調整の２段階処理を行うというアルゴリズム上の工夫をしている．

2関連研究

SketchUP[19] などの通常の３次元形状モデリン
グシステムでは，ユーザは何もない空の空間にプリWISS 2010

ミティブを置いていくことでモデリング作業を行う．
もし，手持ちの物体にぴったり合うケースや棚を作りたい場合には，明示的に対象物の大きさを測った上で，それにあうように値を調整していく必要がある．また，実世界にすでに存在する物体をモデリングする際に，その写真を背景において作業することもよく行われる [23, 25]．しかし，この場合には，正確に正面や側面から撮影した画像が使われるのみであり，我々のシステムのように自由な視点からの画像が使われることは少ない．
初心者による３次元形状モデリングを容易にする方法として，スケッチによるモデリング手法が数多く提案されている [31, 9, 15, 3, 1, 20, 18]．しかし，これらのスケッチモデリングの対象は多くの場合，仮想世界におけるキャラクタや環境をデザインするためのものであり，実世界で実際に利用するモノを対象にしているものは少ない．そのため，既存のスケッチモデリングシステムでは，例えば「実在する物体を格納するケース」などのように機能性を持つモノのデザインは困難である．
写真から３次元形状を復元する手法についても，コンピュータビジョンの分野に数多くの研究がある[2, 22, 28, 8, 16, 10]．しかし，これらの研究では，実在する３次元物体の，正確な２次元投影図が入力として与えられることを前提にアルゴリズムがデザインされている．我々のシステムでは，入力として与えられるのはいまだに存在していないもののスケッチ図であり，正確な投影図を前提としたコンピュータビジョンの手法を使うことは難しい．写真の上へのラフなスケッチによって樹木の形をデザインするシステムが提案されているが [17, 26, 24]，これは樹木の持つ構造的な特徴を利用したものであり，人工物のデザインを対象とする我々のシステムとは目的が異なる．
１枚の図と付加的な情報から３次元モデルを構築する既存手法として，曲面の法線の方向を指定する
もの [30, 27] や，楕円体プリミティブを置いていく
もの [6] などが提案されているが，これらは３次元キャラクタの形状などをデザインするものであり，本システムが対象としている人工物のデザインとは異なるものである．ビルや飛行機など，対象を非常に限定した手法 [29, 14] も存在しているが，本システムでは，平面や回転体からなる物体といった，より一般的な形状を対象としている．

3ユーザインタフェース我々のシステムでは，左側のウィンドウでユーザが写真上に描いたスケッチを表示し，右側のウィンドウではスケッチから生成された 3 次元データを表示する (図 2)．ユーザはまず，新しく作りたいオブジェクトをデザインする際に参照する写真を読み込む．例えば，ユーザが所有しているティーポットの蓋

図 2. 提案システムのスクリーンショットをデザインしたい場合，蓋がないティーポットの写真をウィンドウに表示させる．また，ユーザが机における小型の棚を作りたい場合は，本などが載った机の写真を表示させる．その後，その写真を背景としてスケッチを描く．本システムにおけるスケッチは，基本的なプリミティブから構成される線画と，プリミティブ間の幾何学的な制約を指定するアノテーションから構成される．
ユーザはまず，プリミティブを用いて，デザインしたい物体を写真の上に描く．プリミティブとしては，線分，長方形，正方形，円，回転体の４つをサポートしている．どのプリミティブも，画面上では完全に２次元のオブジェクトとして編集が行われる．
線分は始点と終点からなり，ユーザは自由に２次元での位置を指定することができる．長方形と正方形は，スケッチ上では単なる４辺形として表現され，ユーザは自由に頂点の位置を動かすことができる．
これらは内部的には，４本の線分に接続制約と直交制約を加えたもの，およびそれらに等長制約を加えた 3 次元の構造体として表現されている．円は，スケッチ上では楕円として表現され，ユーザは位置と大きさに加えて扁平率を指定することができる．回転体は，中心線と輪郭からなるが，これらもまたスケッチ上では２次元的な線分とポリラインとして描かれる（図 3）．
ユーザは次に，描いたプリミティブ間の関係を規定するアノテーションを適宜追加する．これらの幾何学的関係の多くは，スケッチが完全な投影画像であれば，スケッチを分析することによって推論可能である．しかし，本システムで対象としているのは，エンドユーザによる，写真内に存在しない新たな物体のデザインであり，スケッチが３次元形状の完全な投影画像であることは期待できない．アノテーションは，そのような不完全なスケッチから３次元形状の再構成を行うために必要な手がかりを与えるために必要となる．現在の実装ではアノテーションとして，線分間に指定される接続・直角・等長・平行制
約，特定の頂点が地面に乗っていることを示す接地
制約，モデル全体が左右対称であるときにその中心Modeling-in-Context: User Design of Complementary Objects with a Single Photo

面を指定する対称面制約，および，線分の長さと面の厚みを指定する制約を実装している．

図 3. 回転体プリミティブ。中心線および輪郭を描く

図 6. 左: 左右対称な面 (緑色の点線) が一回のマウスクリックで指定できる．右: 3 次元データ．黒い線がユーザの視角から見えて，赤い線はこの視角だと実際には見えない

図 4. 直角の指定．２直線の間をクリックすると１つ制約ができる．４面体の中心をクリックすると４つの制約ができる．この図では，15 回のクリックで36 箇所の直角を指定している．

図 5. 左: 辺をクリックで選択する．中央: 緑色で選択された 2 組の線はそれぞれ長さが等しく．赤い矢印で選択された線は平行である．右： 緑色の点は，地面上に存在する点．

4アルゴリズム

２次元の線画から３次元形状を計算する既存手法
として Lipson らによる最適化計算によるもの [13]があり，我々のアルゴリズムもその手法に基づいている．Lispon らの手法では，平行や直角といった幾何学的関係を線画から推測していたが，我々のシステムではユーザがアノテーションとして明示的に指定するという違いがある．また，処理を高速化するために，２段階からなる最適化を導入する．
まず，入力として与えられたスケッチから，頂点・辺・面からなるグラフ構造を抽出する．次に，そのグラフの頂点に対して，３次元座標を計算する．Lipsonらによる元の手法では，頂点の３次元座標をすべて同時に最適化により計算していた．しかし，その方法では探索範囲が広いために収束するまでに時間ががかる．そこで，本システムでは，まず，xy 座標をユーザの描いたスケッチにあうように固定し，z 座

図 7. 2 段階最適化の様子．左から右へ計算が進む． a-d)
第１段階の最適化の様子．xy 座標を固定し，z 座標のみを計算する．e-g) 第２段階の最適化の様子．
xyz 座標をすべて最適化で計算する．

標（奥行き情報）のみを最適化によって計算する．
これで目的となる３次元形状にかなり近いものが，比較的短い時間で得られる．しかし，ユーザの入力は完全な投影像となっていないことが多く，その場合には与えられた幾何学的制約を完全に満たすことはできない．そこで，第２段階として，第１段階で得られた３次元座標を初期状態として，xyz 座標す
べてを最適化によって計算する．
第１段階の最適化では，以下のエネルギーを和を最小化するように各頂点のｚ座標を計算する．直角と指定された角度について∑(anglei − 90◦ )2i

等長と指定された線分の長さについてs −2∑ n∑s(len(veci ) − len(veci+1 ))2i

平行と指定された線分の角度についてs −2∑ n∑si1(angle(veci , veci+1 ) − 90◦ )WISS 2010

上の３つについてはさらに，重み 0.5, 10, 10 を掛けて計算している．最適化には，GSL 科学計算ライブラリにおける Nelder-Mead simplex アルゴリズ
ムを利用している．単純に一度走らせただけでは局所解に陥る可能性があるので，異なる初期値で複数回 (2,3 回程度) 計算し，最も優れた結果を利用する．
第２段階の最適化では，xyz 座標すべてを最適化対象として計算を行う．また上の項に加えて，画面上での位置の一致を示す投影制約を導入する．まず，線分の端点については，３次元モデルの頂点を投影した座標 p とそれに対応するスケッチ上の頂点の座
標 p′ の間の距離

図 8. 上の行はリプソンによる 1 段階の最適化の結果である．下の行は我々の 2 段階最適化の結果である．

||p − p′ ||2を計算する．円プリミティブについては，計算中の３次元円を投影してできる楕円の上下左右の点の座標と，対応する２次元スケッチの座標の間の距離を計算する．回転体プリミティブについては，ベース面の中心点の座標と半径，上端における半径の一致度を計算する．投影制約の大きさは, 0.1 から 0.8の範囲で変化させる．まず投影制約に大きな重みを与えて計算し，徐々に小さな重みで計算していくことで安定して結果を得ることができる．
カメラパラメータ（カメラの位置，方向，焦点距離）の計算については，写真内にマーカーを置く方法と置かない方法の２つを提供している．前者の場
合には，白黒パターンが印刷されたマーカーを地面において写真の中に写しておくことで，自動的にカメラパラメータを計算する．後者の場合には，カメラパラメータも最適化計算の中に組み込んで物体形状と一緒に推定を行う．

5

結果

図 1 および図 11 に，実際に本システムを利用して実物体をデザイン，製作した例を示す．すべての例
において，製作された物体は，正しい大きさにデザインされている．特に，ティーポットの蓋については，適切なサイズであるとの評価を受けている．最適化計算は，いずれも 1 秒以内に終了している．図
8 に，Lison らによる元の最適化手法と，我々の 2 段階最適化手法の比較を示す．Lipson らの手法では，xyz 座標を同時に求めるために，解の探索範囲が広く，10 秒以上計算したにもかかわらず局所解に陥ってしまっている．一方，我々の提案手法では，短時間で理想的な解が得られている．図 9(a) に，ユーザのスケッチが大きくゆがんでいる場合でも，アノテーションを利用することで適切な形状が得られている例を示す．図 9(c) に 50 頂点からなる複雑なモデルの例を示す．この場合でも最適化は 1 秒以内に終了している．

図 9. (a-b) 不正確なスケッチとその 3 次元形状計算
結果．(c-d) 複雑なスケッチとその３次元形状計算
結果

6

まとめと今後の課題

本稿では，一枚の写真の上に線画および制約を書き込むことで，写真に写っている周囲の状況にあわせた新しい実物体をデザインする手法について紹介
した．現在の実装では，写真は単なるユーザが参照するためだけに使用しており（マーカー検出を除いて）画像処理は行っていないが，簡単な画像処理によって輪郭のトレースなどの処理を支援することは有効と考えられるので [23] 今後は利用を検討していきたい．
現在の実装では，静的かつ硬い物体のみしか扱うことができない．今後は，布や紐などの柔軟物体のデザインや，折りたたみ椅子のように可動部分をもつ物体のデザインなどにも取り組んでいきたい．このような複雑な物体のデザインには，今回紹介したような単なる幾何学的制約だけでなく，材質や機能性についてのアノテーションも必要になると考えている．

参考文献[1] Bae S.-H., Balakrishnan R., Singh K.: Ilovesketch: As-natural-as-possible sketching systemfor creating 3d curve models. ACM Symposium on User Interface Software and Technology(UIST) (2008), 151.160.
[2] Debevec P., Taylor C., Malik J.: Modeling andrendering architecture from photographs: A hybrid geometry and image-based approach. ACM
SIGGRAPH (1996), 11.20.

Modeling-in-Context: User Design of Complementary Objects with a Single Photo

図 10. 提案システムによる実物体のデザインおよび製作例[3] Dorsey J., Xu S., Smedresman G., Rushmeier H.,
Mcmillan L.: The mental canvas: A tool for conceptual architectural design and analysis. In Proceedings of Paciﬁc Graphics (2007), pp. 201.210.
[4] EOSSYSTEMS: Photomodeler, 2007.
[5] Forsyth D. A., Ponce J.: Computer Vision: A
Modern Approach. Prentice Hall, 2002.
[6] Gingold Y., Igarashi T., Zorin D.: Structured annotations for 2D-to-3D modeling. ACM Transactions on Graphics 28, 5 (2009), 148.
[7] Gross M.: Now more than ever: computationalthinking and a science of design. Japan Society
for the Science of Design 16, 2 (2007), 50.54.
[8] Horry Y., Anjyo K.-I., Arai K.: Tour Into The
Picture: Using A Spidery Mesh Interface To
Make Animation from a single image. In ACM
SIGGRAPH (1997), pp. 225.232.
[9] Igarashi T., Matsuoka S., Tanaka H.: Teddy:a sketching interface for 3d freeform design. In
ACM SIGGRAPH (1999), pp. 409.416.
[10] Jiang N., Tan P., Cheong L. F.: Symmetric architecture modeling with a single image. ACMTransactions on Graphics 28, 5 (2009), 113.
[11] Landay J.: Design tools for the rest of us. Communications of the ACM 52, 12 (2009), 80.
[12] Lau M., Saul G., Mitani J., Igarashi T.,
Modeling-in-Context: User Design of Complementary Objects with a Single Photo, Eurographics Symposium on Sketch-Based Interfaces andModeling (SBIM 2010).
[13] Lipson H., Shpitalni M.: Optimization-based reconstruction of a 3d object from a single freehand line drawing. Computer-Aided Design 28, 8(1996), 651.663.
[14] Muller P., Zeng G., Wonka P., Van GoolL.: Image-based procedural modeling of facades.
ACM Transactions on Graphics 26, 3 (2007), 85.
[15] Nealen A., Igarashi T., Sorkine O., Alexa M.:
Fibermesh: designing freeform surfaces with 3dcurves. ACM Transactions on Graphics 26, 3(2007), 41.
[16] Oh B. M., Chen M., Dorsey J., Durand F.:
Image-based modeling and photo editing. ACM
Transactions on Graphics (2001), 433.442.

WISS 2010[17] Quan L., Tan P., Zeng G., Yuan L., Wang J.,
KANG S. B.: Image-based plant modeling. ACM
Transactions on Graphics 25, 3 (2006), 599.604.

[25] Thormahlen T., Seidel H.-P.: 3d-modeling by orthoimage generation from image sequences. ACM
Transactions on Graphics 27, 3 (2008), 86.

[18] Shesh A., Chen B.: Smartpaper: An interactive
and user friendly sketching system. Computer
Graphics Forum (Eurographics) 23, 3 (2004),
301.310.
[19] SKETCHUP: Google, 2009.

[26] Tan P., Zeng G., Wang J., Kang S. B., QuanL.: Image-based tree modeling. ACM Transactions on Graphics 26, 3 (2007), 87.

[20] Schmidt R., Khan A., Singh K., Kurtenbach G.:
Analytic drawing of 3d scaﬀolds. ACM Transactions on Graphics 28, 5 (2009), 149.
[21] Schmidt R., Singh K., Balakrishnan R.: Sketching and composing widgets for 3d manipulation.
Computer Graphics Forum 27, 2 (2008), 301.310.
[22] Sinha S., Steedly D., Szeliski R., Agrawala M.,
Pollefeys M.: Interactive 3d architectural modeling from unordered photo collections. ACM
Transactions on Graphics 27, 5 (2008), 159.
[23] Tsang S., Balakrishnan R., Singh K., RanjanA.: A Suggestive Interface For Image Guided
3d Sketching. In Proceedings of ACM SIGCHI(2004), pp. 591.598.

[27] Wu T.-P., Tang C.-K., Brown M., Shum H.Y.: Shapepalettes: Interactive normal transfervia sketching. ACM Transactions on Graphics 26,3 (2007), 44.
[28] Xiao J., Fang T., Tan P., Zhao P., Ofek E., QuanL.: Image-based facade modeling. ACM Transactions on Graphics 27, 5 (2008), 161.
[29] Yang C., Sharon D., Van De Panne M.: Sketchbased modeling of parameterized objects. Eurographics Workshop on Sketch-Based Interfacesand Modeling (2005), 1.10.
[30] Zhang L., Dugas-Phocion G., Samson J.-S.,
Seitz S.: Single view modeling of free-form scenes.
IEEE CVPR (2001), 990.997.
[31] Zeleznik R., Herndon K., Hughes J.: Sketch:
An interface for sketching 3d scenes. ACM SIGGRAPH (1996), 163. 170.

[24] Tan P., Fang T., Xiao J., Zhao P., Quan L.:
Single image tree modeling. ACM Transactions
on Graphics 27, 5 (2008), 108.

未来ビジョン
本文中でも述べたように，現在の３次元モデリングシステムは基本的に何もない空間に点や線などのプリミティブを置いていくものであり，実世界の環境を考慮しながらモデリングする作業を支援するようにはできていない．
そのため，ユーザが実環境に合わせた形状をデザインするためには，手作業で実世界の事物の大きさを測って計算機内に取り込み，それに合うようにパラメータを調整するという作業が必要になる．このような方法は，コストと手間をかけてもよい工業製品のデザインでは許されるものであるが，手早く簡単に行う必要のある，エンドユーザによるデザインでは大きな障害となる．
我々の研究の長期的な目標は，このような実世界の環境を考慮したモノのデザイン支援である．本論文で紹介した写真の上にスケッチや制約を書き込むという方法はそのひとつであるが，他にもいろいろな方法が考えられる．
ひとつには，仮想現実感の技術の利用がある．
すなわち，対象とする空間に適切にビジュアルマーカーを配置することで，現実世界の形状を計算機内に取り込むことができ，それらを考慮したうえでビデオ画像の上でモデリング作業を行うことができれば便利であろう．また，よりアクティブに，レーザレンジスキャナなどで，実世界の実形状をリアルタイムに取り込みつつ，その中でモデリング作業を行う，といったことも考えられる．
取り込むべき実世界の状況としても，今回の研究で対象とした３次元形状の他に，色やテクスチャといった見えの情報，光や影の情報，剛性などの材質情報，動きなどの情報などが考えられる．たとえば，特定の実環境中におくことを前提にガラスでできた透明なオブジェを新たにデザインするのであれば，光の反射や屈折，周囲の風景の映りこみなども考慮できるとうれしいと考えられる．また，既存の棚の上や壁に，置いたり掛けたりするような物体をデザインするのであれば，どの程度の重さまで大丈夫なのかわかると安全である．このような，さまざまな実世界状況の取り込みを効率的に行うことは簡単ではないが，ネット上にデータを蓄えて共有したり計測技術を高度化することによってある程度は実現することができると考えている．