手書き入力検索

大盛らの研究[19]のように動画内の描き込み内容を用いて、 どの時間に描いたかを知り、 シー クする機能があれば 既存システムに比べて望んだ動画内位置に対して描き込みを行うことが容易 になる。 例えば、 ニコニコ動画のインタフェースではコメントリストにおいてダブルクリックを

第3章 システムの提案 34

行うことによって、 その動画再生時間をシークすることが可能である。 しかし、 大盛らの手法は 基本的に個人で用いることを想定したシステムであり、 匿名の複数人数に付与される場合には線 の数が膨大となり適切に機能しない。

そこで、 本システムでは手書き入力を検索する機能を提供する。 検索対象となる手書きスト ロークはその動画に対して付与された手書きストローク全てである。

ユーザが検索のために入力した手書きストロークと、 動画内に描きこまれた手書きストローク に対してそれぞれ類似度を算出し、 類似度の高いものを候補として提示する。 手書きストローク の類似度の計算にはWobbrockら[20]のアルゴリズムを本システムに合うように一部変更し、 用 いる。

Wobbrockら[20]の認識手法

Wobbrockら[20]はJavaScriptによる、Webページ上で動作する軽量かつ精度の高いストロー クの認識手法を開発した。 このアルゴリズムでは、 まず初期段階として比較したい線の登録を行 う。 なお、 比較する手書きストロークのデータは線が連結している点の集合であり、 不連続な線 分を比較することはできない。 本システム内の場合は動画を再生する際にサーバから取得した手 書きストローク全てがこれに当たる。 これらのストロークに対して次の処理を施した後、 それら をテンプレートとして保持する。

1. ストロークの点数をNにするよう、 等間隔距離に振り直す(Nは精度に応じて調整) 2. 書き出しの位置が手書きストロークの重心の右に来るよう回転

3. 手書きストロークがある矩形領域に合うように座標の調節 4. 重心が原点座標となるように移動

このようにして保持したテンプレートと実際に検索を行うために記入した手書きストロークを比 較する。 検索のためのストロークをクエリストロークと呼ぶ。 クエリストロークをC、 テンプ レートの集合をT とし、i番目のテンプレートをTiと表現する。 Ti[k]はi番目のテンプレート における、k番目の点(x,y)を表している。 同様、 クエリストロークのC[k]はCにおけるk番 目の点である。 これらを用いて、 距離diは次のように算出される。

di = Σ^N_k=1√

(C[k]x−Ti[k]x)²+ (C[k]y−Ti[k]y)² N

この距離が近しいものを選択することでストロークの検索が完了する。

インタフェース

手書きストローク検索のインタフェースは図3.15のようになっている。 左がクエリストローク を入力するキャンバスで、 右がその結果を出力するキャンバスである。 左部分に手書きストロー クを入力すると最も距離の小さいストロークを検索し、 その上位3つを右のキャンバス内に緑色 で提示する。 提示する位置は動画内で表示される位置と等しい。 この際、 図3.15のように最も 近い候補ほど色が濃く提示されるようにしている。 そのストロークが提示される部分を動画内で 閲覧したい場合には、 ストロークをクリックすることで、 動画プレイヤー内でシークを行う。

第3章 システムの提案 35

図3.15: ストローク検索ウィンドウ

図 3.16: ストローク検索ウィンドウ,候補の線にマウスカーソルを乗せるとストロークの時間とそ

の時の手書き描画状況を提示する

実際にそのストロークが目的としたものなのかを容易に判別できるよう、 マウスオーバー時に その候補の手書きストロークと同時に描画されるストロークを提示する。 それが図3.16である。

図では第三候補のストローク上にマウスカーソルを乗せている。 すると、 そのストロークが描画 された時間の手書き状況が再現された線が出現し、 候補のストロークが「あ」の3画目の部分で あったことがわかる。

36