chinda_fall_desu’s diary

竹内豊の日記

ヒューマンコンピューターインターフェースをもっと知りたいなー

"RealitySketch(2020)" を読むための予備知識

はじめに

"RealitySketch: Embedding Responsive Graphics and Visualizations in AR through Dynamic Sketching"(2020)
上記の論文を読むための準備である。
様々なゲーム、ソフトウェアにおける「入力できる変数」(例えば、ボールを落とす位置)と「暗黙的に利用される変数」(例えば、重力加速度の値)の関係を探る。

単純なバスケのゲーム

www.youtube.com
Youtubeで見つけた単純なバスケのゲームである。
これの入出力の関係は
(入力)ボールを放つ向きと速さ
(出力)事前に設定された重力などの値と入力値を使って、ボールを放つ

PhysInk

www.youtube.com
PhysInkはゲームデザインを自動化するソフトウェアである。
マリオの制作を例にあげると
(目的)ある地点に乗るように亀の上で跳ねたときの反発を変える
(手段)反発係数の数値を調整する ←これを自動化する!

これを入出力の関係に落とし込むと
(入力)適当に線を入力する
(出力)その線を物理法則に従った線に変換して表示

自動化によってこれまで「入力していた変数」が「暗黙的に利用される変数」に変わった。

Apparatus

www.youtube.com

(入力)ボールの動く方向や形、位置などの値を変化させる
(出力)入力された値を使って、ボールを動かす

これまでのソフトウェアの中で一番入力できる変数が多く、暗黙的に利用される変数は少ない。

ここまでのまとめ

バスケのゲーム、PhsInk、Apparatusの順に、入力できる変数が増え、暗黙的に利用される変数が減る。

簡単なシステムであれば、「入力する変数」と「暗黙的に利用される変数」、どちらかの比重が大きいが、複雑なシステムであれば、そうはならない。下記がその例である。

Sketch-based Dynamic Illustration of Fluid Systems

www.youtube.com
入力できる変数も、暗黙的に利用される変数も多い。
(入力)流体の入り口、接続、障害物等を入力する
(出力)事前に定義された流体の動きに入力の値を組み合わせ、計算し、表示する。

ここでの「暗黙的に利用される変数」は、流体の動きを決める変数などが挙げられる。


RealitySketch

www.youtube.com

(入力)どのような値を得たいかを指定する(角度や長さなど)
(出力)入力で得られたデータを使って、グラフ化等を行い、可視化する。

ここでの「暗黙的に利用される変数」は、どのようなグラフを描画するかを決める変数などが挙げられる。

ARと現実世界の物体を結びつける(コンピューターインターフェースの論文を読む No.53)

読んだ論文を自分なりに整理してみます。

今回の論文

"RealitySketch: Embedding Responsive Graphics and Visualizations in AR through Dynamic Sketching"(2020)

www.youtube.com

疑問点
・実世界の情報をどうやって取得するのだろう?
・カメラを使って取得するのかな? 
・でもどうやって写真の紐のように一部分だけ取得するのかな?
・物体検出によって紐を認識させているのかな?
・それができればグラフ化等のアプリケーションの作成は簡単だろう

どんなもの?

実世界とARの仮想世界をつなげる
実世界の変化によって動的にAR上のスケッチが変化する

先行研究との違い

・AR上でオブジェクト描画
インタラクティブな2dオブジェクト
インタラクティブなARオブジェクト
上記の研究はすでにされている。
しかし、実世界の物体を用いてインタラクティブにARのオブジェクトを描画する研究は行われていない。

実装

OpenCVのカラートラッキングによって実世界の物体を追跡する。
それを使って、グラフ化を行ったり、ARオブジェクトの大きさを変化させることが可能。

検証方法

・利用しやすさを測るために実用性の調査を行い、教育で利用しうるか調べるために教育者のフィードバックを得た。

議論

・同一色の追跡等に問題があるためカラートラッキングより確実な物体追跡方法が必要。
・ユーザ入力およびグラフ化等の表示が2d上ではなく3d空間上で行えれば、より直感的な操作が可能。
・実世界から長さや角度以外のパラメータを取得できないか。

関連

答え合わせ
・実世界の情報をどうやって取得するのだろう?
・カメラを使って取得するのかな? →〇 OpenCVを使う
・でもどうやって写真の紐のように一部分だけ取得するのかな? 
・物体検出によって紐を認識させているのかな? →✖ 紐ではなく物体を検知し、その物体の位置によってAR上で紐を描画

解説動画

www.youtube.com

これまでの形状変化装置たち『Shape-changing interfaces: A review of the design space and open research questions(2012)』(No.52)

読んだ論文を自分なりに整理してみます。

