ワイヤーフレーム作成ツール比較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

   

コメントを残す


CAPTCHA