パワポでプロト

ご存じのようにパワーポイントはプレゼンテーションソフトです。会議などでプレゼンテータが資料を聴衆に見せるためのソフトウェアですので、インターフェイス設計のツールとしては不適切だと思うかもしれません。しかし、一工夫すると、ユーザ自身に“操作”してもえるようなプロトタイプを作ることができます。

インタラクティブな紙芝居

パワーポイントではマウスをクリックするとスライドが切り替わり、順番に表示されていきます。これをスライドショーと言いますが、銀行のATMやOA機器の操作パネルの画面遷移は、何となくこのスライドショーと似ています。

また、ソフトウェアのインストールウィザードを使うときも同様の体験をします。多少のマウス操作はあるものの、それ以外はまるで“紙芝居”を見ているようにインストール作業が進んでいきます。一般のソフトウェアやウェブサイトの場合は動作はもっと複雑ですが、ゴールに到達するまで画面が順番に表示されるという点では同じです。

パワーポイントと普通のシステムの一番大きな違いは、スライドショーでは画面は原則としてタイトルスライドから最終スライドに向かって１直線に進むだけですが、普段、私たちがシステムを操作する時は分岐や後戻りを伴うことです。

しかし、ユーザの立場から見れば、操作に対応した画面が表示されるのであれば、背後でどんな処理が行われているのかという点は、あまり関心のないことです。（だから、ペーパープロトタイプが可能なのです。）

パワーポイントではスライド上のテキストや図形といったオブジェクトに対してハイパーリンクを設定できます。そして、そのリンク先として他のスライドを指定できます。これを利用すれば、ハイパーリンクを設定したリンクやボタンをクリックした時に、それに対応したスライドが表示できるようになるので、分岐や後戻りを含んだかなり複雑な画面遷移が作れます。

また、オートシェイプを使ってイメージマップのようなインターフェイスが作れます。オートシェイプで矩形や円形を作成して、それを画像の上に重ねます。その矩形や円形にハイパーリンクを設定します。後は、オートシェイプの書式を変えて「無色透明」にしてしまえば、イメージマップの完成です。

なお、標準設定ではスライドを表示している時に、マウスをクリックしただけでスライドが切り替わってしまいます。そこで、「画面切り替えのタイミング」の「クリック時」チェックボックスをオフにすれば、リンクやボタンをクリックした時だけスライドを切り替えられるようになります。

組み込みアプリにピッタリ

パワーポイントがプロトタイプ制作ツールとして優れている点はいくつも挙げられます。

• 誰でも持っていて、誰でも使えます。ビジネスの現場でPhotoshopやDreamweaverを使うのは、デザイナやウェブ制作者などある程度限られた人になりますが、パワーポイントならば職種や地位にかかわらず広く利用されています。ソフトウェアエンジニアでも「ワードは使わないけれども、パワーポイントは使う」という人は多いのではないでしょうか。
• スライドマスタが設定できます。普通のプレゼンテーションで全てのスライドに会社のロゴを表示したりするために使いますが、プロトタイプの場合は、インターフェイスの共通部分（ナビゲーションなど）をスライドマスタ上に作成します。こうしておけば、ナビゲーションに変更を加える時に、何十枚もスライドを修正しなくても済みます。
• マルチメディア機能が豊富です。簡単なアニメーションを作成する機能を搭載していますし、アニメーションGIFもスライド上でそのまま再生できます。また、ビデオ映像や音声も再生できます。これらを使えば、動きのある画面が手軽に作成できます。
• スライドの切り替えのタイミングをコントロールできます。例えば、「５秒間エラーメッセージを表示してタイムアウトして元の画面に戻る」といった画面遷移を簡単に作成できます。また、アニメーションや映像を自動再生して、それが終わると同時に次の画面を表示することもできます。

以上、良いことばかり書いてきましたが、もちろん、パワーポイントには限界があります。最も残念な点は、スクロールする画面が作成できないことです。パワーポイントはプレゼンテーション用のスライドを作成するソフトウェアなので、１枚１枚のスライドを上下させるという概念はありません。そのため、ウェブページのプロトタイプ制作にはあまり向いていません。

パワーポイントが向いているのは、組み込みアプリケーションやソフトウェアウィザードのインターフェイス設計だと思います。銀行のATMや駅の自動券売機、OA機器の操作パネル、パソコン周辺機器のセットアップウィザードなどは、パワーポイントを上手く使えば、手軽にプロトタイプが制作できます。

【参考情報】

（１）Results from a survey of web prototyping tools usage（英語）
http://www.guuui.com/issues/01_03_02.php
2002年6月に行われたプロトタイピングツールに関するオンライン調査の結果です。３大ツールはHTML tool(Dreamveawerなど)が28.3%、Diagramming tool(Visioなど)が24.5%、Graphic design tool(Photoshopなど）が18.9%でした。以下、PowerPointは9.4%、「紙」は7.5%でした。なお、この調査は「ウェブ」のプロトタイピングツールの調査です。

（２）PowerPointLab（英語）
http://www.scils.rutgers.edu/~aspoerri/Teaching/HCISpring2003/PCLabs/PowerpointLabWeb_files/frame.htm
米国の大学のHCIのコースの教材です。パワーポイントでプロトタイプを作るノウハウ（内容は、私とほぼ同じ）が出ています。米国では、この程度のことは学生時代に経験するんですね。