Download - 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫
![Page 1: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/1.jpg)
情報工学特別講義(第10回目)2011年6月16日
担当 石原真紀夫
HCI研究分野の紹介
人にやさしいユーザインタフェースとは?
![Page 2: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/2.jpg)
Question: What is HCI ?
1. How Can I?
2. Help Crime Increase
3. Host Controller Interface
4. Human Computer Interaction5. Haya~ii Caru~ii AndroId3.0!
Chat
Law
Network
Software
?????
![Page 3: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/3.jpg)
ユーザとコンピュータを結ぶもの。たとえば、キーボードやマウスなどのように、人間とコンピュータの間で直接情報を送受信する部分を指します。
(パソコンIT用語辞典2010年版より)
ユーザインタフェースとは?
?
?に何を使うかで○○ユーザインタフェースと言います。
![Page 4: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/4.jpg)
CUI - Character User Interface
ユーザインタフェースとは?
命令の入力をキャラクター・ベースで行うユーザインタフェースのこと。
たとえば、DOSプロンプトなどでコマンド(命令)を文字で入力することで操作を行います。
dir コマンドフォルダとファイルの一覧を表示するコマンドです。tree, ver, ipconfig など様々な命令が準備されています。
・ MS DOS・ Linux
GUICUI PUI TUI WUI BMI
![Page 5: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/5.jpg)
・ MS Windows・ Max OS
・ X Window
ユーザインタフェースとは?
GUI – Graphical User Interface
コンピュータの操作に、図形などの視覚情報を利用するインタフェースのこと。操作の入力を、アイコンやメニューの選択といった図形情報により行うことができるので、初心者でも使いやすい。
WIMPメタファーウィンドウとアイコン、メニュー、ポインタをベースとして GUIを設計する方針のこと。
CUI GUI PUI TUI WUI BMI
![Page 6: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/6.jpg)
Signlanguage
Eyetracking
Voice
ユーザインタフェースとは?
PUI – Perceptual User Interface
次世代ユーザインタフェースの一つ。コンピュータの操作に、音声や身振り手振り、視線などの知覚情報を利用するインタフェースのこと。
CUI PUIGUI TUI WUI BMI
![Page 7: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/7.jpg)
・ BUILD-IT, Morten Fjeld et al.
TUI – Tangible User Interface
次世代ユーザインタフェースの一つ。色も重さもない情報に実在の物体を対応付けて、情報が実体として存在するかのように操作できるインタフェースのこと。
ユーザインタフェースとは?CUI TUIGUI PUI WUI BMI
![Page 8: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/8.jpg)
ユーザインタフェースとは?
WUI – Web User Interface
ユーザインタフェースとしてWebブラウザを利用したインタフェースのこと。ユーザはブラウザの使い方さえ覚えれば、様々なアプリケーションソフトを使える利点があります。
現在では、様々なアプリがWebブラウザ上で利用できますね。たとえば、メール、ワープロ、表計算。
CUI WUIGUI PUI TUI BMI
![Page 9: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/9.jpg)
Brain waves
BMI – Brain Machine Interface
コンピュータの操作に、脳波を利用するインタフェースのこと。
私たちが集中したり、リラックスしたりするときの脳波の活動状態を解析してコンピュータを操作できます。
at HCII2009 conference
ユーザインタフェースとは?CUI BMIGUI PUI TUI WUI
Monkey's brain controls armhttp://news.bbc.co.uk/2/hi/science/nature/7426822.stm
![Page 10: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/10.jpg)
米国マイクロソフト社が開発しているOSの名称。1986年にバージョン1が出荷されて以来、事実上の業界標準になっており、パソコンで一般的に使用されている。
(パソコンIT用語辞典2010年版より)
Windows の進化とユーザインタフェース
![Page 11: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/11.jpg)
http://www.saunalahti.fi/janij/blog/images/2008_nov_windows_1_0.png
・ MS Windows 1.01 (1985~)
GUI, Multi-tasking Windows の進化
![Page 12: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/12.jpg)
http://osxbook.com/book/bonus/ancient/vpc/images/win21.gif
・ MS Windows 2.1 (1988~)
Overlaps windows, Mini-Maximum buttons Windows の進化
![Page 13: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/13.jpg)
(質問)どっちが押されているように見えますか ?
1.
OK 2.
OK
Windows の進化
古賀直樹、「UIデザインの基礎知識~プログラム設計からアプリケーションデザインまで~」、ファンテック株式会社
![Page 14: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/14.jpg)
(答え)我々の生活空間では上から下へ光が差し込むことが自然です。太陽は良い例です。
そのため、光は上からあたるものだ!と思い込んでおり、そのように影(濃淡)を解釈して凹凸を感じてしまうのです。
Windows の進化
![Page 15: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/15.jpg)
![Page 16: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/16.jpg)
http://catb.org/~esr/writings/taouu/html/graphics/win30progman.png
・ MS Windows 3.0 (1990~)
16 colors, Multimedia (CD-ROM, sound) Windows の進化
![Page 17: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/17.jpg)
http://cybernetnews.com/wp-content/uploads/2006/10/Windows95.jpg
・ MS Windows 95 (1995~)
Start menu, Task bar, Desktop folder Windows の進化
![Page 18: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/18.jpg)
(質問)どちらを見たとき緊張を感じますか ?
1.
2.
Windows の進化
![Page 19: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/19.jpg)
(答え)人は丸み帯びたもの見ると心理的な安心感を感じるといわれています。
逆に、人はナイフのような尖ったものを見ると本能的に自己防衛のため緊張を感じるといわれています。
Windows の進化
![Page 20: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/20.jpg)
True-color, Soften appearance
http://www.winsupersite.com/images/reviews/wxp_rtm_home_004.gif
・ MS Windows XP (2001~)
Windows の進化
![Page 21: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/21.jpg)
http://www.otterbein.edu/ITS/images/vista-screen.jpg
・ MS Windows Vista (2007~)
Aero interface, Side bar &GadgetsWindows の進化
![Page 22: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/22.jpg)
http://screenshots.winfuture.de/Windows-7-Build-6.1.7048-1235994358.jpg
・ MS Windows 7 (2009~)
Peek, Shake, Snap, Windows TouchWindows の進化
![Page 23: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/23.jpg)
(実験)リンゴの数を数えてください。
Windows の進化
![Page 24: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/24.jpg)
(質問)どちらからリンゴを数えましたか ?
1. 左から 2. 右から
Windows の進化
![Page 25: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/25.jpg)
(実験)立方体を描いてください。
Windows の進化
![Page 26: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/26.jpg)
(質問)どれに一番近いですか ?
1.
2.
Windows の進化
3.
![Page 27: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/27.jpg)
(解説)このように人はものを見るとき、自然と左から右に向かって認知しています。
この人の性質は、たとえば、再生ボタンプログレスバーの進行方向に利用されています。
Windows の進化
![Page 28: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/28.jpg)
現在、我々は主にキーボードやマウス、ディスプレイを用いて、コンピュータと情報のやり取りをします。これ以外にも様々な機器が新しいユーザインタフェースを支えています。
新しいユーザインタフェースを支える様々機器
![Page 29: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/29.jpg)
ユーザインタフェース 支える機器
Touch Screen -- GUI
触れる(タッチ)と、それが入力とみなされるスクリーンのこと。
スクリーン上のタッチした場所がポイントした位置になるため、自然でわかりやすい利点がある。
Apple iPad
![Page 30: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/30.jpg)
1.
Before After from Prof. D. Wigdor (Microsoft) as Invited talk, AVI2010, Roma, Italy
ユーザインタフェース 支える機器
(質問)どのようなジェスチャーを想像しますか?
![Page 31: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/31.jpg)
Before After from Prof. D. Wigdor (Microsoft) as Invited talk, AVI2010, Roma, Italy
ユーザインタフェース 支える機器
(質問)どのようなジェスチャーを想像しますか?2.
![Page 32: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/32.jpg)
Before After from Prof. D. Wigdor (Microsoft) as Invited talk, AVI2010, Roma, Italy
ユーザインタフェース 支える機器
(質問)どのようなジェスチャーを想像しますか?3.
![Page 33: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/33.jpg)
ユーザインタフェース 支える機器
Data Glove -- PUI
人間の手の動作を読み取ることができるセンシング機器のこと。手袋のように手に装着して使用します。加速度センサや曲率センサにより、手の傾きや各指の曲がり具合を読み取ることができます。
ADGTech VHand
仮想物をつまんで動かしたり、持ち上げていろんな角度から観察したりすることを直感的に行えます。
![Page 34: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/34.jpg)
ユーザインタフェース 支える機器
Force Feedback Device -- PUI
振動や力を人に伝える機器のこと。
ゲームパッドやジョイスティック、ハンドル型コントローラ ,マウス、トラックボールなど様々な入力機器と組合わせて使用されます。
Novint Falcon
重さのない仮想物に重みを加えたり、その固さや柔らかさを感じることができます。
![Page 35: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/35.jpg)
ユーザインタフェース 支える機器
Eye Tracking Device -- PUI
見ている箇所をクリックしたり、注目している領域に応じた情報を表示したりできます。
NAC EMR9
人間の視線を読み取ることができるセンシング機器のこと。メガネのように頭に装着して使用します。
![Page 36: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/36.jpg)
ユーザインタフェース 支える機器
Camera Based Input Device -- PUI
カメラ画像を用いて人の様々な動作を読み取る機器のこと。マイクロソフトの KinectやソニーのMoveが有名です。人はコントローラを持ったり、余分なセンサを身に着ける必要がなく、身振り手振りで機器に命令を出すことができます。
Microsoft XBox360 KinectHands are the new remote controlhttp://news.bbc.co.uk/1/hi/programmes/click_online/7820866.stm
![Page 37: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/37.jpg)
(質問)どっちが読み易いですか ?
ユーザインタフェース 支える機器
1. 2.
![Page 38: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/38.jpg)
(解説)人の視野は、水平方向に広く、垂直方向は狭くなっています。この人の特性が読み易さや読みにくさに影響しています。
ユーザインタフェース 支える機器
100度 100度
70度
60度
画面サイズ4:3
画面サイズ16:9
![Page 39: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/39.jpg)
ユーザインタフェース 支える機器
Head Mounted Display & CAVE System人の左目と右目の視野に視差のある別々の画像を提示して、立体的な仮想世界を表示する機器のこと。
人は仮想世界の中に入り込んでいるかような感覚を得ることができます。
eMagin Z800 3DVisor
Remote Impact game in actionhttp://news.bbc.co.uk/go/em/fr/-/2/hi/uk_news/scotland/7423404.stm
![Page 40: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/40.jpg)
アフォーダンスとは、その物体を使って何ができるのかを伝える知覚的な明示のこと。
ユーザインタフェースとアフォーダンス
アフォーダンスをうまく考えて作られた機器は見てその使い方を自然に推測できるため、分厚い取扱い説明書の必要がなくなります。
iPadには説明書が入っていないんです!!
(※)コンストレイントとは、その物体を使って何ができないのかを伝える知覚的な明示のこと。
![Page 41: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/41.jpg)
アフォーダンス
★アフォーダンスの実例1
![Page 42: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/42.jpg)
アフォーダンス
★アフォーダンスの実例2
![Page 43: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/43.jpg)
アフォーダンス
★アフォーダンスの実例2
![Page 44: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/44.jpg)
私の研究
Experience-centered design
M. Ishihara et al, “Porthole: A spatial interface to provide scrolling, zooming-in, and zooming-out”, 2005
Window Metaphor ~ Scroll
Window Metaphor ~ Zoom
![Page 45: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/45.jpg)
私の研究
User friendly design & Direct manipulation
M. Ishihara et al, “Fingertip-shadow for click, db-click, and drag on a wall”, 2005
Map Viewer on Projection
MS Paint on Projection
![Page 46: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/46.jpg)
国際会議
Poster session
Oral session
![Page 47: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/47.jpg)
国際会議
Demo
Spherical DisplayMicrosoft ResearchUIST2008, Monterey, CA, USA
SMART TableSMART Technologies
UIST2008, Monterey, CA, USA
Exhibition
![Page 48: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/48.jpg)
国際会議
Banquets
Ethnic dance and music
Ethnic danceBanquets, IASTED, Innsbruck, Austria
![Page 49: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/49.jpg)
国際会議
Palatine Hill
The Colloseum
![Page 50: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/50.jpg)
国際会議
GlacierVenetia
Swarovski Crystal
Aircraft carrierMIDWAY
Innsbruck town
![Page 51: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/51.jpg)
CGで作られた仮想物を現実空間に重ね合わせて表示する技術のこと。
拡張現実感
現実の大学キャンパス
Quake I
仮想空間
拡張現実
Photos from ARQuake project, Wearable Computer Lab, University of South Australia
![Page 52: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/52.jpg)
現実感
拡張現実感
拡張仮想感
仮想現実感
拡張現実感
混合現実感
現実空間に仮想物が置かれているイメージ仮想空間に現実のものが置かれているイメージ
★拡張現実感の位置付け
![Page 53: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/53.jpg)
G
overlay
拡張現実感
★ARToolkit を用いた拡張現実感の仕組み
マーカー
AR Toolkit・ AR を手軽につくるためのソフトウェアライブラリ・フリーウェア・ C, Java, OpenGL
![Page 54: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/54.jpg)
拡張現実感
1)パソコンはマーカーの模様とそのサイズを予め知っています。
たとえば、「マーカーは、8cm× 8cmでGマークの模様」
Gマーカー
8cm
8cm
![Page 55: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/55.jpg)
拡張現実感
2)マーカーの模様データを使ってカメラ画像からマーカーの場所を探します。
G
マーカー
G
カメラ画像
G8cm
8cm
![Page 56: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/56.jpg)
拡張現実感
3)マーカーのサイズデータを使ってマーカーまでの距離と姿勢を計算します。遠くにあればマーカーは小さく映り、傾いていれば台形のように歪んで映ります。
G
マーカー
G
カメラ画像
G8cm
8cm
![Page 57: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/57.jpg)
拡張現実感
4)仮想世界を作り、マーカーとまったく同じ距離、姿勢の位置に仮想物を描きます。
G
マーカー
G
カメラ画像
仮想カメラ
仮想世界
![Page 58: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/58.jpg)
拡張現実感
5)仮想カメラからみたCGを生成します。
G
マーカー
G
カメラ画像
仮想カメラ
仮想世界
CG画像
![Page 59: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/59.jpg)
拡張現実感
6)最初のカメラ画像の上にCG画像を上書きします。
G
マーカー
G
カメラ画像
CG画像
G
拡張現実画像!!
![Page 60: 情報工学特別講義(第10回目) 2011年6月 16 日 担当 石原真紀夫](https://reader038.vdocuments.site/reader038/viewer/2022103007/568142bb550346895daefe32/html5/thumbnails/60.jpg)
以上で終わります。
デ モ
★AR アプリ
★Android アプリ