Transcript DIY Stroke Recognizer

DIY Stroke Recognizer
大綱
• 手勢辨識概要
–
–
–
–
•
•
•
•
什麼是手勢辨識？
手勢辨識的例子
做手勢辨識很難嗎？
手勢辨識的方法有哪些？
$1 Unistroke Recognizer in JavaScript
其他的實作方法
$N Multistroke Recognizer in JavaScript
DIY自己的手勢辨識
簡介手勢辨識
• 什麼是手勢?
– 一種利用肢體語言(body language)的非語言
(non-verbal)的溝通方式
– 在電腦上，通常指的是滑鼠手勢
(mouse gesture)
• 什麼是手勢辨識
– 透過特定的程序(Program)或演算法(Algorithm)
– 辨認使用者給定的手勢
手勢辨識的例子
關鍵報告中的手勢操作
Magic Trackpad的手勢操作
做手勢辨識很難嗎？
• 可能需要用到的背景知識
– Hidden Markov Models
– Neural Networks
– Dynamic Programming…
• 由誰來做比較適合？
– 菜鳥程式設計師(Programmer)
– 人因專家(Human factor specialists)
– 介面設計人員(Interface Developer)
• 辨識力？互動性？
手勢辨識的方法有哪些
• 使用開發好的程式庫
– Artkit and Amulet
• 使用作業系統內建的功能
– Siger recognizer on Microsoft’s Tablet PC
• 自己開發(必須具備足夠的背景知識)…
– Statistical classifier
– Feature extraction
– Template matching
$1 Unistroke Recognizer in JavaScript
• 必須是：
–
–
–
–
–
–
–
–
可以對於不同移動速率的取樣有適應性
可支援不同角度、位置、旋轉
不需要高深的數學技巧
可以用幾行程式就完成
可以達到即時互動效果
可以只使用一個新例子就加入新的手勢
可以有一與取樣點數無關的N-best list以代表相關度
辨識率必須與目前HCI現有更複雜的方法相當
$1 Unistroke Recognizer in JavaScript
• 簡單的四步驟演算法
– 重新取樣
– 角度修正
– 大小及位置修正
– 找出最佳的Unistroke
$1 Unistroke Recognizer
重新取樣
$1 Unistroke Recognizer
角度修正
• 找出Stroke的中心
• 找出起始點
• 找出Indicative Angle (中心與起始點連線的
夾角)
• 將圖形旋轉使IndicativeAngle為零
$1 Unistroke Recognizer
大小及位置修正
• 將圖形調整至預設的方塊大小
– SCALE-TO-SQUARE
• 將圖形位移至原點(0, 0)
– SCALE-TO-ORIGIN
$1 Unistroke Recognizer
找出最佳的Unistroke
• C是要被比較的圖的取樣點集合，Ti為第i個
內存範本的取樣點集合，N為取樣點數
• d為比較後差異值
• Size為Step 3大小修正的方塊邊長，di*為最
小的差異值
• Score為此C與T的分數(越高越好)
其他的實作方法
• http://depts.washington.edu/aimgroup/proj/d
ollar/
$N Multistroke Recognizer in
JavaScript
• $1只能接受1筆劃
• $N目標解決多筆劃問題