
新しいウェブデザインのプロジェクトを始めるときは、枠組み(ワイヤーフレーム)のスケッチから開始する方も多いのではと思います。
ワイヤーフレームを使うことで、どのようなウェブデザインを作成していくのか計画を練ることができます。
またヘッダーやコンテンツ部分、フッターなどの主要パーツをどのようにレイアウトするのか一目で分かり、時間の節約にもつながります。
今回はWeb Design Ledgerで、そんなワイヤーフレームをオンライン上で簡単に作成することができるツール10個をまとめた「10 Excellent Tools for Creating Web Design Wireframes」をご紹介します。
複数の人でリアルタイムに編集を加えることができるユニークなサービスなどを、それぞれのオンラインツールが備えているので、自分に合ったツールを見つけて見てはいかがでしょうか。。
詳細は以下から。
ウェブデザインのワイヤーフレーム用オンラインツールまとめ
リアルタイムに複数同時編集が可能なオンラインツールのひとつ。
あらかじめ大量のアイコンやパーツを備えているので、直感的な操作感となります。
チャット機能を合わせて使うことで一緒に作業をしている感覚になりますよ。
こちらがサンプル用動画となります。
Real-Time Design Collaboration from Produle on Vimeo.
こちらのアプリケーションはクライアントとのやり取りを円滑に進めるための工夫がされたオンラインツールのひとつ。
ワイヤーフレームを簡単に作成することができるのはもちろん、完成したワイヤーフレームを使ったプロトタイプをパスワードと一緒に管理することができます。
またコンセプトをまとめた仕様書もボタンひとつで印刷することができます。
個人的に使ってみたいツールのひとつです。
手書き感覚でモックアップを仕上げていくことができるオンラインツール。
とりあえず頭の中のアイデアを他の人と共有したいときなんかにサクッと使うことができるのではないでしょうか。
こちらのツールは主要ブラウザのひとつFirefoxのアドオンに対応しており、ワイヤーフレームのほかに簡単なチャートなども描くことができます。
すっきりとしたシンプルなインターフェースも魅力的なのですが、ほとんどの作業をドラッッグ&ドロップで行うことができる簡単な作業方法も人気のひとつです。
全ての作業をオンライン上で行うため、インターネット環境さえあればどこでも作業を続けることができます。
ラフなモックアップを仕上げたいときに使えるツールのひとつですが、このツールの最大の特徴は日本語に対応している点ではないでしょうか。
サンプル用のデモ動画なども全て日本語で紹介されているので、操作方法などに迷うことなくサポートも万全です。
またリアルタイム同時編集も可能となっているので、個人的にオススメのツールですよ。
こちらのツールは複数でひとつのプロジェクトを進めるときに活躍しそうですよ。
作成したプロトタイプに他の共同編集者はレビューを残すことができ、リアルタイムでフィードバックやアドバイスを残すことができるコミュニケーション型オンラインツールです。
こちらはMac OS専用アプリケーションなのですが、シンプルでオシャレな操作環境に加え、ボタンなどのたくさんのデザインパーツを標準装備しています。
ワイヤーフレーム作成も直感的に行うことができるので、ウェブデザイナーさんにもオススメしたいツールのひとつです。
オンライン上でワイヤーフレームを作成することで、他の共同編集者とリアルタイムなコミュニケーションが取れ、作業もはかどりそうです。
しかしもっとアナログに鉛筆を使って直接紙にデザインしたいという方は、以下の各種PDFペーパーを印刷するとよいかもしれませんよ。
印刷可能、UIデザインのモックアップ用無料スケッチPDFファイルまとめ
参照元サイトにはこの他にも今回紹介していないオンラインツールがいくつかまとめられていますので、よろしかったらこちらも合わせてどうぞ。
[参照元 : 10 Excellent Tools for Creating Web Design Wireframes – WebDesignLedger]