XDで画像を書き出す際の基本事項と、書き出し解像度について調べました。

・画像書き出しの基本事項
・書き出し画像の品質調査

概要

XD（に限りませんが）の解像度の仕様を理解するためには、インプットとアウトプットそれぞれに解像度があることに注意して、操作画面やダイアログ画面で設定しようとしている項目がどちらについての設定なのかを意識すると理解がしやすくなります。XDにおいて、インプットの解像度（サイズ）はアートボードの解像度（サイズ）で、アウトプットの解像度（サイズ）は書き出しファイルの解像度（サイズ）です。編集（or 設定）可能なのは前者ついてのみであり、後者の解像度は自動的に決定されます（画像書き出しの基本事項）。
また、解像度（サイズ）を決定する際には、（自動的に決定されてしまうため尚更）ビットマップ形式かベクター形式かも注意が必要です。その点が気になったので実際に実験して試してみました（実際の書き出し画像の品質調査）。

画像書き出しの基本事項

まず書き出す画像

考慮すべきふたつのサイズ

既に説明したようにインプット、アウトプットふたつのサイズを考慮する必要があります。
・作成するアートボードのサイズ
・アートボード（or アセット）書き出しのサイズ
（前者がインプットで後者がアウトプットですが、XDではインプット／アウトプットという用語を用いないので、本記事でも以降は用いないことにします）

XDで設定可能なのは主に前者であり、後者はその設定にしがたって自動的に出力されます。

作成するアートボードのサイズ

アートボードのサイズ決定（設定）

XDでアートボードのサイズを意識するのは以下ふたつの場面です。
・アートボードの作成時
・アートボード（or アセット）の書き出し時

アートボードの作成時

XD起動時のデフォルト設定でiOSを選択すると等倍サイズ（1x）となっています。
・iPhone 6/7/8（375 x 667）＝　等倍（1x）

単純に2xで作成する場合は手動で750 x 1334にします。個々のiOSデバイスのサイズについては以下が参考になります。
The Ultimate Guide To iPhone Resolutions

が、本記事ではデフォルトの1xを前提で話をすすめます。

アートボード（or アセット）の書き出し時

以下は書き出しの際に表示されるダイアログの画面で、フォーマット：PNG／書き出し先：iOSにしています。

一番下の“設定サイズ”は作成したアートボードのサイズで出力サイズではありません。ここで戸惑う人は多いようです（私も戸惑いました）。
書き出しの設定サイズ（公式フォーラム）
今回はアートボードを1xで作成しているので1xを選びます。

アートボード（or アセット）き出しのサイズ

PNG画像を書き出すとアートボードのサイズ（今回は等倍：1x）をもとに、3種類のサイズのファイルが書き出されます。
・アートボード名（or アセット名）.png
・アートボード名（or アセット名）@2x.png
・アートボード名（or アセット名）@3x.png
アートボードを2xで作成した際の各ファイルの解像度については以下のリンク（公式）を参照してください。
デザイン素材の書き出し。

書き出し画像の品質調査

で、実はここからが本題

等倍で作成して2x、3xで書き出した場合の画像の品質はどうなるのか。

結論としては、予想どおりですが、
ビットマップは画像が荒くなり、ベクターついては画像の劣化はなかった
です。
ここで言うベクター画像というのはIllustratorで作成したパスとXDで作成したオブジェクト。

書き出しファイル1

要するに、375 x 667のビットマップを3倍で書き出した画像です。
画像をクリックして拡大すると、テキストと下半分の画質は@3xで書き出しても劣化はありませんが、上半分の画像は劣化しているのがわかります。

書き出しファイル2

書き出しファイル1からの変更点は、ビットマップ自体を解像度を3倍に（375 x 667 => 1125 x 2001）したことです。上半分も画像は劣化はありません。

さいごに

XDでアートボードを等倍（1x）で作成する際、レイアウトするビットマップ画像については最終アウトプットで必要となる解像度（サイズ）で用意するということになります。
当然の結果ですが、、

記載になにか間違いがあればご指摘お願いします。