最終更新日 :
2021年4月28日
- Adobe XD ユーザーガイド
- はじめに
- デザイン
- アートボード、ガイド、レイヤー
- シェイプ、オブジェクト、パス
- テキストとフォント
- コンポーネントとステート
- マスキングと効果
- レイアウト
- ビデオと Lottie アニメーション
- プロトタイプ
- 共有、書き出し、およびレビュー
- デザインシステム
- クラウドドキュメント
- 統合とプラグイン
- XD iOS 版および Android 版
- トラブルシューティング
- 既知の問題と修正された問題
- インストールと更新
- 起動時のクラッシュ
- クラウドドキュメントおよび Creative Cloud ライブラリ
- プロトタイプ作成、公開、レビュー
- 読み込み、書き出し、その他のアプリの操作
プロトタイプリンクでアートボードのレンディションを修正する方法をご紹介します。
問題点
XD プロトタイプは、ブラウザーで表示する際にサイズが縮小します。
根本的な原因
アートボードの横幅全体と縦幅全体がブラウザーウィンドウに収まるようにプロトタイプがブラウザー内で縮小表示されている場合は、スクロール設定がアートボードに適用されています。
XD のアートボードでは、プロパティインスペクターにスクロールという設定があり、「なし」または「垂直方向」に設定できます。
- スクロールを「なし」に設定すると、スクロールバーを使用しなくともアートボード全体がブラウザーウィンドウに収まります。
- スクロールが「垂直方向」に設定されている場合、プロパティインスペクターでアートボードに設定されたビューポートの縦幅の値によってブラウザーでのコンテンツの表示が決まります。
- ビューポートの縦幅がアートボードの縦幅と同じでない場合、ビューポートの縦幅はブラウザーウィンドウに収まり、横幅は縦横比を維持するように調整されます。
- ビューポートの縦幅がアートボードの縦幅と同じ場合、その横幅はブラウザーウィンドウに収まり（必要に応じて）、縦幅は調整されます。
XD においてカスタムアートボードを作成する際に、スクロールプロパティは自動的に「なし」に設定されます。そのため、大きなアートボードが小さく表示されます。
解決策
スクロール設定を使用して、公開するプロトタイプの外観を制御します（関係者がその表示を見ることを想定しながら）。
Web サイト、チラシなど、サイズの大きいページを表示するデザインの場合は、スクロールを「垂直方向」に設定して適切なビューポート値を指定します。
