web-dev-qa-db-ja.com

白い背景の上に白い色のカード

ユーザーがTwitterデータを理解するのに役立つiOS onlyアプリを作成しています。

ユーザーエクスペリエンスとユーザー例外の観点から、ベストプラクティスは何なのかわかりません。私は白いpressableカードを使用しています。カードを押すと、押されたカードに関する詳細情報を含む新しい画面が表示されます。


いくつかの質問:

1)私はこれに正しいアプローチをしていますか?

2)ユーザーはカードがクリック可能であることを理解しますか?

3)カードの枚数/注文のためにスキャンするのは難しいですか?


ボーナス質問:

デザイン/ UIは賢明ですが、受け入れ可能ですか?


ありがとうございます!

enter image description here

2
Roi Mulia

私はアプローチに問題がないと思います。カードレイアウトでクリックできるインタラクティブな要素があっても問題ないと思います。アプリの他の部分と同じスタイルをクリッカブル要素に使用すれば、リンクを提案できます。ホバーとカーソルで青色の要素の色を変更できます。クリック可能なタイトルの後に矢印を追加できます。

最後の質問では、がカードの内容で重要です。

IOAアプリでも、スタイルはマテリアルデザインのようです。

カードの詳細については、こちらをご覧ください 材料設計-コンポーネント-カード

いつ使うか

次のようなコンテンツを表示する場合は、カードレイアウトを使用します。

  • コレクションとして、画像、動画、テキストなどの複数のデータ型で構成されます

  • 直接比較する必要がない(ユーザーが画像やテキストを直接比較していない)

  • コメントなど、非常に可変長のコンテンツをサポートします
  • +1ボタンやコメントなどのインタラクティブなコンテンツが含まれています
  • それ以外の場合はグリッドリストにありますが、画像を補足するためにより多くのコンテンツを表示する必要があります

Material Design-Components-Cards で同様の例を見つけることができますが、均質なコンテンツがある場合、カードは不要であることに注意してください。 enter image description here

微妙な効果が必要な場合、カードの白い背景は明るい背景の影で問題ありません。

enter image description here

1
Madalina Taina