弊社ではブログやメディアでwordpressやMTを使用した場合、基本、お客様に管理画面の使い方のマニュアルを作成してお渡しするようにしています。
普段はイラストレーターかパワポで作ったものをPDFにして渡しているのですが、Adobe XDがマニュアル作りにめちゃくちゃ向いているのではないかと思って作ってみましたので、今回はそのレポートになります。
そもそもAdobe XDはマニュアルだけでなく、ブログの原稿ベースに利用したり、企画書、提案書などにもとても向いていると思うアプリなので、設計やデザイン以外にも積極的に使用しています。もはやメモ帳代わりにアイデアノートとしても使っています。（笑）なにせ、スピードが速いアプリですからね。

Adobe XDでマニュアル作る利点 1：圧倒的作業スピード

wordpressのマニュアル作成では別途予算を取れる場合はいいのですが、零細や個人のクライアント様にはなかなかその予算が取れません。とはいえ、wordpressで実装してID、パスを渡しただけで、お客様がその後なかなかブログを使えない。更新できないってのは不本意ですので、ちょっとでもマニュアルっぽいのをお渡ししたいと思っています。その上で最も重要なのがスピードです。

Adobe XDはアプリの中でも本当に最速で動くアプリです。Adobe XDはwordpressの管理画面をキャプチャーし、その画像をドラッグでレイアウト上に配置し、その上にサクサクと赤入れができます。もちろん他のアプリでもできますが、この作業がめっぽう速いアプリなのです。あまり作業時間を取られたくないけどしっかり伝えたいものを作る時には適しています。後、そのサクサクで全体像が見渡せるアートボードもつかやすいです。とにかく要点だけまとめたページをあちこちに散らばった状態にしておいて、ドラッグしながら整理もできます。

Adobe XDでマニュアル作る利点 ２：ページ間をリンクで繋げられる

最初の１ページ目をマニュアルの目次にして、タイトルを並べ、気になるタイトルをクリックしたら、該当のページに飛ばすという直感型のマニュアルができます。該当ページの最後に「目次に戻る」リンクもつけると使いやすくなります。PDFですとページネーションをめくっていく感覚ですが、XDはウェブサイトマニュルみたいな感覚で触れます。

Adobe XDでマニュアル作る利点 ３：リンクの共有＆更新ができる

PDFのマニュアルですと一度渡してしまうとその後に追加したい項目があると、再度お客様に新しいPDFファイルを送らなければいけません。調整レベルの場合はどうもそのために新ファイルを渡すのが気が引けます。Adobe XDですとマニュアルファイルの公開リンクURLとパスワードを渡すだけなので、リンクをクライアントに教えた後に、修正したい箇所があった場合、共有のリンクを更新するだけで常に新しいバージョンのマニュアル状態にしておく事ができます。特にクライアントに報告しなくてもいいです。

Adobe XDでマニュアル作る利点 ４：すぐにPDFファイルにすることもできます。

もし、クライアントがどうしてもXDではなく、PDFファイルで欲しい。と言ってきた場合も問題ありません。Adobe XDはPDFで書き出す事ができるので、どちらでも対応可能になります。

Adobe XDの留意点：ファーストビュー外の要素を見逃しやすい。

いろいろ自分なりに見やすいマニュアルが作れるAdobe XDですが、１点気をつけなければいけないところがあります。
それは、ファイルのファーストビュー（ビューポイント）の外にテキストがあっても、気付きにくく、スクロールしてもらえないという問題があります。これが結構リテラシーの高いコーダーやPMでも見逃しやすく、Adobe XDに慣れていない人には必ずありえます。見逃しやすいマニュアルを作ってしまうと元も子もありません。そこで、ファーストビューをまたぐ要素がある場合はビューポイントのギリギリの部分に下のページへのアンカーリンクをつけるようにしています。（2020年のアップデートにより、Adobe XDでページ内リンクを付けられるようになりました。）

Adobe XDの留意点：サイズをどうするか問題

いまだにこれが正解だというサイズが見つからないのですが、それは人によって、どのデバイスでマニュアルを見るのだろうか？という事です。webブラウザの比率で作ってしまったら、PDFで書き出す可能性があったときに比率が違い過ぎますし。でも、パソコンでしかマニュアル見ない人はパソコンの比率がいいし、学生さんが更新するようなサイトであれば、ひょっとしたら、スマホでマニュアル片手に触るかもしれないし、、その人の環境が合わないとたとえフルスクリーンボタン押して見ても読みづらい時があります。結局、正方形に近い形であれば、ある程度どの環境でも見えるかもしれませんが、PDFに書き出すと余白大き過ぎます。結果として今は、iPad縦持ちの比率でなるべく文字を大きめに作るように気をつけています。まあ実際クライアントがその比率で本当に見やすいと思っているかどうかはわかりません（笑）