Adobe XDでワイヤーフレームをつくろう!

自粛生活のおかけで週末は「庭いじり」になったatsushiです。bud.gif

WEBデザインをされている方ならページのデザインをする際、ワイヤーフレームを書いてからデザインを進めるという方も多いと思います。

その際、どんなツールを使われているでしょうか?

自分だけわかっていればいいというものであれば、手書きで十分だったりしますが、プロジェクトで制作している場合は、ワイヤーフレームもプロジェクト内で共有したり、叩いたりする必要があります。

こんな時は、Adobe XDを使うといいですよ。wink02.gif

無料で利用できますし、Photoshopなどと比べて動作は軽いのでサクサクできます。

ワイヤーのレイアウト組むなら1ページ30分ぐらいあれば組めてしまうと思います。

さらに、ワイヤーフレームを制作するのに便利なUIキットなどもダウンロードできるので、結構しっかりとしたワイヤーフレームを制作することができます。

ちなみにわたしは、下記のワイヤフレームUIキットを使ってます。

Wires jp2.0
https://www.behance.net/gallery/67284971/Wires-jp

英語のワイヤーフレームUIキットが多いのですが、日本向けにつくられているので、そのまま、すぐに使えると思います。

ワイヤーフレームを作る際は、一度使ってみてはいかがでしょうかneko.gif

トラックバックURL