ホームページ制作

あなたの発注コンシェルジュ

登録者数No.1
フリーダイアル

0120-917-819

営業時間 平日 10:00~19:00

公開日: 更新日:

【絶対使いたい!】WEBデザインの基本!無料で使えるワイヤーフレームツール5選【2020年最新版】

パソコンを見ている女性
目次

WEB制作関係のお仕事をされている方なら、作ったことがある方も多いであろうワイヤーフレーム。
しかし、それ以外の方にはあまり馴染みがないのではないでしょうか?
ワイヤーフレームというのはWEBサイトのレイアウトのことで、詳しいデザインなどを考える前に配置などをワイヤーフレームを使って決めることが多いのです。

このワイヤーフレーム、実は意外にも簡単に作ることができるんですよ!
新しいWEBデザインを業者に頼んでいるときに自分たちの希望をなかなかうまく伝えられないというあなたは、今回ご紹介するワイヤーフレームツールを使ってみてはいかがでしょうか?
無料で使えるものが多いので、手軽にはじめられますよ。

あわせてホームページ制作ツールをお探しの方はこちらもどうぞ!
無料で使えるホームページ・サーバーの一覧

「Cacoo」みんな使ってる定番ツール

「Cacoo」の公式サイト
出典Cacoo

WEBデザインの基礎とも言えるサイトマップやワイヤーフレームの制作ツールは数あれど、一番メジャーなツールとして広く知られているのがCacooではないでしょうか。

ワイヤーフレームだけでなく、サイトマップの構築やUML、さらにはネットワーク図まで簡単に作成することができます。
また、様々なツールと連携を図ることができるのがCacooの利点でもあり、パワーポイントとの共有機能は発表資料の作成などにも活用できます。
チャット機能も充実していますので、WEBデザインについて他の人と連携しながら作業をしていくことができますよ。

「Prototyper」

「Prototyper」の公式サイト
出典Prototyper

スマホやタブレット端末が普及している現代では、従来のWEBサイトに加えて、縦長サイズのWEBデザインを行なう機会も増えています。
そのようなWEBデザイン業界の変化に対応しているのが、Prototyperです。

ワイヤーフレームの作成用に、iPad、iPhone、Androidなど各機器に対応したウィジェットを用意しており、ドラッグ操作によって簡単に配置していくことができます。
WEBデザインにおいて気になってしまう日本語の文字化けの心配もありませんので、ワイヤーフレームが実際のイメージと違うというような心配もありません。
現在は、無料版と有償版が提供されていますので、まずは無料版を試しに使ってみましょう。

pencil project

AndroidやiPhoneといった、スマートフォンアプリ関連のWEBデザインを構築していく際に便利なのが、Pencil Projectです。

pencil projectはドラッグ・アンド・ドロップでの直感的な操作が出来るだけでなく、種類豊富なテンプレートやツールが揃っていますので、ワイヤーフレームづくりにおいても困ることはないでしょう。
機能は完全無料で使えますが、無料とは思えないクオリティと使いやすさで広く使われています。

moqups

「moqups」の公式サイト
出典moqups

ワイヤーフレームを手軽に生み出すことができるmoqups。
ドラッグ&ドロップの直感的な操作で、簡単にエレメントを配置していくことができるため、WEBデザインに役立ちます。

約60種類ほどUIエレメントがありますので、ワイヤーフレームはもちろん、もう少ししっかりとしたWEBサイトのデザイン、もしっかりと作成できます。
またPDFやPNGへ書き出していくことができるため、ワイヤーフレームを紙媒体でプリントアウトしたい時にもレイアウトが崩れることがありません。
登録すれば充実した機能を使うことができますが、登録をせずとも十分に使うことができます。

mockingbird

「mockingbird」の公式サイト
出典mockingbird

ワイヤーフレームを作成する時にはタグクラウドや広告用バナーといった機能を備えることも考えなくてはいけません。
そんな時にはmockingbirdがおすすめです!

近年のWEBデザインには必要不可欠なものとなったソーシャルメディアボタンにも対応しており、WEBデザインのときに使いたい機能は一通り備わっています。
ワイヤーフレームにをオンラインでシェアしたりもできるので、仲間同士の意見の交換も簡単に行えます。

ワイヤーフレームツールを使って、イメージを形にしよう

WEBサイト制作の第一歩であるワイヤーフレームづくりは、WEBデザインにおいてもとても重要です。
ワイヤーフレームで最初にイメージを共有することで、作業が進んでからのミスマッチを防ぐことができます。

WEBデザインを依頼された側はもちろん、依頼する側も使えるようになっておけば、いざ修正をお願いしようと思っている時にも修正指示が出しやすいですよ。
手軽に活用できるワイヤーフレームツールを使って、自分の頭のなかにあるWEBデザインや、イメージを形にしていきましょう。

BtoBのマッチングサイト「アイミツ」では、さまざまな分野に精通したコンシェルジュが5万件の企業データベースの中から、あなたにぴったりの制作会社を完全無料でご紹介しています。
お気軽にご相談されることをお勧めいたします。

ホームページ制作会社探しで、こんなお悩みありませんか?

電話が鳴り止まない

一括見積もりサイトだと
多数の会社から電話が・・・

見積もりを取っても不安

相場がわからないから
見積もりを取っても不安・・・

情報だけを信じるのは不安

どの企業が優れているのか
判断できない・・・

アイミツなら
  • point. 1 専門コンシェルジュがあなたの要件をヒアリング!
  • point. 2 10万件の利用実績から業界・相場情報をご提供!
  • point. 3 あなたの要件にマッチした優良企業のみご紹介!
アイミツ

著者

imitsu編集部

運営に関するお問い合わせ、取材依頼などはお問い合わせページからお願い致します。

アイミツに貴社を掲載しませんか
ホームページ制作会社が
最短翌日までにそろう