[IA] ワイヤーフレーム

ウェブサイトの設計にはユーザーインターフェース (UI) に関する設計書もドキュメントとして作成する必要があります。

O’Reilly Japan — Catalog — Web情報アーキテクチャ 第2版」にも記述されている「ワイヤーフレーム」について関連情報を調べてみました。

同書籍のp. 294にある「IA Wiki」サイト内のワイヤーフレーム関連情報は下記URLからリンクできます。
IAwiki: WireFrames

Boxes and Arrows: Where the Wireframes Are: Special Deliverable #3

The Pros and Cons of Wireframes

  • demonstrates a site concept quickly, allowing clients to react to content placement and rendering
  • can provide guidance to visual designers with respect to information priorities
  • allows for usability testing early in the project lifecycle
  • can elaborate on a singular vision for the site
  • can facilitate collaboration between design team and information architects
  • is easy for clients to understand


  • hinders creativity and innovation by imposing (real or imagined) limits on design team
  • distracts client from tasks at hand: evaluating page priorities, understanding information relationships
  • is not necessarily HTML-ready if not developed to scale
  • is not necessarily HTML-ready if developed without “chrome”
  • does not provide accurate usability testing results
  • relies on other documentation to provide a complete picture
  • does not consider color, typography, and other brand identity elements
  • requires time to wrestle with layout details, which might change in final design anyway