web-dev-qa-db-ja.com

複雑なフォームロジックをより直感的にするにはどうすればよいですか?

enter image description here


私は、フルネームとSSNの組み合わせを提供することに基づいてユーザーが人を見つけることができる検索機能を構築しています。私が苦労しているビジネス要件の一部はこれです:

  • 名前を指定しない場合は、SSN全体が必要です。
  • 姓を指定すると、完全なSSNまたは最後の4桁のみを入力できます。どちらの方法でもSSNはオプションになります。
  • SSN全体またはSSNの最後の4桁ではない他の組み合わせを指定すると、無効なエントリと見なされます。

このロジックを直感的な方法で表示するにはどうすればよいですか?このロジックを巧妙なレイアウトを使用して視覚的に表示し、ユーザーがこれらのルールに自動的に従うようにしたいと思います。ユーザーが読まない可能性が高いテキストを含めることに依存したくありません。


私の考えはこれです:多分、フォームを2つのオプションとして提示します:名前またはSSN検索。姓を入力すると、SSNの最初の2つのフィールドが灰色になります。 SSNを入力すると、[名前]フィールドがグレー表示されます。

デフォルト: - enter image description here

入力された姓: enter image description here

入力されたSSN: enter image description here

しかし、私はまだ何が最もエレガントな解決策であるかについて興味があります。これが失敗する場所はどこですか?直感的ではありませんか?

4
invot

各フィールドの1つのコピーを保存するのが難しすぎると思います。

ユーザーが完全なSSNを知っている可能性が最も高い場合を想定して、これを試すことができます(定型入力のある単一のフィールドではなく、3つの個別のフィールドがSSNを入力する正しい方法であることに懐疑的ですが、経験を使用してください)ここにユーザーと一緒に):

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

3
Kit Grose

個人的には、プロセス自体が健全であれば、フォームデザインによってプロセスが改善されると私は考えています。そのため、相互作用のデザインだけで何かを「単純化」することは非常に困難です。

しかし、問題について考える方法は、プロセスをより単純にすること(より直感的でないとしても)で、少なくともユーザーが問題を解決できるようにすることです。

あなたがする必要があるのは、人々が情報を提供する最も一般的な方法を考え出すことです(つまり、ほとんどが簡単に利用でき、覚えやすく、彼らが望む検索結果を得るために最も役立つものです)。

私の心の中で、誰もが完全な名前を知っている必要があります(他の人の代わりに検索している場合を除く)が、完全なSSNと部分的なSSNの間の論理(つまり、完全な番号を覚えていない理由)を理解していません。最後に、組み合わせは、データ入力とロジックの量の面で最も厄介です。

そのため、「完全なSSNで検索」入力フィールドがあります。あいまいさがないため、これは最も簡単で簡単なオプションです。

次に、「姓と4桁のSSNで検索」入力フィールドを使用できます。ユーザーがすべての詳細を入力しないと、無効な検索要求になります。

3
Michael Lai

以下についてはどうでしょう:

ユーザーがフォームを開くと、次のようなものが表示されます。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

ユーザーが名前の入力を開始すると、赤いテキストが次のように変わります。

mockup

bmmlソースをダウンロード

ユーザーがSSNの入力を開始する場合、姓を空のままにする必要があると想定すると、次のように表示されます(SSNエントリが無効であることを説明するバルーンに注意してください)。

mockup

bmmlソースをダウンロード

結論-ユーザーの入力をその場で解析し、フォームの状態が動的に変化して、エントリが有効かどうかを反映します。さらに、無効なエントリでは検索ボタンが無効になり、有効なエントリでは有効になります。

ユーザーにとっては、アクションの効果をすぐに確認する方がはるかに直感的です。彼らがデータを入力するとき、彼らの失望に最高の経験「あなたは無効なデータを入力しました」ダイアログを期待して「検索」を押してください。

2
Mike

オプションかどうかはわかりませんが、入力ダイアログを提供する前にワークフローを分割すると、プロセスも簡略化されます。この方法では、1つのユーザーインターフェイスで両方のユースケースをカバーする必要はありませんが、それぞれに合わせて動作を調整できます。

たとえば、メニュー項目から検索を起動する場合、1つだけでなくSSNによる応募者の検索および姓と4桁のSSNによる応募者の検索メニュー項目を使用できます。 応募者の検索メニュー項目。

1
Jaco Briers