ワイヤーフレーム作成ツール比較18選

ワイヤーフレームとは？

ワイヤーフレームとは一言いえば、「WEBサイトの設計図」です。

例えば以下は、Wireframe.ccを使って作成したワイヤフレームです。
「どの要素をどこに配置するのか？」を作成します。

どんなときに活用するのか？

• WEBサイト、ブログ、ネットショップのレイアウト（配置）を考えるとき。
• 物販で商品ページの完成形のイメージをウェブデザイナーに伝えるとき

ワイヤーフレーム作成ツール比較18選

国産ツールcacoo（カク−）

https://cacoo.com/lang/ja/

• 動作環境：ブラウザ上で動作するワイヤーフレーム作成ツールです。Macも利用可能です。
• 価格：無料〜

編集画面

Wireframe.cc

https://wireframe.cc/

複雑な操作は必要ありません。
ドラッグ＆ドロップでサクサク感覚的にワイヤフレームを作成できるツールです。
はじめて、ワイヤフレームを作成する人でもすぐに使い始めることができます。

• 動作環境：ブラウザ上で動作するワイヤーフレーム作成ツールです。Macも利用可能です。
• 価格：無料〜$99/月額

編集画面

moqups

https://moqups.com/

• 動作環境：ブラウザ上で動作するワイヤーフレーム作成ツールです。Macも利用可能です。
• 価格：無料〜$99/月額

編集画面

UXPin

UXPin

• 動作環境：ブラウザ上で動作するワイヤーフレーム作成ツールです。Macも利用可能です。
• 価格：$19〜$99/月額
• フリートライアル（無料試用）あり

編集画面

Fluid UI

Fluid UI

• 動作環境：WEBブラウザ上で動作するワイヤーフレーム作成ツールです。Macも利用可能です。
• 価格：$19〜$99/月額

Balsamiq Mockups

Balsamiq Mockups

• 動作環境：WEBブラウザ,Mac, Windows web-based
• 価格：

Balsamiq Mockupsb

https://balsamiq.com/products/mockups/

Axure

Axure

Pidoco

Pidoco

• 動作環境：WEBブラウザ,Mac, Windows web-based
• 価格: $12-$175/月

Visio

Visio

• 動作環境: Windows
• 価格:

InDesign CC

InDesign CC

• 動作環境: Mac, Windows
• 価格: 

Justinmind Prototyper

Justinmind Prototyper

POP

https://popapp.in/

• 動作環境 Mac
• ダウンロードタイプ

Pencil Project

http://pencil.evolus.vn/

• 動作環境 Mac
• ダウンロードタイプ

PowerMockup

http://www.powermockup.com/

MockFlow

https://www.mockflow.com/

• 動作環境: Mac, Windows

mockingbird

https://gomockingbird.com/home

• 動作環境: WEBブラウザ

シンプルな直感的に使いやすいツールです。

Prott

https://prottapp.com/ja/