最終更新日: 3月20日

KeynoteでUIデザイン　その２

07-12-03 posted by
akimoto

前回「Keynote」でUIデザインをしている話を書きましたが、今回は具体的な例として普段の作業風景をMovieにまとめてみました。

(1)「Keynote」で画面パターンのラフデザインをします。
※「Keynote」の描画力に注目！

(2)各ページにリンクをはって画面遷移を確認。共有したい場合はpdfに書き出して完了。

pdfに普通に書き出した場合、どの部分にリンクがはられているかが分かりにくいという難点があります。その場合は、Adobe Acrobat上でリンクを作成した方がいかにも「ボタン風」の見た目になって分かりやすいと思います。（詳しくは３番目のムービーで）

また別の活用法として、グラフィックデザインを作り込む前段階のペーパプロトの状態で、その紙を写真におさめてpdfに読み込み、その上にリンクを貼るだけでも動線の確認ができます。これは作業の上流行程で手軽に使えるので、かなり有効な手法だと思います。
私も含めてデザイナーという人種は、すぐにイラレでグラフィックをつくりたがる傾向がありますが、そこはぐっとこらえて、まずは画面設計をじっくり考えるようにしたいものですねー。

(3)ペーパープロトをpdfで動かす。