こんにちは、北島です。
今回はWEBサイトのワイヤーフレームを作る際に使えるツールをご紹介したいと思います。
この記事は普段WEBサイトの設計を担当している、WEBディレクターの方に向けて書いてます。
サイト設計では、主にワイヤーフレームと呼ばれるページ毎のコンテンツ配置図を作成します。
このワイヤーフレームは、主に線と四角、そして画像などで組み立てていきます。
一般的には次のようなツールが利用されているようです。
- マイクロソフト エクセル
- Cacoo
- Adobe イラストレータ
- Adobe XD
これら以外にも様々なツールがあるようですが、私が使ってみたところ使いづらかったのでほとんど記憶してません。
それでは私が使用してきた中でオススメのツールを2つに絞ってお伝えします。
オススメのツール第１弾は「Adobe XD」
Adobe XD、正直これは最強ですね。
直感的に操作できて慣れるまでが早いです。
ワイヤーフレームの作成だけでなく、やろうと思えばWEBサイトのデザイン制作までこれ１つでできると思います。
そして画面遷移などが確認できるプロトタイプ機能も付いてるので、お客様やデザイナーと情報を共有しやすいメリットもあります。
ちなみにこのAdobe XDは頻繁にアップデートしていて、Adobeとしてだいぶ力を入れている気がします。
懸念点としては、このAdobe XDは有料のAdobe CC（Creative Cloud）に含まれているソフトの１つということです。
Adobe CCは2019年8月時点で、月額約6,000円ほどかかります。
ですが、XDはお金を払ってでも利用したい便利なソフトですね。
実際に私も個人でAdobe CCを契約して使ってます。
もし、これからAdobe XDを含めAdobe CC製品を学んでいきたい方は、ヒューマンアカデミーが提供している学習サービス「たのまな」を利用することをオススメします。
オススメする理由は、アドビオンライントレーニング通信講座の1ヶ月受け放題に加えて、Adobe CCを学生・教職員版の料金で購入することができるからです。
AdobeCCを安く使う方法【僕も2021年からこの方法でAdobeCCを使ってます】
オススメのツール第２弾は「マイクロソフト エクセル」
次にオススメなのがマイクロソフトOffice製品のエクセルです。
エクセルは私がWEBディレクターになりたての頃から、かなりの頻度で使用してきました。
サイトマップを作ったり、ワイヤーフレームを作ったり、ディレクトリマップを作ったり、見積書を作ったりと、WEBサイトの設計に必要な資料を一通り作れます。
そしてWindowsのパソコンであれば基本的にインストールすることになるソフトなので、どのパソコンでも閲覧したり編集したりできることが一番のメリットですね。
Adobe CCを使用しない方はエクセルがあれば十分WEBサイトの設計ができると思います。
以上が、ワイヤーフレームを作る際のおすすめのツール２選となります。
これからWEBディレクターとして活動していく方や、現在WEBディレクション業務を担当している方は参考にしてみてください。
コメント