ほとんどのアプリやウェブサイトは、必要な情報を表示するためにカードデザインに適応しています。カードが直感的で読みやすく魅力的なものは何ですか?
カードベースのUIには、次のような利点があります。
参照: カード:UIコンポーネント定義
カードの素晴らしいところは、現実のメタファーです。現実のあらゆる種類のカードは、ほとんどの場合、さまざまなタイプ(画像、テキストなど)の情報をコンパクトにグループ化した小さな情報アイテムであるため、短い一目で直接情報を取得できます。ここでは、グループ化の側面がかなり重要です。カードのデザインにより、カードの情報をグループとして認識できない場合があります。したがって、カードは、さまざまなタイプ(画像、テキストなど)の短い情報のいくつかのチャンクを提示するのに非常に優れた方法であり、より詳細な情報(タイムライン、ニュースフィードなど)につながる可能性があります。
カードには、特にモバイルで複数の利点があります。
物理性
画面上のテキストはテキストですが、カードはオブジェクトです。ユーザーは、少なくともオブジェクトがタップされたりスワイプされたりできることを期待するように、デザインパターンによってトレーニングされています。カードにアクションが表示されている場合、それらのアクションの範囲が明確に示されています。
均質化
カードは単なるオブジェクトではなく同一のオブジェクトであるため、コンテンツが異なる場合でも、ユーザーは何らかの形で関連していると期待できます。ユーザーはまた、同じオブジェクトが繰り返される方向にスクロールするようにトレーニングされているため、カードの束を水平方向に並べて画面外に移動するとすぐに、水平スクロールのアフォーダンス(Facebook関連の投稿やモバイルの推奨友達など)が作成されます。カードオブジェクトの離散性は、ユーザーが見ることができるのはカードのエッジだけであっても、そのようにしてより多くのコンテンツがあることをユーザーに示します。
ただし、質問はreadabilityについて尋ねます。 @akhilashokが書いたように、カードはスキャン可能性と情報階層に関して、いくつかの重要なポイントに達しました。しかし、これはカードに由来するものではありません。カードは、デザイナーとユーザーがコンテンツを簡単にフォーマットできるメンタルモデルです。
コンテンツが「タイトル、短いテキスト、多分写真」のように見えない場合、カードは役に立ちません。マテリアルデザイン ガイドライン カードとは何か、カードを使用しない場合について説明します。カードが不適切な場合、余分なchromeとパディングがユーザーの注意をそらし、画面上の有効なスペースを減らします。