[HCD]インタラクションを伝える(ペーパーホワイトボードプロトタイピング)

更新日:2014/8/10



ペーパーホワイトボードプロトタイピングのAPCHI2012(ご参考まで、このページの最後に、ポスターを掲載しました)後の近況です。


最近は、グラフィックとしての忠実度の低い
プロトタイプを使い、他者(チームメンバーやステークホルダー)にコンセプト(特にインタラクションについて)が分かりやすく共有できないか検討しています。スマートフォンやタブレットなどのタッチデバイス向けのアプリケーションが対象です。

何かの行為を行う指と、その行為によって生じる人工物の変化(例えば、指のジェスチャーによる操作に伴う隠れていたパネルがスライドする等)が合わせて明示されることによって、他人に意図が伝えやすくなること(※1)を期待しています(マウスの場合は、マウスカーソルがその役割を持っていたと思います)。実装前の段階で。

※1 これは、行為遂行の7段階理論(D.Aノーマン:「誰のためのデザイン」)で言うところの、「実行の段階」と「評価の段階」の際に行われる行為とそれに伴う変化がイメージしやすくなるためと予想しています。


■どのような方法か:

<準備>
ペーパーホワイトプロトタイピング後、スケッチのワイヤーフレームと一緒に、想定するオブジェクトの変化に合わせて指もスマートフォン(またはタブレット)で撮影する。ストップモーションのように、ユーザインターフェイスを操作している様子を表現する。

Paper in Screen Prototyping のアプローチで、スマートフォンやタブレットに撮り込んだワイヤフレームと指の画像をプロトタイプとして使用する(※2)。

※2 CEDEC2012にて発表された 「スマートフォンゲーム開発の為の”心地よい”ユーザーインターフェイスデザイン」も参考になります。また、2012年11月には、「POP」と言うiOS向けアプリケーションがリリースされています。

・ストーリーに沿って、上記の画像を並べる(例えば、iOS標準の写真アプリ、またはJotNot Pro等を使用)。

<実施>
・ストーリーに沿って、画像を遷移させながら、コンセプトを伝える。

<その後>

・ワイヤーフレームをブラッシュアップ・・・<準備>に戻る。

なお、実際にペーパーホワイトボードプロトタイピングを行う際に、使用するペンと紙製ホワイトボードですが、以下の製品が使いやすいと思います。どちらもAmazon等のオンラインで購入できます。

 - ペン: パイロット ボードマーカーイレーザー付極細・小型黒 WBME15EFB  

   →ペン先幅は0.5mm-0.7mm程です。
 -紙製ホワイトボード: 欧文印刷 消せる紙 A1版




以下の動画は、iOS標準の写真アプリのスライドショー機能を利用したシンプルな例です。


 



■この方法の限界:
ストップモーションをベースとしてるため、0.1秒単位と言った微小な時間変化を考慮したインタラクションを伝えることには不向きだと思います。

■利用イメージ:
エレベータに乗っている間にできるストーリボーディングをイメージしています。

■きっかけ:
これは、画面の向こう側に存在する指とボタン(のスケッチ)を見て、自身もタップしている感覚が再現されるだろうか・・・と考えたことがきっかけです。


ゲームインターフェイスデザインの分野で用いられている「Diegetic Interface」と関連する試みかと考えています。また、拡張現実感の研究、例えば「Vision of a pictorial hand modulates visual-tactile interactions」も。


考えたはじめたきっかけの種は、2年ほど前に、東京ミッドタウンのデザインハブで開催されていた「にんげんをしあわせにするデザイン展」で見た、ある一つの展示だと思います。


■デザインとしての背景:


<キーワード>
・メンタルモデルの構築
 -NUIにおけるノーマンの行為遂行の7段階理論
 -映像による一人称的運動イメージの生成
・GUIとは異なる軸のプロトタイプの忠実度(運動イメージの認知しやすさ)

最近は、掲載した写真のようにプロトタイプのパターンを幾つか作り、試しています。
漫画を読んでいる時の没入感とも関係するのだろうな、と等と考えながら。


■スライド:
ゲームコミュニティサミット2013にて、「UXのためのUIデザイン -スケッチxプロトタイピング-」という題目で講演した際のスライドです。

■追記(2014.8.10)



■参考リンク
------------------------
・「無限と微小」:[HCD]HIS2011×ペーパホワイトボードプロトタイピング
・「無限と微小」:[HCD]ペーパー"ホワイトボード"プロトタイピング(...
・「無限と微小」:[メモ]ホワイトボードを折り畳み手元に置く

「ISO 9241-210 : 2010」
「UX白書」

・「観察と記述」:インターフェイスデザインやインタラクションデザインがなぜ重要か
梅澤、寺沢:「手の行為と現象の動きをモデルとしたインタラクションデザイン」、日本デザイン学会(2010)
・「The Mobile Frontier(邦題:モバイルフロンティア)」
・ソシオメディア:「ジェスチャ操作の意義と課題」
「デザインあ展」

ペーパーホワイトボードプロトタイピングは、UXのためのデザインプロセスの中で行う手法の一つに位置づけられます。今回の内容は、「ISO 9241-210:2010」の6.4節「設計による解決案の作成」に関係すると思います。



■補足
------------------------
・Wireframing with Paper Whiteboard in Collaboration, APCHI2012 (2012)



最後に、今回のエントリーを書いたきっかけは、先日開催された「Interaction 13 Redux in Tokyo and IA Cocktail Hour」に参加した際のIA Cocktail Hourでの会話でした。ありがとうございました。


コメント

このブログの人気の投稿

サービスデザインとISO 9241-210

【図解】ISO 9241-210におけるUXの定義

[パターン認識][UX]思考実験(パターン認識とUX)