今回の論文

"Shape-changing interfaces: A review of the design space and open research questions"(2012)

この当時(2012年)までに作られた形状変化インターフェースを様々な軸で分類し、この分野での課題を分析する。


変形の種類

1.曲げる
『Living interfaces: The Thrifty Faucet. (2009)』(動画見つからず)
蛇口を様々な方向に曲げることで水の消費量などの情報をユーザに提示する。


2.使う立体図形を変える
Horev氏が製作した Morphing Harddisk (2006)
vimeo.com
球体から立方体、もしくはその反対に変形することで情報を提示する。
(もちろん同様の情報はGUI上で簡単に表示させられるが、GUIに情報が収まりきらなくなったときにこれは重要な選択肢になるような気がする。)


3.体積を変える
『Inflatable mouse: volume-adjustable mouse with air-pressure-sensitive input and haptic feedback.(2008)』
www.youtube.com
マウスに風船のようなボールを仕込むことで、その体積の変化を入出力に使える。手のひらでつぶすか、指での押し込むことで入力を行う。


4.表面を変える
『Relief: A Scalable Actuated Shape Display. (2010) 』
vimeo.com
chindafalldesu.hatenablog.com


5.粘度を変える
『Mudpad: Fluid Haptics for Multitouch Surfaces. (2010)』(動画見つからず)
MR流体という磁場によって粘度が変化する流体を使っている。
(しかもこの流体は反応時間が2ms以下と反応が速いらしい。)


6.空間での位置を変える
www.youtube.com
(構成する要素が繋がっていなくてもこの例のように一つの集合体の形状変化として錯覚することがあるようだ)


7.トポロジー的に同等でない変形(分割したり結合したりできるということかな)
www.youtube.com
pBlob(programmable blob)と呼ばれる独自の磁性流体を電磁石で制御している。

自然(Organic)↔人工的(Mechanical)

続いては形状変化装置を自然を感じるものか、人工的なものかに分ける。
(前者は環境に溶け込ませるのに向いていて、後者はユーザにそれを意識させるのに向いているように感じる。)
上記の例ではThe Thrifty Faucet(1)は自然で、Morphing Harddisk(2)やInflatable mouse(3)は人工的かな。


・自然
『Interactions with proactive architectural spaces.(2008)』
www.youtube.com
インタラクティブな林。人がどれくらい近くにいるかを知覚し、それに基づいて動きを決める。(2:15辺りがわかりやすい)


・人工的
『Lumen: interactive visual and shape display for calm computing(2004)』
www.youtube.com

入出力の種類

・出力のみ
入力を受け取らず、元々与えられた情報によって動きを変える。BMW museum sculpture(6)とかかな。(動きが単調になってしまいそうだが、幻想的な動き、非現実的な動きを作る際に用いると良さそう。)


『Kukkia and Vilkas: Kinetic Electronic Garments(2005)』
www.youtube.com



・暗黙の入力
ある空間内の動きや音などの入力に応じて出力を決める。The Thrifty Faucet(1)とかかな。
①『Pinwheels: Visualizing Information Flow in an Architectural Space.(2001)』
空間内の動きや音に応じて風車の回転させる。

②『ambientROOM: Integrating Ambient Media with Architectural Space (1998)』
vimeo.com
ambientROOMはペットの動きを波形で壁に表示させるなど、入力だけでなく出力も明示的でない。


・明示的な入力
明示的な入力も大きく分けて、リモートかそうでないかで分けられる。
Morphing Harddisk(2)やInflatable mouse(3)はリモートでなく、Lumenはリモートも可能である。

触れるグラフを作ろう『Opportunities and Challenges for Data Physicalization(2015)』(No.51)

読んだ論文を自分なりに整理してみます。


(準備) 論文のネットワーク化

まず、論文間の関係をネットワークにして可視化してくれる以下のサービスを使ってみる。www.connectedpapers.com

石井裕先生のRadicalAtomを中心にネットワークを構成してみた。
するとこんな感じ。
f:id:chinda_fall_desu:20200809124711p:plain

被引用回数が多ければノードは大きくなり、新しいほどノードは濃くなる。そこで今回は「Jansen,2015」と書かれたノードの論文を読んでみよう。


今回の論文

"Opportunities and Challenges for Data Physicalization"(2015)
www.youtube.com


概要
データの物理的可視化に関するこれまでの研究をまとめ、その可能性を調査した論文。


データ物理化の利点
人類が進化とともに手に入れてきた、視覚だけではない様々な能力を活用できる。例えば、我々は物体を回したり近づけたりして物体を調べることは得意だし、触って物体の重さや硬さを感じることもできる。
(グラフを書いたり、表を作ったりするとき、紙やボードなどの二次元の媒体しか使ってこなかったのは、三次元で記述する媒体がなかったからだろう。だけどそのような媒体が生まれても使いこなせるようになるかは別問題かも。)


