情報工学特別講義

情報工学特別講義（第１４回目）
２０１３年７月１８日
担当石原真紀夫
ＨＣＩ研究分野の紹介
人にやさしいユーザインタフェースとは？
ユーザインタフェースとは？
ユーザとコンピュータを結ぶもの。
たとえば、キーボードやマウスなどのように、人間とコンピュータの
間で直接情報を送受信する部分を指します。
（パソコンＩＴ用語辞典２０１０年版より）
?
？に何を使うかで○○ユーザインタフェースと言います。
CUI
GUI
PUI
TUI
WUI
BMI
ユーザインタフェースとは？
CUI - Character User Interface
命令の入力をキャラクター・ベースで行う
ユーザインタフェースのこと。
たとえば、ＤＯＳプロンプトなど
でコマンド（命令）を文字で入
力することで操作を行います。
dirコマンド
フォルダとファイルの一覧を表
示するコマンドです。
tree, ver, ipconfigなど様々な
命令が準備されています。
・MS DOS
・Linux
CUI
GUI
PUI
TUI
WUI
BMI
ユーザインタフェースとは？
GUI – Graphical User Interface
コンピュータの操作に、図形などの視覚情
報を利用するインタフェースのこと。
操作の入力を、アイコンやメニュー
の選択といった図形情報により行
うことができるので、初心者でも使
いやすい。
WIMPメタファー
ウィンドウとアイコン、メニュー、
ポインタをベースとしてGUIを
設計する方針のこと。
・MS Windows
・Max OS
・X Window
CUI
GUI
PUI
TUI
WUI
BMI
ユーザインタフェースとは？
PUI – Perceptual User Interface
次世代ユーザインタフェースの一つ。
コンピュータの操作に、音声や身振り手振り、視線
などの知覚情報を利用するインタフェースのこと。
Voice
Sign
language
Eye
tracking
CUI
GUI
PUI
TUI
WUI
BMI
ユーザインタフェースとは？
TUI – Tangible User Interface
次世代ユーザインタフェースの一つ。
色も重さもない情報に実在の物体を対応付けて、情報が実体
として存在するかのように操作できるインタフェースのこと。
・BUILD-IT, Morten Fjeld et al.
CUI
GUI
PUI
TUI
WUI
BMI
WUI – Web User Interface
ユーザインタフェースとしてWebブラウザを
利用したインタフェースのこと。
ユーザはブラウザの使い方さえ
覚えれば、様々なアプリケーショ
ンソフトを使える利点があります。
現在では、様々なアプリが
Webブラウザ上で利用できま
すね。たとえば、メール、ワー
プロ、表計算。
ユーザインタフェースとは？
CUI
GUI
PUI
TUI
WUI
BMI
ユーザインタフェースとは？
BMI – Brain Machine Interface
コンピュータの操作に、脳波を利用するイ
ンタフェースのこと。
私たちが集中したり、リラックスしたりするときの脳波
の活動状態を解析してコンピュータを操作できます。
Brain
waves
Paralysed patients use thoughts to control robotic arm
http://www.bbc.co.uk/news/health-18092653
at HCII2009 conference
Windowsの進化と
ユーザインタフェース
米国マイクロソフト社が開発しているＯＳの名称。
１９８６年にバージョン１が出荷されて以来、事実上の業界標準に
なっており、パソコンで一般的に使用されている。
（パソコンＩＴ用語辞典２０１０年版より）
Windowsの進化
GUI, Multi-tasking
・MS Windows 1.01 (1985~)
http://www.saunalahti.fi/janij/blog/images/2008_nov_windows_1_0.png
Windowsの進化
Overlaps windows, Mini-Maximum buttons
・MS Windows 2.1 (1988~)
http://osxbook.com/book/bonus/ancient/vpc/images/win21.gif
Windowsの進化
16 colors, Multimedia (CD-ROM, sound)
・MS Windows 3.0 (1990~)
http://catb.org/~esr/writings/taouu/html/graphics/win30progman.png
Windowsの進化
Start menu, Task bar, Desktop folder
・MS Windows 95 (1995~)
http://cybernetnews.com/wp-content/uploads/2006/10/Windows95.jpg
Windowsの進化
True-color, Soften appearance
・MS Windows XP (2001~)
http://www.winsupersite.com/images/reviews/wxp_rtm_home_004.gif
Windowsの進化
Aero interface, Side bar &Gadgets
・MS Windows Vista (2007~)
http://www.otterbein.edu/ITS/images/vista-screen.jpg
Windowsの進化
Peek, Shake, Snap, Windows Touch
・MS Windows 7 (2009~)
http://screenshots.winfuture.de/Windows-7-Build-6.1.7048-1235994358.jpg
Windowsの進化
Windows Touch
http://msdn.microsoft.com/ja-jp/library/windows/desktop/dd940543%28v=vs.85%29.aspx
Windowsの進化
Modern UI (Metro UI)
・MS Windows 8 (2012.10~)
http://windowsteamblog.com/cfs-filesystemfile.ashx/__key/CommunityServer-Blogs-ComponentsWeblogFiles/00-00-00-59-23-metablogapi/4666.win8_5F00_start_5F00_screen_5F00_68436351.jpg
新しいユーザインタフェース
を支える様々機器
現在、我々は主にキーボードやマウス、ディスプレイを用いて、
コンピュータと情報のやり取りをします。これ以外にも様々な機器
が新しいユーザインタフェースを支えています。
ユーザインタフェース支える機器
Touch Screen -- GUI
触れる（タッチ）と、それが入力とみなされる
スクリーンのこと。
スクリーン上のタッチした場所が
ポイントした位置になるため、
自然でわかりやすい利点がある。
Apple iPad
ユーザインタフェース支える機器
Data Glove -- PUI
人間の手の動作を読み取ることができるセンシング機器のこと。
手袋のように手に装着して使用します。
加速度センサや曲率センサによ
り、手の傾きや各指の曲がり具
合を読み取ることができます。
仮想物をつまんで動かしたり、持
ち上げていろんな角度から観察し
たりすることを直感的に行えます。
ADGTech VHand
ユーザインタフェース支える機器
Force Feedback Device -- PUI
振動や力を人に伝える機器のこと。
ゲームパッドやジョイスティック、ハンドル型コントローラ,マウス、
トラックボールなど様々な入力機器と組合わせて使用されます。
重さのない仮想物に重みを加え
たり、その固さや柔らかさを感じ
ることができます。
Novint Falcon
ユーザインタフェース支える機器
Eye Tracking Device -- PUI
人間の視線を読み取ることができるセンシング機器のこと。
メガネのように頭に装着して使用します。
見ている箇所をクリックしたり、
注目している領域に応じた情
報を表示したりできます。
NAC EMR9
ユーザインタフェース支える機器
Camera Based Input Device -- PUI
カメラ画像を用いて人の様々な動作を読み取る機器のこと。
マイクロソフトのKinectやソニーのMoveが有名です。
人はコントローラを持ったり、余分なセンサを身に着ける必要がな
く、身振り手振りで機器に命令を出すことができます。
深度センサー
RGBセンサー
Microsoft XBox360 Kinect
Kinectによる３次元復元
ユーザインタフェース支える機器
Head Mounted Display & CAVE System
人の左目と右目の視野に視差のある別々の画像を提示して、
立体的な仮想世界を表示する機器のこと。
人は仮想世界の中に入り込んで
いるかような感覚を得ることがで
きます。
eMagin Z800 3DVisor
Remote Impact game in action
http://news.bbc.co.uk/go/em/fr/-/2/hi/uk_news/scotland/7423404.stm
ユーザインタフェースと
アフォーダンス
アフォーダンスとは、その物体を使って何ができるのかを伝える知
覚的な明示のこと。
アフォーダンスをうまく考えて作られた機器は見てその使い方を自
然に推測できるため、分厚い取扱い説明書の必要がなくなります。
最近のタブレット端末の説明書はとても薄いです!!
（※）コンストレイントとは、その物体を使って何ができないのかを伝える知覚的な明示のこと。
アフォーダンス
★アフォーダンスの実例１
アフォーダンス
★アフォーダンスの実例２
私の研究室とテーマ
経験ベースデザイン
ユーザフレンドリデザイン
ダイレクト操作
Windowメタファ
スクロール
Googleマップ
拡大と縮小
MSペイント
M. Ishihara et al, “Porthole: A spatial interface to provide scrolling, zooming-in, and zooming-out”, 2005
M. Ishihara et al, “Fingertip-shadow for click, db-click, and drag on a wall”, 2005
私の研究室とテーマ
3D立体迷路～迷子問題
マーカーを用いた算数ドリル
指さしによるGoogleMap操作
AR地図システム
私の研究室とテーマ
マルチ画面とマウス操作
Virtualマウス
お魚計測アプリ
HMDを用いた地図閲覧
AR屋内案内アプリ
国際会議
口頭発表（Oral session）
ポスター（Poster session）
国際会議
SMART Table
デモ（Demo）
展示会（Exhibition）
Spherical Display
Microsoft Research
UIST2008, Monterey, CA, USA
SMART Technologies
UIST2008, Monterey, CA, USA
国際会議
The Colloseum
Palatine Hill
国際会議
Glacier
Venetia
Innsbruck town
Swarovski Crystal
Aircraft carrier
MIDWAY
NASA
お
わ
り
★ARアプリ
★Androidアプリ
以上で終わります。
おまけ★拡張現実感
ＣＧで作られた仮想物を現実空間に重ね合わせて表示する技術
のこと。
拡張現実
現実の大学キャンパス
仮想空間
Quake I
Photos from ARQuake project, Wearable Computer Lab, University of South Australia
拡張現実感
★拡張現実感の位置付け
現実感
拡張現実感
現実空間に仮想物が
置かれているイメージ
拡張仮想感
仮想空間に現実のもの
が置かれているイメージ
混合現実感
仮想現実感
拡張現実感
★ARToolkitを用いた拡張現実感の仕組み
AR Toolkit
・ARを手軽につくるためのソフトウェアライブラリ
・フリーウェア
・C, Java, OpenGL
overlay
マーカー
拡張現実感
１）パソコンはマーカーの模様とそのサイズを予め知っています。
たとえば、
「マーカーは、８ｃｍ×８ｃｍでＧマークの模様」
8cm
8cm
マーカー
拡張現実感
２）マーカーの模様データを使ってカメラ画像からマーカーの場所
を探します。
カメラ画像
8cm
8cm
マーカー
拡張現実感
３）マーカーのサイズデータを使ってマーカーまでの距離と姿勢
を計算します。遠くにあればマーカーは小さく映り、傾いていれば
台形のように歪んで映ります。
カメラ画像
8cm
8cm
マーカー
拡張現実感
４）仮想世界を作り、マーカーとまったく同じ距離、姿勢の位置に
仮想物を描きます。
カメラ画像
仮想カメラ
マーカー
仮想世界
拡張現実感
５）仮想カメラからみたＣＧを生成します。
カメラ画像
仮想カメラ
仮想世界
マーカー
ＣＧ画像
拡張現実感
６）最初のカメラ画像の上にＣＧ画像を上書きします。
カメラ画像
マーカー
拡張現実画像！！
ＣＧ画像

Download Report