Web アプリケーションを辞退しようとしています。現在、アプリケーションは複数のダイアログ ボックスを使用しており、ユーザーを苛立たせているようです。ポップアップ ボックスをなくして、同じパネルを使用する方法はあるのでしょうか。インターフェイスをより適切に設計する方法についての洞察やアイデアを得ることができる UX/UI の例はありますか?
1 に答える
ソリューションは、アプリの内容によって大きく異なります。UI 設計の原則について読むことに時間を費やすと、これらの問題に取り組むための強力なスキルとツールのセットが得られます。すでにその道をたどり、ソリューションに取り組む準備ができている場合は、 Twitter Bootstrap、Zurb Foundation、JQuery UIなどのフレームワークに組み込まれている設計パターンと規則のいくつかを見てみましょう。
これらのフレームワークに付属するすべての機能が必要なわけではありませんが、十分にテストされた優れた UI パターンのコレクションが含まれており、そこからインスピレーションを得ることができます。
一般的に言えば、ポップアップやモーダル ダイアログはユーザーの流れを妨げます。(そして、小さな画面に実装するのは難しい場合があります。) ユーザーの注意を本当に引く必要がある場合、中断は良いことです。それがあなたの目標でない場合は、他にどのように問題にアプローチできるかを考えてください。
ポップアップがユーザーに警告するためのものである場合は、ページまたは UI にインラインで表示されるものを試してください。
ポップアップがユーザー入力を収集するためのものである場合は、非モデル ポップオーバー (ブートストラップのポップオーバーなど) を試してください。いっそのこと、最初からユーザー入力を収集する必要をなくす方法を見つけてみてください。常に可能であるとは限りませんが、理想的です。
ボーナスラウンド:
Little Big Detailsとpttrnsで、優れた UI とデザイン パターンのインスピレーションを見つけました。これらのサイトではコードについての議論はありませんが、最初に対話パターンに焦点を当て、後で実装する具体的な方法について考えると役に立ちます。また、モバイル/小さな画面のアプリケーションに使用される多くのデザイン パターンが、大きな画面での UI の設計に役立つことにも気付くでしょう。画面が小さいと、UI のどの部分が本当に重要で、どの部分が詳細をサポートするだけなのかを考える必要があります。
また、Smashing Magazine のこの記事は数年前のものですが、いくつかの貴重な記事を見つけたことを覚えています:ユーザー インターフェース デザイン パターンに関する 40 以上の役立つリソース
それが役立つことを願っています!