WEB制作関連

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

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

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

やることは簡単です。

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

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

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

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

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

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

uxpin_01.jpg

uxpin_03.jpg

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

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

関連記事

  1. WEB制作関連

    色とWEBデザイン -あか編-

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

  2. WEB制作関連

    おしゃれは足元から。フッターの素敵なWEBサイト30個

    最近は「ファットフッター」などと呼ばれ、厚めのフッターにサイトマップな…

  3. WEB制作関連

    テクスチャ使いが秀逸な35個のWEBサイト

    効果的なテクスチャの使い方で世界観をつくりだしているWEBサイトのまと…

  4. WEB制作関連

    WEBサイト心理学|視線解析

    「ウソを付く時に人は右の方を見てしまう。」というのを聞いたことはありま…

  5. WEB制作関連

    固定配置したナビゲーションのWEBサイト21個

    ナビゲーションが固定配置されたWEBサイトのまとめです。このブログもナ…

  6. WEB制作関連

    Webサイトをレイヤーに分けて保存できる「Page Layers」

    久々の更新になってしまいましたがおもしろいMac Appを見つけたので…

コメント

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

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

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

  1. Design Items

    ありそうでありえない世界を創りだす「Erik Johansson」
  2. WEB制作関連

    思わず問合せたくなる素敵なデザインのフォーム25個
  3. 話題・トレンド

    iPadをゲームセンターに変える「joystick-it」
  4. WEB制作関連

    jQueryを学ぶなら必ず見ておきたいサイトまとめ
  5. WEBマーケティング

    マーケティング心理学|準拠集団
PAGE TOP
Top