無料で使えるワイヤーフレームツールのまとめ

2008年7月10日 1:50 am

Firefox 上で動作するワイヤーフレームツール Pencil をはじめ、無料でしかも便利なツールが増えてきました。紙とペンでワイヤーフレームを描くのは基本ですが、より本物に近いプロトタイプを作るのであればソフトウェアを使うのが最適です。以前紹介した「プロトタイピングの基礎の基礎」も併用に読んで今回紹介するツールの中から自分に合ったツールを探してみてはいかがでしょうか。

DIA: a drawing program
UMLダイアグラムに特化していますが、ワイヤーフレームも作れます。基本的にデータは XML で保存されますが、EPS, SVG, PNG といった別形式にも書き出せます
DENIM
タブレットで操作すると快適そうなプロタイピングツール。サイト内をどのように移動するかを確認するには使えそうです
OpenOffice: Draw
OpenOffice にある Draw というスケッチをするためのプログラムは、ダイアグラムやワイヤーフレームを描くのに最適です。swf 形式に書き出せる機能も付いていたりします
CmapTools
コンセプトマップというマインドマップにも似たダイアグラムを作るのに特化していますが、ワイヤーフレームやプロトタイピングにも使えます。サーバー経由で共同作業も出来るのが魅力
Gliffy
ダイアグラムが描ける Web サービスは幾つかありますが、中でも Gliffy は優秀です。ユーザーインターフェイス系のパレットも用意されているのですぐ使えそうです
Compendium
ダイアグラム制作ツール。データの埋め込みも出来ますし、こちらも CMapTools と同様、共同作業が出来ます
Serena Prototype Composer
以前は有料でしたが今は無料で配布されています。サイトマップからフレームワークといった制作向けの機能から、要件チェックといった管理系のものまで様々な機能が統合されています

コメントを書く

About

東京在住の「デザインする人」長谷川恭久の個人サイトです。

2008年2月より、新しい CMS を利用して再スタートしました。以前の記事はこちらのエントリーリストを。そして、たくさんの方に読まれた人気記事が読みたい方ははてなブックマークの注目エントリーを参考にしてください。

Feedbacks
  • ヤスヒサ: @おかもと コンテンツを作るだけでなく、クオリティ維持と管理もされていた 『編集長』ならでは視点ですね。文章の編集だけでなく、ハイパー リンクなども含め、いかにウェブらしい形に落とし込むのか...
  • おかもと: 某所でお話のダイジェストを拝見しました。昨日までwithDと いう月に100記事ぐらい公開するサイトを運営していましたが、 こちら前任者が構築までやったものの、運営のことが全く考...
  • ヤスヒサ: @T4learning ブログでも紹介されてましたね。ありがとうございます。 ブラウザという存在は知ってもらいたいという思いはありますが、 ちょっと言葉が外来語しすぎていますね。何も連想出来ない...
  • T4learning:  ブラウザ、というコトバには、はうちの学内の職員も?という反 応が多いです。言葉自体、一般の人には馴染みがないでしょうね、 日本では。「ブラウザ=検索」という感覚があるか、今度聞いてみ たいなあと思いました。...
  • Name: 細かいつっこみになりますが@font-faceをサポートして いるFirefoxの次期バージョンはFirefox 3.5です。諸事情で3.1というバージョンはスキップされて繰 り上がりました。