これからAdobe XDを触る人の「はじめの一歩」
公開日： 最終更新日：2018-12-27
※この記事は「Adobe XD Advent Calendar 2018」20日目のエントリーです。
risayさんお題の「Adobe XD Adventar」に昨年に続いてエントリーしましたが…大遅刻スミマセン！！
昨年は「リリース当初から使っているXDへの愛」を語るつもりでエントリーしたのに、「Adobe XDでテキストに下線をつけられるように、でも途切れる。」という愚痴っぽい記事をUPしてしまいました…。今年は大丈夫なハズ！！
リモートワーカーの救世主「プロトタイプ共有」
昨年までは「ワイヤーフレーム作成」「デザインカンプ作成」が主な使用用途でしたが、今年の4月から東京の会社に所属になり「プロトタイプ」や「デザインスペック」を共有できることのありがたみを実感しています。
なので今年は「プロトタイプ」周りのことを書こうかなと思ったのですが、私の書きたいことは全部下記の2記事に上がっていました！
…てか、Adobe XD Adventarの記事がどれもハイクオリティすぎて震えています。
私は「まだXDを使ったことがない人の、最初の一歩」記事を書いてみます！
とは言っても、Adobeさんが今めちゃくちゃXDに力を入れてくれてるお陰で、ほとんど公式の「ラーニングとサポート」だけで習得できるんですよね…ありがたい！！
これからAdobe XDを使ってみようかな…という方へ
Adobe Creative Cloudを利用中の方であれば、迷わずAdobe XDを入れてください！CCライセンス持ってないよーという方は、下記ページの「XDを無料で入手」ボタンから「XD 無料版」をダウンロードできます。
▼Adobe XD ダウンロードページ
https://www.adobe.com/jp/products/xd.html
ちなみにこのページでもらえる「スターターキット」がめちゃくちゃ分かりやすいです！このファイルを開いて実際にツールで1〜2時間触ってみれば、主要機能が習得できてしまいます！
…ってこれ、risayさん制作だったんですね！！すごすぎる！！
XDを立ち上げたら、「チュートリアルを開始」しよう。
アプリケーションを立ち上げたら最初に立ち上がる画面の右側に「基本を学ぶ。」という項目があります。
「チュートリアルを開始」ボタンを押すと、「10ステップでXDを学べるチュートリアルファイル」が開かれます。
このファイルに連動した動画があるので、動画を見ながら実際にファイルを触って体験することができます！（動画の音声は英語だけど日本語字幕付きです。やったね！）
▼Adobe XD チュートリアル動画ページ
www.adobe.com/go/xd_tutorial_video
もちろん無料、そして10ステップ全部見ても25分弱！！お金的にも時間的にも習得コスパ最強ですよね！
まだまだあるよ、公式さまの大供給！
Adobe公式サイトでは、XDを学ぶためのチュートリアルページなどがめちゃくちゃ充実しています！
（PhotoshopやIllustratorユーザーならツールの操作などはよく似ているので、「リピートグリッド」などXD独自の機能紹介をつまみ食いして視聴するだけですぐに習得できます！）
- XD ファーストステップガイド（インストール方法など、初歩の初歩。）
- Adobe XDチュートリアル（私が使い始めた頃はこの辺の動画をいくつか見て、あとは直感で触り始めました。当初はまだ機能も少なかったし、今ほどチュートリアルも充実してなかったので…。）
- Adobe XD ユーザーガイド（マニュアル。新機能のキャッチアップもここでできます。）
…いや、ちょっとAdobeさん、至れり尽くせり過ぎません？！
慣れるまで分かりづらかった「ファイルの書き出し」
私がXDを使い始めて最初に戸惑ったのは、ファイルを書き出す際の「書き出し先」や「設定サイズ」をどうすれば「望み通りのサイズで書き出してもらえるか」が分かりにくいことでした。
なので「ファイル書き出し関連でAdventar記事を書こっかな〜」とも思ったけど、こちらも公式様が分かりやすい記事をUPしてくれていました。
▼Adobe XD から制作用素材を PNG、SVG、JPG および PDF ファイルとして書き出す方法
https://helpx.adobe.com/jp/xd/help/export-design-assets.html
- デザイン（1x）… 制作したサイズそのままで書き出す時
- Web（1x）… そのままのサイズ（1x）と、2倍サイズ（2x）の2つを書き出す時
- iOS（1x）… 等倍（1x）、2倍サイズ（2x）、3倍サイズ（3x）が1度に書き出せる。
- Android（100% – mdpi）… 0.75倍（ldpi）、等倍（mdpi）、1.5倍（hdpi）、2倍（xhdpi）、3倍（xxhdpi）、4倍（xxxhdpi）の6種類が書き出される。
Androidがなかなかのカオスですが、「アプリアイコンの書き出し」などで意外と使えます。
進化を続けるAdobe XD、これからも愛用します！
最初は超シンプルだったXDも、ユーザーの要望（UserVoice）を取り入れながらアップデートを重ねて高機能になっています。さらなる進化に期待しつつ、これからも愛用させてもらいます！
…とか言っておきながら「だんだん新機能のキャッチアップができなくなってきたぞ…」と焦っていたところ、Adventar初日のえびさんの記事「2018年のAdobe XDの新機能を最速で振り返る（えびさんのnote）」がとってもありがたかったです！
お勉強になることいっぱいの「Adobe XD Advent Calendar 2018」、読んで回るのも楽しいです！今年も素敵なAdventarをありがとうございました！！
Web制作 > 本・ツール・アプリ紹介 タグ: Adventar, Webデザイン, XD