RubyからEyeTribeを使ってみた。 Google画像検索してヒートマップをその場で表示してみた。

1. 「安心・安全・安定・信頼」できるインターネットサービスを
株式会社クルウィット
井澤 志充
RubyとEyeTribeで視線追跡をする
2015/2/21 (Sat)
Kanazawa.rb #30
@IPBP武蔵

2. 「安心・安全・安定・信頼」できるインターネットサービスを
じこしょうかい
• (株)クルウィットの取締役 兼 北北陸陸⽀支社⻑⾧長
• 博⼠士(情報科学)
• ネットワーク関連の委託研究・⾃自社サービス開発など
2
• 井澤 志充 (いざわゆきみつ)
@Yukimitsu_Izawa

3. 「安心・安全・安定・信頼」できるインターネットサービスを
EyeTribeとは
• デンマークのThe Eye Tribe
社が販売する視線追跡デバ
イス。$99.0
• Windows/OSX対応。
• 30 or 60 sample/sec
• 距離離:45-‐‑‒75cm
• 65cmで40cm四⽅方
• 最⼤大24インチのスクリーン
に対応
• USB 3.0必須
3
(画像は http://theeyetribe.com/ より)

4. 「安心・安全・安定・信頼」できるインターネットサービスを
EyeTribeで得られる情報
• 左右それぞれの瞳孔のサイズと位置
• 左右と両⽬目に関して、
• rawの座標データ
• 平均化した座標データ
4

5. 「安心・安全・安定・信頼」できるインターネットサービスを
準備するもの
• Ruby
• Qt
• 4系(最新は4.8.6)
• qtbindings gem
5

6. 「安心・安全・安定・信頼」できるインターネットサービスを
Qt
• GUI ライブラリ・フレームワーク
• http://qt-‐‑‒project.org/
• 商⽤用版・オープンソース版の⼆二種類がある
• OSXの場合、brewでインストール可能。
6
図はwikipediaより
% brew install qt

7. 「安心・安全・安定・信頼」できるインターネットサービスを
qtbindings gem
• RubyからQtライブラリを使えるするようにするgem
• gem コマンドか、git から最新版をインストール可能
7
% gem install qtbindings
or
% git clone https://github.com/ryanmelt/qtbin
dings.git
% cd qtbindings
% rake install

8. 「安心・安全・安定・信頼」できるインターネットサービスを
RubyからQtを使う
8
require ‘Qt4'
app = Qt::Application.new(ARGV)
win = Qt::MainWindow.new
scene = Qt::GraphicsScene.new
imageview = Qt::GraphicsView.new(scene)
image = Qt::Image.new('lena.jpg')
pm = Qt::Pixmap.fromImage(image)
scene.addPixmap(pm)
win.setCentralWidget(imageview)
win.show
app.exec

9. 「安心・安全・安定・信頼」できるインターネットサービスを
RubyからQtを使う
9

10. 「安心・安全・安定・信頼」できるインターネットサービスを
EyeTribe API
10
• クライアントは Tracker Server に TCP/6555 で接続する。
• JSONベースのプロトコル。
• http://dev.theeyetribe.com/api/
• push/pull モードが存在する。(default はpullモード)
• pushモードの場合は heatbeat の送出が必須。
• 今回はSDKを使わずに、Socketで通信することにする。

11. 「安心・安全・安定・信頼」できるインターネットサービスを
Frameの簡単な例
11
{
"values": {
"frame": {
"timestamp": "2015-02-20
17:43:47.763",
"time": 640169139,
"state": 7,
"righteye": {
"raw": {
"y": 167.0612,
"x": 984.7193
},
"psize": 25.0996,
"pcenter": {
"y": 0.3862,
"x": 0.5977
},
"avg": {
"y": 168.7315,
"x": 983.1584
}
}, // righteye
"raw": {
"y": 207.9453,
"x": 989.4243
},
"lefteye": {
"raw": {
"y": 248.8294,
"x": 994.1293
},
"psize": 23.2937,
"pcenter": {
"y": 0.3803,
"x": 0.4135
},
"avg": {
"y": 231.8799,
"x": 994.0333
}
}, // lefteye
"fix": true,
"avg": {
"y": 200.3238,
"x": 988.9051
}
} // frame
}, // values
"statuscode": 200,
"request": "get",
"category": "tracker"
}

12. 「安心・安全・安定・信頼」できるインターネットサービスを
視線を表示するプログラム
12
デモ

13. 「安心・安全・安定・信頼」できるインターネットサービスを
おまけ
13
Googleから画像検索してヒートマップを表示するデモ
参考: 「ImageMagick でサクッとヒートマップを作る」
http://qiita.com/daimatz/items/7d24db71515379c0e1a4

14. 「安心・安全・安定・信頼」できるインターネットサービスを
まとめ
• 視線追跡デバイスとしてThe Eye TribeをRubyから使っ
てみた。
• Qtライブラリを使うとGUIプログラミングもRubyででき
るよ。
14

15. 「安心・安全・安定・信頼」できるインターネットサービスを
• Thank You!
• If you have any comments,
• please send to:
• Mail: izawa@izawa.org / izawa@clwit.co.jp
• Twitter: @Yukimitsu_̲Izawa
15