Adobe XDでプレゼン資料を作成したら色々と幸せだった話

3/26に開催された「ポートフォリオナイト」でお話させていただいた「載せる作品が少ないと悩んでいる人に読んでほしい、魅せるポートフォリオの考え方」の発表スライドをAdobe XDで作成しました。
今回はAdobe XDでスライドを作成した時に感じたことや簡単なTipsを書きたいと思います。

結論、めちゃくちゃ作りやすかったし、発表しやすかったです。

スライドを俯瞰しながら作成できる

LTやセミナーなどでスライドを用意する際、スライドのレイアウトを一括で確認編集できるので、Illustratorで複数アートボードで書き出しでスライドを作成しているのですが、Adobe XDも複数アートボードで作成できる上に、起動や読み込みがIllustratorに比べ爆速なので、とても軽快に使用することが可能です。

よく使うデータはアセット化

フォントや色、イラストなど共通項目をアセットに登録して共通化することができます。アセット化したデータをダブルクリックすると編集モードになり、編集した内容が全てのアセットに反映されるのでとても便利です

プレゼンもXD上で解決

本番のプレゼン時もAdobe XDの「デスクトッププレビュー」で完結させることができます。
プロトタイピングモードでアートボード毎に遷移を紐付けることで、次のスライドに移動させたり、ボタンやイラストなどにも遷移アクションやエフェクトをつけることができるので、インタラクティブなプレゼンも可能です。
誤って次のページへ移動してしまった場合も、カーソル左右で前のスライドに戻ることも可能です。

プロトタイプモードで遷移を設定

パワポのスライドようにクリックで遷移させる場合、アートボードに対して次へ遷移するというのをドラック＆ドロップで設定することができます。遷移させる動きはディゾルブ(フェード)やスライドの方向などや遷移するインタラクションの速度も設定することが可能です。

スライド共有がめちゃくちゃ楽

スライドの共有をめちゃくちゃ楽に共有することが可能です！
今回、LT終了直後にスライドを共有させていただいたのですが、共有用のURLもAdobe XD内のみで完結することが可能です（＝プロトタイピングを公開で可能）
https://xd.adobe.com/view/c8c489db-49b4-443f-b3d4-a7cbf2255c55

通常のスライドの場合、SliderShareやSpeakerDeckなどにPDFでアップする必要がありますが、AdobeXDは画面右上の共有ボタンでサクっと共有可能です（スマホでもサクサクチェック可能）
また、途中で修正・変更を行った場合も、リンクを更新するだけで即座にアップデートすることが出来ます。

また、共有用のページにはコメント機能を追加することも可能で、スライドで紹介したURLや補足をコメント上で追記したり、聴講者さんから意見を募ったりすることも可能です！
（今回のスライドも参考ページのURLをコメント欄に追記させていただきました）

PDFでも書き出し可能

Adobe XD以外にもファイル→書き出し→すべてのアートボードで形式をPDFに選択することでPDFでも書き出し可能です。PDFで書き出す際は左上から右下にかけて書き出す仕様なので、書き出す際はアートボードの順番に注意してくださいね〜！ｂ

デメリット

互換性の低さ → 一旦はPDF書き出しで解消

Adobe XDはプロトタイピングツールであり、プレゼンテーションツールとしての認知度は当然の如く皆無です。
自PC以外の環境で投影する必要があるケースなどの際は潔く諦めるか、先にお伝えしたPDFに書き出して提出することをおすすめします。

レターボックス見えちゃう問題

今回のスライドは1920x1080pxの16:9の画角で作成したのですが、例えば投影するプロジェクタの解像度が1920px以上のサイズだと余白が生まれてしまいます（そうそう起きない現象ではありますが…）
なので、スライドを作成する時はなるべく今回の私が作成したような大きめなサイズでの作成をおすすめしますｂ

フォント選択が残念感

フォントを選択する場合のプルダウンの表記がまだまだイケてない状態で、日本語書体も全てローマ字で表示されており、ちょっと検索しづらいのが難点。
ですが、アセットで文字スタイルを登録できるので、1回探して登録しておけばなんとかなりそうですｂ

イラレの線データが死ぬ

現状の仕様っぽいのですが、ベクターデータをIllustratorからXDへ持ってきた際に、線のデータが保持されずにめちゃんこ線が細い状態になってしまいます。ここめっちゃ惜しい。。。
この仕様が改善されたら最早敵なし感。
データ自体は、線を塗りに拡張して配置する、という形で解決しました( ˘ω˘)

準備も本番も軽快にできたAdobe XDは神プレゼンツールかもしれない

Adobe XDベタ褒め記事になっちゃいましたは、本当に使いやすかったです。
主催者のよしたけさん（@ryo_pan）に事前にスライドを確認していただく時も、公開機能で確認していただきましたし、発表後も爆速でスライドを共有できたので、個人的にも助かりました。

プレゼンもPDF操作やパワポと動かし方が違うので少し戸惑いましたが、すぐに慣れました！
そもそも、AdobeXDのソフトウェア自体がシンプルなUIで使いやすく、良い意味で最低限の機能のみを取り揃えているので、全体的に軽快サクサク使いやすーい！という気持ちのままスライドを作成することができました！ｂ

今後も機会あればAdobe XDでスライド作成していこうと思います〜ｂ