ダッシュボードを読みやすくする方法は？
情報を読みやすくするために、モバイルとデスクトップでこのページを作り直す方法のアイデアを探しています。
現在、カードの列内でbootstrapカードを使用しています。
この特定の問題に気づくかもしれませんが、提供された画面内にすべての望ましい値を表示するための十分なスペースがありません。そのため、それらを優先するように、視覚的に一貫したインターフェースを表示することも検討する必要があります。シンプルな外観を超えてこれを実現するには、そのフレーム内のアクションを指摘する以外に、グラデーションカラーを使用しないことをお勧めします。単一の問題だけではなく、このインターフェースで何ができるかを簡単に説明できるようにします。
- シンプルな外観よりもグラデーションや色を取り除きます。
- すべてのハンバーガーメニューアイコンを右に揃え、
- どこでも同じテキストブロックを使用して、堅牢性を実現できます。
- 「検索、フィルタリング、並べ替え」機能を、画面の下に並べるような魅力的なものにします。
以下は、ケースに適用できるモバイルインターフェイスの基本的なビューです。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
すべてのアプリでデータの一貫性を提供した後、これらの「1次ではない」情報を（オンクリック、必要なものにカーソルを合わせる）機能として追加することを選択できます。
そしてデスクトップソリューションとして、ブートストラップのカードコンポーネントを使用することを選択したので、非表示にすることをお勧めしたサマリーセクション内の残りのデータを使用する必要があります携帯で。
グラデーション..ええ、代わりに無地を保ちます。機器画面の場合、これらのブロックは内側にパディングが必要で、3つのバーの後にテキストを強制的に次の行に流し込みます。「猫」が最後に来て次の行に続くのは少し面倒です。おそらく、デスクトップのフォントサイズが大きくなる可能性がありますか？
私はまた、配置、間隔、パディングの点で電話の各要素にいくつかのルールを作成するのが良いだろうと思います、少し問題があるように見えますが、いくつかの反復があり、あなたは行ってもいいはずです！