webディレクターの方のみならず、マーケティング担当者が外部に制作発注する際などにも活用するワイヤーフレーム。なかなか業務工数がかかる作業なので、効率的に作成出来れば嬉しいですよね。
ワイヤーフレームといっても、色んな形式、色んな作成ツールがあって、スタート時点で迷ってしまう事も多々あります。今日は、筆者が実際に使ってみてオススメしたい、無料で使えるワイヤーフレーム作成ツ―ルをご紹介します。
無料のワイヤーフレーム作成ツール6選
JustinMind
オーソドックスな形式でワイヤーフレーム制作を手軽にやりたい人向けのツールです。インストールして使用するタイプのツールです。ブラウザ上で動作するツールを選びがちですが、よく考えればオフライン時も使用できるので便利ですよね。
英語表記ですが、編集画面はアイコンが並べられていて、それらをドロップ&クリックしていくだけなので、英語が分からない人でも感覚的に使用する事が出来ると思います。
POP
https://marvelapp.com/pop/?popref=1
POPは、スマホで手書きのワイヤーフレームの写真を撮って、それらを紐づける事が出来るツールです。手書き派の人にも、より作業を効率化してくれるツールとして人気です。リアルタイムのミーティングなどでも使えますね。
下記はサービス紹介動画です。動画をみていただければ、より使用感がイメージしやすくなると思います。
Mockflow
mockflowは、ブラウザ上で使用できるワイヤーフレームツールです。比較的多機能でUIコンポーネントが充実しています。また、チャット機能が付属している為、チームでリアルタイムの作業をするのにとても便利です。
日本語対応はしていませんが、こちらも感覚的に使用できるので、問題ないかと思います。
moqups
moqupsもブラウザ上で動作するワイヤーフレームツールです。デフォルトで用意されているステンシルをドラッグ＆ドロップで動かしていくだけなので、こちらも日本語対応していませんが、日本語オンリーの人でも問題ないはずです。
アイコンなどの装飾機能が充実していて、かなり本格的なワイヤーフレームが作成出来ます。
Wireframe.cc
wireframe.ccは、とてもシンプルなワイヤーフレーム作成ツールです。ブラウザ上で動作します。多機能すぎるよりシンプルなツールの方が使いやすい、といった人にオススメです。
ちなみに筆者が最も使っているのはwireframe.ccです。URLをたたいたら即編集ページという潔さがまた嬉しいですね。機能性自体は高いツールなので、多機能なものと比べて完成品のクオリティに差が出るようなこともありません。
BALSAMIQ
こちらもブラウザ動作するワイヤーフレーム作成ツールです。まず、沢山手書きができます。同時に、webツールとしての機能も備わっているので、今迄手書きで作っていたけど、そろそろwebに移行しようかなと考えている人にとっては、入りやすいと思います。
チームで編集しやすいよう、全員でリアルタイムにレビューが出来るようになっているので、チームで制作する際も便利です。
まとめ
如何でしたでしょうか？今日は、実際に筆者が使用して使いやすいなあと感じたツールを厳選してご紹介しました。ワイヤーフレームツールはソフトによって使用感が全く異なってくります。
今回は無料ツールに限って紹介しましたが、有料版でも無料でお試し版を使用できるツールも沢山あるので、自分に使いやすいツールを探して、見つける事をオススメします。そうすればきっと、作業効率もあがるはずです。