ウェブの画面設計に使えるまとめ

構築するウェブサイトの規模が大きくなればなるほど、画面設計はとても大切なものになりますね。 要素の抜けや、動作的な矛盾が無いかを確認したり、デザイナーはその設計書を元にデザインをおこすので、設計書の善し悪しが、最終的にそのサイトの善し悪しに直結するのではないでしょうか? 今回は、画面設計の際に使えそうなサイトをいくつかピックアップしてみました。

PowerPoint Prototyping Toolkit

Office PowerPoint 2007をお持ちの方には便利なツールキットです。あらかじめ、よく使いそうな要素が用意されているので、とっても便利なキットです。

PowerPoint Prototyping Toolkit きれいなフォーム要素などが用意されています。

PowerPoint Prototyping Toolkit こちらはウインドウのプリセット。PowerPointで作ったとは思えないくらいとってもきれいに作られていますね。

PowerPoint Prototyping Toolkit

Tools – Information Architecture Institute

こちらは、いろいろなタイプのツールがVisioやPDF、PowerPointなどで用意されてます。試しにCavazzaWireframe.pptというファイルを開いてみました。フォームの部分などそのまま使えそうな感じです。

CavazzaWireframe.ppt

Interactive Prototypes with PowerPoint

PowerPointのサンプルが公開されています。

Interactive Prototypes with PowerPoint

Description of Enterprise Dashboard

ダッシュボードのサンプルです。

Description of Enterprise Dashboard PowerPointのテンプレートは、以前このブログで、ご紹介した『PowerPointテンプレートサイトいろいろ』からどうぞ〜。

Design Stencils – Yahoo! Design Pattern Library

Yahoo!が提供してくれている、キットはOmniGraffle,Visio,PDF,PNG,SVG形式で公開されているので、いろいろなソフトでそのまま使えて、とっても便利ですね。

Design Stencils - Yahoo! Design Pattern Library

オムニグラフ [Omni Graffle]

Macをお使いの方々は、Omni Graffleがいろいろなツールなどが公開されているので便利かも。

オムニグラフ [Omni Graffle]

Graffletopia

Omni Graffle用のシンボルやシェイプ、パターンなどがダウンロードできるサイトです。

Graffletopia

SimpleWireFrame

Graffletopiaで人気のSimpleWireFrameは必要要素が網羅されているので、とっても便利。

SimpleWireFrame

OmniGraffle Wireframe Palette

こちらのパレットも便利そうなツールですね。

OmniGraffle Wireframe Palette

PDF Prototypes: Mistakenly Disregarded and Underutilized

PDFで画面設計を書く方も多いのではないでしょうか?こちらでサンプルがダウンロードできます。

PDF Prototypes: Mistakenly Disregarded and Underutilized

DUB – DENIM

こちらは、ワシントン大学が開発したUIデザイン用のツールです。手書きで書き進めていく感じのツールです。

DUB - DENIM

関連記事

6件のコメント

  1. 初めまして、以前から色々と参考にさせていただいています。今回のテーマにしているUI設計などに関して、これまでユーザビリティなどに特化してコンサルをしている企業から雑誌が出るらしいです。DesignWalkerさんもぜひお読みになって感想をまたブログにしていただければと思います。DESIGN IT! magazineというそうです。これからも役に立つ情報、楽しみにしております。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です