web-dev-qa-db-ja.com

iOS上のアコーディオン、およびAndroid

昔は、Webアプリのアコーディオンはかなり一般的でした。 Silverlightアプリを作成しましたが、これには非常にアコーディオン中心のワークフローがあります。コンテンツは主にアコーディオンパネルに分割されます。これは、a)画面に情報が多すぎて1つのパネルに配置できないため、b)ほとんどのコンテンツがほとんどのユーザーにとって重要ではないためです。ソフトウェアを使用するさまざまなチームは、さまざまなパネルに重点を置いています。画面に10個のパネルがある場合、1つのチームはおそらく1つまたは2つのパネルしか使用しないため、画面上にすべてのコントロールを配置することは意味がありません。

アコーディオンには明らかな長所と短所があります。コンテンツの分割に対処するには、3つまたは4つの方法があると思います。

  1. タブ-これらは明確ですが、画面上に一度に複数のタブを持つことはできません。これは単純化には役立ちますが、クリック数が増える可能性があります。
  2. アコーディオン-タブと非常に似ていますが、一度に複数のパネルを画面に同時に表示できる可能性があるという違いがあります(iPadなどのより大きなデバイスを使用している場合)。
  3. ボタン駆動のナビゲーション-ユーザーが自分のチーム用に調整されたスクロール可能なページを起動できるようにするサブメニューがある場合があります。欠点は、おそらく、チームごとにパネルを設計する必要があり、設計の重複につながることです。
  4. すべての人のためのすべてを持っているフラットスクロール可能なページ。ユーザーは通常、興味のないものをたくさん目にするので、これはユーザーにとってあまり良くありません。

ここにアコーディオンについて話し、一般にアコーディオンに対して不利な記事があります: https://www.nngroup.com/articles/accordions-complex-content/

いくつかの設計作業をUI/UXデザイナーに引き渡したところ、彼は電話でのデータ入力にアコーディオンを推奨するようになりました。私はこれにびっくりしました。これは主に、iOS/Androidで機能し、相互に互換性のあるコントロールが本当にサポートされていないためです。だから、私はたくさんの質問があります。 最近、アコーディオンは電話やデスクトップで有効なUIの選択肢と見なされていますか?業界がアコーディオンから離れる主な理由は何ですか?独自のアコーディオンコントロールを作成した場合、デバイスでアコーディオンを使用することに慣れていないユーザーにとって、これは不快すぎるでしょうか?あるいは、実際にコンテンツを分割するのに良い方法であるにもかかわらず、デザインコミュニティがアコーディオンから恣意的に離れた可能性はありますか?十分にサポートされているAndroid/iOSの優れたアコーディオンコントロールはありますか?

PS:これはネイティブアプリであることを覚えておいてください。これはCordovaアプリではありません(HTML/CSSはNative Appフレームにラップされています)。プラットフォームに存在するコントロールに固執する必要があります。

1

私はiOSでアコーディオンを使用するかどうかについても同様の決定に取り組んでいるため、有名なアプリに注意を向け始めました。標準のUITableViews(つまり、ネイティブコントロール)を使用していると確信しているアコーディオンを備えたいくつかのアプリを紹介します。

これが、Amazonアプリのフィルター画面です。

enter image description hereenter image description here

これがTwitterアプリです。

enter image description hereenter image description here

これは、Googleの結果画面で今気付いた例です。これはモバイルアプリの例ではありませんが、アコーディオンが明らかに便利なUXコントロールであることを実感しました。

enter image description here

1
James Toomey