Tweeq

Parameter-Tuning GUI Widgets by/for Creative Professionals

コンテンツ創作の現場で利用される制作ツールは、プリミティブ型のパラメタを調整するために数値スライダーやツマミ型のインタフェース、カラーピッカーなどのGUIウィジェットを数多く備えている。こうしたウィジェットはプロの実践において重要な役割を果たしているにも関わらず、Human-Computer Interaction分野の研究においてそうしたウィジェットの設計は「解決済み」と見なされがちで、クリエータの不満が見過ごされてきた面がある。

本研究では、市販の一般的な制作ツールに実装されたGUIウィジェットの実例を収集し、インタラクション設計を分析し、プロのクリエータ向けのウィジェット設計に関する3原則を導出した:

• ユーザの繊細な制御戦略に応えるために、多様な入力モードを併存させること
• 熟達したユーザ向けに、高速で高精度なインタラクション設計を優先すること
• 作業空間を確保するために、ウィジェットの専有面積をできるだけ抑えること

そして、これらの原則に基づくリファレンス実装としてGUIウィジェット群 Tweeq を開発した。 Tweeq は第一著者によるアニメーション制作の実践と並行して実装され、少ないクリック回数でのパラメタ調整、オーバーレイ表示による継続的な視覚フィードバック、常時注視を必要としないジェスチャやキーボード入力のサポートといった特徴を備える。

Tweeq を用いたサンプルアプリケーションを実装し、プロユーザによる簡易評価を行ったところ、おおむね好意的な反応が得られ、提案した3原則が制作ツールのためのGUI開発において有用であることが示唆された。

Tweeq は本論文で提案した制作ツール向けGUIウィジェット群である。(a) Tweeq が提供するコンポーネントの一覧。(b) カラーピッカーとオーバーレイ表示。(c) オーバーレイ表示を備えたタイムコード入力インタフェース。(d) 角度入力インタフェースを同時調整する様子。

*第一著者の橋本は、産総研の協力研究員（論文メタデータの所属）としてだけでなく、独立したビジュアルアーティストとして本研究に取り組んだ。

本論文におけるプロのクリエータ向けのウィジェット設計に関する3原則に基づくリファレンス実装 Tweeq は Vue.js と TypeScript で開発され、 GitHub でオープンソース公開されている。