スマートフォンおよびタブレットのガイド設計

この機能によるガイドセグメント化への影響はありません。

概要

Pendoは、ポートレートモードおよびランドスケープモードのどちらの場合でも、スマートフォンやタブレットで見やすいガイドを作成できます。

アプリがタブレットで実行

タブレットのガイドを作成する場合は、タブレットのフレームを使用してデザインできます。
上部トレイにある[表示オプション(Display Options)] ドロワー を開いて、タブレットフレーム(ポートレート/ランドスケープ)でガイドを表示できるデバイスフレームを選択します。

デフォルトの左右マージンはスマートフォン向けに最適化されていますので、タブレット向けに変更してください。

 

ezgif.com-video-to-gif__5_.gif

デバイスのタイプ(スマートフォン/タブレット)と向き(ポートレート/ランドスケープ)を選択します。

Pendoデザイナーで使用されているフレームは、最も一般的なiPhoneのサイズ(iPhone 8)と最も一般的なiPhoneタブレット(iPad 12)に最適化しています ― これらのフレームは、特定の比率(スマートフォンは16:9、タブレットは4:3)の汎用性が高いフレームであり、実際のデバイスではガイドの表示が異なる場合があります。

ガイドはデザイナープレビューにHTMLで表示されるのに対し、実際のモバイルデバイスではiOSやAndroidのネイティブコンポーネントで表示されます。そのため、デザイナープレビューではガイドのだいたいのサイズや比率が把握できますが、実際のデバイスでのガイドの見え方を正確に表すことはできません。実際のデバイスでガイドを確認することを強くお勧めします。

 

ツールチップについて

ツールチップには独自のプロパティがあります。ツールチップの幅はコンテンツによって決まります(幅のコントロールには改行を使用)。ツールチップのサイズは、デバイスに関係なく常に同じサイズのままで、タブレットでは特別な調整は不要です。

ezgif.com-video-to-gif__6_.gif 

ガイド幅を制限

編集コンテナの[ガイド幅の制限(Limit Guide Width)]オプションを使用して、スマートフォンとタブレット用の「ポップアップ」ガイドを最適化します。この設定は、[フルスクリーンガイド(Full Screen Guide)]の設定がオフになっている場合に使用できます。

幅を制限することで、ガイドの幅(スクリーン幅マイナス余白)が広くなりすぎず、画面の幅がより広いデバイスでガイドを表示するときでも「ポップアップ」の外観を保てます。

アプリをポートレートおよびランドスケープの両方で使用する場合も同じです。この場合、ポップアップガイドで最大幅を設定すれば、ランドスケープモードで表示したときのポップアップの外観を保てます。

重要:SDK 2.5.2以降が必要です。これより低いSDKバージョンで開発されたアプリでは、このガイドは表示されません。

Screen_Shot_2020-09-09_at_15.20.00.png
ガイドの幅を制限して、さまざまなデバイスで「ポップアップ」の外観を保ちます。

Screen_Shot_2020-05-21_at_10.09.00.png

[ガイド幅の制限]は、[フルスクリーンガイド]の設定がオフの場合のみ有効です。