WEB制作関連

ペーパープロトタイピングのすすめ

みなさんはWEBサイトの画面設計をする時に何を利用するでしょうか。

PowerPoint、Excel、Visioやilluslator、Fireworksなど選択肢はいろいろあると思いますが、ここでは紙を使ったプロトタイプの作成を紹介します。

やることは簡単です。

ブラウザに見立てたB4くらいの紙を用意してそこに切り取って作ったイメージエリア、テキストボックスやフォーム要素などを並べながらインターフェイスを考えます。

できあがったらサイトに見立てて遷移や入力をシミュレーションしてみます。

実際にやってみると、不思議と画面とにらめっこしていては気付かない問題点に気付けたり、リテラシーのあまり高くない人でも意見がでてきやすくなったりしました。

家を建てる際に建築士の方が精巧な模型をつくって家主にイメージを伝えるのに似ていますね。特に家などは工事をはじめてから間取りを変えるなんてできませんしね。

クライアントから「ワイヤーフレームじゃよくわからない」なんて言われた時などにぜひ活用してみるとよいと思います。

ペーパープロトタイピングにぴったりのツールがあったのであわせてご紹介しておきます。

uxpin_01.jpg

uxpin_03.jpg

この記事を読んだ人はこんな記事も読んでいます

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

関連記事

  1. WEB制作関連

    WEBサイト高速化に便利!「Google PageSpeed Insight」

    「0.1秒の遅れが1%の売上に影響する」と言われるくらいWEBマーケテ…

  2. WEB制作関連

    色とWEBデザイン -茶色編-

    色別WEBデザインのまとめです。今回のテーマは「茶色」です。 …

  3. WEB制作関連

    商品の魅せ方がお洒落なECサイト25個

    商品の魅せ方が参考になりそうなECサイトのまとめです。 (さら…

  4. WEB制作関連

    EVERNOTEの新機能「Site Memory」実装編

    EVERNOTEからリリースされた新機能「Site Memory」を早…

  5. WEB制作関連

    写真を効果的に魅せる6つのjQueryギャラリー

    どんな情報を見せるにしても欠かせない画像を効果的に見せられるjQuer…

  6. WEB制作関連

    色とWEBデザイン -みどり編-

    前回に続いて、色を切り口に集めたWEBデザインのまとめです。今回のテー…

コメント

  1. WEBディレクタなら参考にしたい手書きの画面設計書

    様々なアプリケーションを試し、試行錯誤しながらWEBサイトの画面設計を行ってます…

  1. この記事へのトラックバックはありません。

  1. WEBマーケティング

    ブログをネタ切れさせない為のたったひとつのルールとは
  2. WEBマーケティング

    WEB探 vol.02『東京スカイツリー』
  3. Design Items

    猫好きにはたまらないアイテムを発見
  4. WEBマーケティング

    レコメンド機能を利用したクロスセルとアップセル
  5. WEB制作関連

    海外Webサイトの特徴 -中国編-
PAGE TOP
Top