web-dev-qa-db-ja.com

マルチスクリーンまたはマルチデバイスエコシステムの設計ガイドライン

Preciousが Multiscreen Patterns またはマルチスクリーン戦略のパターンについて2011年に発表した記事以降、オンラインネットワークに接続されているIoTデバイスやその他の物理ハードウェアの量が増加しています。たとえば、6つの異なるパターンを示すために使用される一般的な図には、スマートな時計は含まれていませんが、概念は依然として関連しています。

enter image description here

さまざまな画面やデバイスでシームレスなエクスペリエンスを作成する方法について特別に開発されたガイドラインがあるかどうか、またはこれらがGoogleのマテリアルデザインなどの一般的なデザインガイドラインの応答性と適応性のあるデザイン原則またはパターンの一部として組み込まれているかどうか知りたいです。

responsive-designguidelinesmultiple-devicesadaptive-design
9
Michael Lai

ガイドラインは知りませんが、UXのシームレスな同期が中心となる製品のリストを次に示します。

  1. Whatsapp Web対アプリ（QRコードの効率的な使用）
  2. Facebook スペース 、（VRユーザーとWebカメラユーザーを混在させる例）
  3. Amazon Echo対Alexa.Amazon.com（音声またはWebインターフェイスを介したEchoの制御）
  4. Dropbox.comデスクトップWebアプリと電話アプリ（ドキュメントの複数の競合するバージョンの処理に関するポリシーの例）
  5. Outlookデスクトップvsアプリ（エンタープライズ）
  6. Googleカレンダーデスクトップとアプリ（異なるタイムゾーンのユーザー間で共有カレンダーを処理する方法の未解決の例）
  7. Appleノート（MacとiPhoneノート間の同期の例）
  8. gobattle.io /slither.io（オンラインの大規模マルチプレーヤーカジュアルゲームのUXに悪影響を及ぼさないようにクライアントサーバーの待ち時間を処理する方法の例）
3
Jose Berengueres

Shopifyはここに優れたガイドラインを提供し、電話サイズの画面を備えた携帯電話でのユーザビリティを最優先する必要があることを強調しています。 https://www.shopify.ca/enterprise/80431878-mobile-first-design-what-it-is-why-you-should-care 。 https://developers.google.com/web/fundamentals/design-and-ui/responsive/ で、ページがどの画面サイズでも使用できるように設計する方法に関するピートルページの優れたガイドラインを参照してください。

1
rleir

「公式」のガイドラインは知りませんが、シームレスなエクスペリエンスを作成するために使用する方法のリストを次に示します。

1。ほとんどの画面とデバイスで使用できる基本設計システムを用意します（例 Material Design ）ここでの目標は、お客様に一般的なUIコンポーネントを認識および記憶させ、デバイス間の相互作用。これらのコンポーネントは、デバイスの分単位に基づいてスケーリングする必要があります。 弧の分とデバイスの距離に基づいてサイズを計算する方法 に精通している。

2。特定の画面とデバイス用にその設計システム内のカスタムコントロールを最小化しますが、適切な場合に使用します（たとえば、モバイルの場合は画面外のスライドアウトメニュー、または= [戻る]ボタンを使用してAndroid vs iOSで右にスライド ）ここでの目標は、共通の最低限のUIコンポーネントに限定することではありません。お客様を満足させるために必要に応じて各プラットフォームを活用できるようにする必要があります。他の存在（たとえば、デスクトップのスライドアウトメニューは、画面領域がある場合は意味がありません）

3。プラットフォーム間での一貫したリソースのアクセシビリティここでの目標は、あるプラットフォームから別のプラットフォームに移動するような気分にならないようにして、データにアクセスできないようにすることです。ジョブに適切なツールを決定させますが、ジョブからアセットを削除しないでください。例えば。お客様がデスクトップ上の一部のデータにアクセスできる場合、モバイルでも同じデータを表示できるはずです。別に表示する必要があるかもしれませんが、アクセス可能であってはなりません。自分の携帯電話でスプレッドシートを操作するのは面倒で、時間があればデスクトップに移動できますが、必要なデータの検索を止めないでください。

4。必要に応じて、画面とデバイス間で機能の場所を一致させます目標は、1つのデバイス上の空間認識を他のデバイス間で活用することです。 （たとえば、モバイルのメニューシステムが左からスライドする場合、デスクトップで表示されるときに左揃えにする必要があります。項目は同じ順序で、異なる場合は、最初の数文字または同じアイコンで開始する必要があります。 ）

5。デバイスアクティビティに基づいてコンテンツの配信を最適化しますビデオコンテンツがある場合、テレビで黒の背景で配信しますが、同じコンテンツを同じコンテンツを配信することについて同じ仮定を行うことができない場合があります。デスクトップと動画の横にあるコメント付きの白い背景を含めるのが適切かもしれません。これは、テレビではコメントを入力する可能性が低くなるためですが、デスクトップでは可能性が高くなります。

私はここで多くのことを逃していると確信していますが、これは良いスタートになるはずですか？

1
Jesse Bilsten