このGUIインターフェースを改善するにはどうすればよいですか？
アプリケーション用のMac GUIを作成しています。MacLinux USBローダーですが、アプリケーションのドキュメントウィンドウを適切なUXの原則に準拠するように設計する方法がわかりません。これがウィンドウのスクリーンショットです。
ウィンドウは非常に雑然としており、アプリケーションの他のウィンドウと比較してひどいように見えます。基本的に、アプリケーションの目的は、Linuxディストリビューションの起動可能なUSBドライブをセットアップすることです。
2つのマニュアル必須フィールドはInstallation DriveおよびEnterprise Source。これらは2つのドロップダウンメニューです。前者にはインストールできるUSBドライブのリスト（基本的には、プラグインされているドライブのリスト）が含まれていますが、エンタープライズソースのドロップダウンには、ユーザーが手動で定義して追加したソースのリストが含まれています。
パネルの残りの部分（ディストリビューション名とバージョン）は補助的でオプションです。ディストリビューションのファイル名に基づいて、これらのパネルには自動的に正しい値が入力されます。自動設定ボタンのチェックを外すと、ユーザーがこれらの値を手動で変更できるテキストフィールドが有効になります。
マルチペインレイアウトなどに分割することを考えていました。基本的なインストールドライブとエンタープライズソースはデフォルトの[一般]ペインにあり、他のオプションはセカンダリペインにあります。
ウィンドウを改善するにはどうすればよいですか？
- アイテムが多い場合は、ドロップダウンが適しています（あなたのケースではないようです）。オプションが少ししかない場合（または視覚的に同様の種類のコントロール）は、ラジオボタンが適しています。
- 単一のアイテムしか使用できない場合は、コントロールを表示する必要はまったくありません（たとえば、USBドライブが1つだけ接続されている場合のように、ほとんどの場合私は信じています）。
- ユーザーを混乱させる可能性があるため、推奨されるバリアントがない場合（後者の2つのフィールドなど）は避けてください。
- [詳細オプション]セクションの下にオプションを配置します。
これらすべての推奨事項をアカウントに取り込むと、次のようなことを提案できます。
currentUIに関するいくつかの小さな問題：
- 宛先はソースのbeforeです。
- 最初のドロップダウンには「---」があらかじめ入力されていますが、他のドロップダウンはありません。
- [エンタープライズを自動的にセットアップする]チェックボックスがオフになっていない。あなたはそれをすぐ下で説明しますが、ユーザーとして、私はwhole設定が自動的に行われることを期待します。チェックボックスではなく、ボタンにそのようなフレーズを使用します。
- 2つの[分布]フィールドがドロップダウンと整列していません（ただし、小さな問題です）。
- これら2つのフィールドは、エンタープライズソースを選択する前に表示されます。ユーザーがこれらのフィールドに入力し、その後エンタープライズソースを選択するとどうなりますか？
では、ユーザーフローを改善できる簡単なUIを次に示します。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
leftでは、initial状態：
- ソースから開始し、placeholderテキストを使用して、ドロップダウンからオプションを選択するようユーザーに求めます。
- 可能であれば、すでに差し込まれているUSBキーをdetectしてみてください。私が使用したプログラムの中には、それを実行するものもあり、とても便利です（通常、1つのUSBドライブのみが差し込まれ、その目的のために正確に差し込まれます。検出できない、または検出したくない場合は、プレースホルダーも使用してください。
- ユーザーがまだエンタープライズソースを選択していないため、ディストリビューション名とバージョンはdisabledです。
- 2つのドロップダウンがまだ入力されていないため、[インストール]ボタンは無効になっています。
rightでは、next状態：
- 2つのドロップダウンにはオプションが選択されています。これらが2つの必須フィールドであることを考えると、フォームの残りの部分は完全にenabledです。
- 分布フィールドは自動的に入力されます。ここで、これは私の選択です。ほとんどのユーザーは、これらのフィールドが自動的に入力される（「マジック！」）ことができるという事実を本当に気に入っていると思います。また、これらのフィールドは引き続き編集可能なので、問題にはなりません。ワークフローをユーザーにとってより迅速かつ簡単にするだけでなく、必要なユーザーには十分な制御を提供します。
- すべてが設定されているため、[インストール]ボタンを使用できます。
また、すべてを垂直に揃えるようにしてください。 fromどのソース、toどのドライブ、what名前とバージョン、そして完了。
ドロップダウンやチェックボックスなど、数十年前の要素を取り除きます。タブレット用のアプリを設計しているようなインターフェイスを想像してください。これがiPad用のアプリである場合、どのようなインターフェイスを確認しますか？同じインターフェイスはラップトップでも見栄えがします。 （あなたのアプリがphotoshopのようで、たくさんのボタンを表示せずに実行できない場合を除きます）。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
次の画面で他の詳細オプションを要求します。将来的に役立つ2つのルールを次に示します。
- 画面上で一度に最大7つのアイテム。
- 最大で3つの「次の」ステップ。