illustratorよりも使いやすくて、Webサイトのワイヤーフレームやプロトタイプ作成にめちゃくちゃ役立つXD。
通っていたプログラミングスクールの卒業制作で使ってみてから、その便利さに重宝しまくっています。
卒業制作で使用したXDのデザイン案
本番に近い形でサイトデザインや使い心地を試せる、AdobeXD。
今でも十分お世話になってますが、使い方次第ではまだまだ可能性が広がりそうです。
そんなXDを使う際に参考にした記事を、自分の備忘録用にまとめてみました。
誰かのお役に立てれば幸いです。
他にも参考になる記事等ありましたら、コメント欄で教えていただけると嬉しいです。
目次
基本的な使い方
応用的な使い方
ドロップダウンメニューやモーダルを作る時に役に立つのが、こちらの記事。
こういった動きをXDで再現できると、グッとサイトのイメージがつかみやすくなりますよね。
こちらの記事は自動アニメーションでスライドショーとかを実装しています。
原理を知ると「意外と簡単!」と思いましたが、自分ではなかなかこの発想に辿り着かないですね。
こういう事例をたくさん知ると、自分の中の幅が広がりそうです。
役立つプラグイン
画像ではなくGoogleマップを実際に入れられるプラグインです。
いちいち画像を用意する必要もなく、緯度経度の情報を入れると表示してくれるから便利。
気になるサイトのURLを入力するだけでWebサイトからカラーやフォントの情報を取得できるプラグイン。
mimic(真似る、模倣する)という、そのものズバリな名前も最高です。
アイコンを使うときに素早く挿入できるプラグインIcon drop。
わざわざ別のサイトで探してくる手間が省けるので助かります。