物理化に使えそうな技術たち
・離散的な形状をつくるにはロボットを使うか、ピンやタイルを使う
www.youtube.com
www.youtube.com


・連続的な形状をつくるには空気圧や油圧を使うか、形状記憶合金を使う
https://www.youtube.com/watch?v=aAkpSh-QzC8www.youtube.com
www.youtube.com

・重量を変化させるには液体金属とポンプを使う。
vimeo.com

(データの物理化では形状が最重要だろう。これを見る限り、正確な形状を形成する方法は、平面を曲げて数か所に角度をつけるやり方か、一方向に伸ばすやり方しかない。)

Arduino CLIでターミナルから書き込みを行う

下記の動画でArduinoCLIの使い方が分かったのでまとめる。

www.youtube.com



Latest releases: Release 0.11.0-rc1 · arduino/arduino-cli · GitHub


①~⑥の手順で書き込むを行える。


①接続されているボードを確認。

> arduino-cli board list
Port Type              Board Name  FQBN            Core
COM3 Serial Port (USB) Arduino Uno arduino:avr:uno arduino:avr


②インストールされているCoreを確認する。(最初は何もインストールされていない)

> arduino-cli core list 

>


③Coreをインストールする。(①からarduino:avrが必要なことが分かる)

> arduino-cli core install arduino:avr
Downloading packages...
(略)
Installing arduino:arduinoOTA@1.3.0...
arduino:arduinoOTA@1.3.0 installed
Installing arduino:avr@1.8.2...
arduino:avr@1.8.2 installed


④スケッチを作成。空のinoファイルを作成し、それを編集する。

> arduino-cli sketch new MySketch
Sketch created in: D:\(略)\MySketch   
>
> cat .\MySketch\MySketch.ino

void setup() {
}

void loop() { 
}
>


⑤編集したスケッチをコンパイルする。(ここではArduino Uno用にコンパイルするように指定)

> arduino-cli compile -b arduino:avr:uno
Sketch uses 444 bytes (1%) of program storage space. Maximum is 32256 bytes.
Global variables use 9 bytes (0%) of dynamic memory, leaving 2039 bytes for local variables. Maximum is 2048 bytes.


コンパイルして生成されたhexファイルを書き込む。(①でわかったポート番号を使う)

> arduino-cli upload -b arduino:avr:uno -p COM3

おしまい。


(間違い等あればコメントお願いします。)

位置関係を保って動くオブジェクト(コンピュータの論文を調査㊿)

読んだ論文をまとめます。適宜修正します。


今回は以下の論文を読みます。
"Mechanical constraints as computational constraints in tabletop tangible interfaces"(CHI 2007)

vimeo.com

①どんなものか
ユーザのオブジェクト操作に合わせて、コンピュータが位置関係を最適化し、オブジェクトを移動させる

②先行研究と比べてどこがすごいか
ユーザとコンピュータが同時にオブジェクトを制御している

③技術や手法の肝
・電磁石を使ってオブジェクトの位置をコンピュータで制御する
・ソフトウェアで複数のオブジェクトの位置関係を制御

④どうやって有効だと検証したか
携帯電話基地局の配置アプリケーションをつくり、その効果をユーザ調査で評価した

⑤議論はあるか
これを使えば、プログラミングよりも速くアプリケーションの動作を変更できる

⑥次に読むべき論文
"Navigation Methods for an Augmented Reality System"(2000)


(コメントいただけると嬉しいです)

積み重ねて使うダイヤルでディスプレイを操作(コンピュータの論文を調査㊾)

読んだ論文をまとめます。適宜修正します。


今回は以下の論文を読みます。
"Lumino: Tangible blocks for tabletop computers based on glass fiber bundles"(2010)

www.youtube.com


①どんなものか
2Dバーコードで物体を追跡するディスプレイをそのまま使って、3次元構造も認識できるようにする。

②先行研究と比べてどこがすごいか
既存のディスプレイを変更することなく、3次元構造を認識させる。

③技術や手法の肝
・ガラス繊維を用いることで物体の上に乗せた物体のバーコードを認識できる。
・上のマーカーが下のマーカーを遮らないような角度でガラス繊維を配置。

④どうやって有効だと検証したか
マルチダイヤルなどのアプリケーションを開発。

⑤議論はあるか
ガラス繊維でできたオブジェクトでタッチ入力をいかにして行うか。

⑥次に読むべき論文
"Bricks"(1995)


(コメントいただけると嬉しいです)