複数のデバイスサイズを考慮して、各種プラットフォームに対応した Folio とカスタム Viewer を作成することができます。例えば、iOS(Apple)プラットフォームには、iPad として 1024x768 および 2048x1536 のモデルと、iPhone として 480x320、960x640 および 1136x640 のモデルがあります。

Android と iOS の Viewer では、Folio を表示するための要件が異なります。Android Viewer では、任意のサイズで作成した Folio を表示できます。記事は必要に応じて縮小およびレターボックス表示されます。一方、iPad では、Viewer 上に表示できるのは、縦横比が 4:3 の Folio だけです。iPhone Viewer では、縦横比が 3:2 または 16:9(1136 x 640)の Folio のみを表示できます。

単一 Folio による方法(推奨)

レンディションを使用する方法もありますが、各プラットフォーム向けに単一 Folio を作成し、コンテンツの拡大縮小を許可することができます。

iOS

iPad には、SD と HD の両方の iPad で機能する 1024x768 の単一 Folio を作成できます。同様に、SD と HD の両方の iPhone で機能する 480x320 の単一 Folio を作成できます(マルチレンディションの記事の作成を参照)。 iPhone 5 および 6 デバイス デバイスに適した 1136 x 640 のレンディションも併せて作成することをお勧めします。

Android

Android Viewer には、iPad 向けの 1024x768 の Folio も作成できますが、Android デバイスのサイズにより適した 1280x800 の Folio を作成できます。作成された Folio は、Android デバイス上で拡大縮小できます。最良の結果を得るために、複数の Android デバイスで Folio をテストしてください。ネイティブ Android Viewer 向けには、電話用とタブレット用に 1 つずつ Folio を作成しておき、アプリケーションを構築する際に、小さい方の Folio が電話だけに表示され、大きい方がタブレットだけに表示されるようにするという方法もあります。Sネイティブ Android Viewer 用のレンディションを設定するを参照してください。

Windows ストア

Windows ストアの Viewer には、余分な手間がかからないように 1024x768 の単一 Folio を使用することをお勧めします。コンテンツは、必要に応じて拡大またはレターボックス表示されます。Windows デバイス専用に Folio をデザインするには、1366x768 を使用します。

レンディション

異なるデバイス向けにデザインした同じ Folio の別バージョンを、それぞれレンディションと呼びます。複数の Folio レンディションを作成する場合は、Viewer ではデバイスのサイズに最も近いレンディションのみが使用可能になります。

Android デバイスでは、デバイスの縦横比と一致しないレンディションが Viewer 上に表示される場合、コンテンツは縦横比を維持して拡大および縮小され、必要に応じてレターボックス(上下の黒い余白)またはサイドパネル(左右の黒い余白)が付加されます。

レンディションは、以下の場合に便利です。

  • iPhone 5 でレターボックス表示されない iPhone コンテンツを作成する場合。例えば、iPhone 3 および iPhone 4 デバイスに適した 480x320 のレンディションと、iPhone 5 以降のデバイスの画面領域を満たす 1136x640 のレンディションを作成できます。
  • Web Viewer 専用の Folio を作成する場合。Web Viewer のカスタマイズを参照してください。
  • 電話かタブレットのどちらかを対象とする Android デバイス用の Folio を個別に作成する場合。
  • iPad 用の SD および HD の Folio(1024x768 および 2048x1536)を個別に作成する場合。このオプションは、PDF ではなく PNG または JPG 形式の記事を使用する場合に、とりわけ便利です。

Folio のレンディションを作成するを参照してください。

同じ Folio の異なるレンディション
同じ Folio の異なるレンディション

A. 1024 x 768 の Folio B. 1024 x 600 の Folio C. 1024 x 768 の Folio(1024 x 600 デバイス上でのレターボックス表示) 

複数レンディション対応のデザインに関するガイドライン

1 つのドキュメントを複数のデバイス向けに再利用する場合は、次のガイドラインに留意してください。

  • iPad Viewer 上に表示できるのは、縦横比が 4:3(例:1024x768)の Folio だけです。iPhone Viewer では、480x320 や 960x640 など縦横比 3:2 の Folio のみ表示されます。iPhone 5 では 1136x640 の Folio のみ表示されます。iPhone 6 および 6 Plus モデルには、1136 x 640 のレンディションを使用します。現時点では、1366 x 750 および 1920 x 1080 のレンディションはサポートされていません。
  • Android デバイスでは、デバイスのサイズに合わせてコンテンツが 300%まで拡大縮小されます。レターボックスが表示される場合があります。
  • 記事を Folio に追加する際、ドキュメントのページサイズ設定と Folio のサイズ設定の縦横比は同じにする必要があります(スムーズスクロールオプションを選択した場合を除く)。例えば、1024x768 の InDesign ドキュメントは縦横比が 4:3 であるので、やはり縦横比が 4:3 である 2048x1536 の Folio に追加できます。しかし、1280x768 のドキュメントを 1024x800 の Folio に追加することはできません。
  • Android デバイス用にデザインする際は、システムナビゲーションバーによって表示領域が減ることを考慮してください。例えば、1280x800 のデバイスに 48 ピクセルのナビゲーションバーが含まれる場合、表示領域は横置きでは 1280x752、縦置きでは 800x1232 になります。これらの様々なサイズを考慮した Folio レンディションを作成しようとするのではなく、ある程度の拡大縮小やレターボックス表示の発生を許容することをお勧めします。
  • 非表示レイヤーに配置されているオブジェクトは、書き出し後の Folio に表示されません。異なるモバイルデバイス向けに別々のレイヤーを用意しておくと、必要な場合にレイヤーを可視にすることでそのレイヤー上のオブジェクトを使用できます。その場合は、ドキュメントから記事を作成する前に、レイヤーの表示と非表示を適切に切り替え、必要に応じてページサイズを変更します。
  • Web Viewer でコンテンツを表示するためにソーシャルシェアを有効にしている場合、Web Viewer ブラウザーだけで表示される特別なレンディションを作成できます。Web Viewer 専用のレンディションの作成を参照してください。
  • 必要に応じて異なるプラットフォームに異なるコンテンツを使用できるように、iOS、Android、Windows プラットフォームには異なるアプリケーション ID を使用することをお勧めします。次のセクションで説明するように、iOS でサポートされている機能すべてが他のプラットフォームでサポートされているわけではありません。

他のプラットフォームでサポートされていない機能

iPad で動作する一部の機能は、Android および Windows の Viewer ではサポートされていません。例えば、パノラマは Android または Windows プラットフォームではサポートされません。HTML コンテンツの場合は、プラットフォームのブラウザーと DPS Folio でコンテンツが正しく動作することを確認してください。DPS でサポートされる機能のリストを参照してください。

アプリの作成についての記事

Android デバイス用 DPS アプリケーションの作成について詳しくは、Android デバイス用ネイティブ DPS アプリケーションを作成するを参照してください。

Windows ストア用 DPS アプリケーションの作成について詳しくは、Windows ストア用 DPS アプリケーションを作成するを参照してください。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー