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




ワイヤーフレームとは?

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

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

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

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

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

国産ツールcacoo(カク−)

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

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

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

編集画面

Wireframe.cc

https://wireframe.cc/

https://wireframe.cc/

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

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

編集画面

moqups

https://moqups.com/
https://moqups.com/

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

編集画面

UXPin

https://www.uxpin.com/
UXPin

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

編集画面

Fluid UI

http://Fluid%20UI
Fluid UI

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

Balsamiq Mockups

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

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

Balsamiq Mockupsb

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

スポンサーリンク

Axure

http://www.axure.com
Axure

Pidoco

http://pidoco.com
Pidoco

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

Visio

http://visio.microsoft.com/
Visio

  • 動作環境: Windows
  • 価格:

InDesign CC

http://www.adobe.com/products/indesign.html
InDesign CC

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

Justinmind Prototyper

https://www.justinmind.com/
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/
https://prottapp.com/ja/

Pocket
[`evernote` not found]

スポンサーリンク