サイトやアプリのプロトタイプを簡単に仕上げられる!Adobe XDを使い始めてみた

最近、ポートフォリオサイト制作(をすることでの技術力・デザイン力強化キャンペーン)を進めています。

今日は、サイトのデザインにAdobe XDを使ってみたお話。



Adobe XDとは

Adobe XDは、Webサイトやモバイルアプリのワイヤフレーム(デザインの設計図)&プロトタイプ(実際に画面遷移を試せる、いわゆる試作品)を簡単に制作・共有できるソフトです。
個人で開発する分には、無料版で十分使えます。

ダウンロードはこちらから。

Adobe XDの作業スペーススクリーンショット
ワイヤフレーム制作中


私は、「Adobe XDでモバイルファーストのWebデザイン入門」という公式のチュートリアルを見ながら作業を進めています。
操作が直感的でわかりやすいので、初学者でもハードル低めかな、と思いました。
上記の記事以外でも、公式サイトにビデオで使い方を学べるページもあるので安心です。


Adobe XDの操作感
プレビューもさくっと見られます


まだ作業に至っていませんが、同じパーツの一括修正や色指定異なる画面サイズへのデザイン展開も簡単にできそうで、わくわくしています。
今後、モバイルアプリのプロトタイプ作成にもぜひ使ってみたいなと思いました!