web-dev-qa-db-ja.com

フィールドを明確にするには、まだ編集可能なスマートなデフォルト/提案が含まれていますか?

企業が新しいクレジットカードユーザーを追加するフローを設計しています。フローをできるだけ短くしたいので、エンボス名(物理カードで使用される名前)にスマートなデフォルトを表示するというアイデアを思いつきました。このデフォルトは、以前に入力されたイニシャルと姓の組み合わせになります。

ただし、カードに正式な名前を付けることは必須ではないため、基本的にはエンボス名として何でも好きなものを書き留めることができます。私たちは人々に私たちが伝えたものを使用させないようにしますが、スマートなデフォルトを提供することで時間の節約にも貢献したいと考えています。

私の質問です。フィールドが「事前入力」されているか、提案が含まれていることをどのように表示しますが、それでも好きなように変更できますか?

現在、私は定期的に入力されたフィールドの下にキャプションがあり、「提供されたイニシャルと姓に基づいてすでに提案を行っています」と表示されています。

編集:モックアップを追加 Input field with suggestion caption

4
Wendy Wojenka

基本的に、ユーザーは提案の1つを選択するか、独自のカスタム名を入力できるため、これらすべてを1つのラジオボタンリストに表示します。これにより、自動提案が表示されますが、エンボス名をカスタマイズするオプションも伝えられますが、それらはすべて単一の選択に制限されます。

Radio button list with custom input field

8
maxathousand

提案されたテキストは薄い灰色にすることができるので、提案であることは非常に明確です。

追加されたテキストが提案であることを明確にするために下部にすでにヘルプテキストがある場合は、変更できることをユーザーに知らせるための行を追加します。

enter image description here

1
Danielillo

これまでのところ、これらは私が考えることができる2つのオプションであり、クリック/タップ距離で優れた機能を提供し、明らかな害はありません。

mockup

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

0

2つのオプションのみを許可し、デフォルトでスマートデフォルトを選択します

目的は、スマートデフォルトを使用してプロセスを高速化し、デフォルトでスマートデフォルトオプションを選択することです。 2つのオプションのみを許可:最初はスマートデフォルトです。 2つ目は、独自に作成することです。

使用しているスマートなデフォルトができるだけ良いオプションであることを確認してください。このようにして、ユーザーはユーザーにスマートデフォルトを選択するように(== --- ==)奨励します。ま​​た、最小化します2つのオプションのみのオーバーヘッド。結果として、時間の短縮とタスクの高速化に役立ちます。

イニシャルと姓がスマートデフォルトとして最適だとすると、デザインは次のようになります。

mockup

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

または-----

mockup

bmmlソースをダウンロード

編集

[自分で作成]オプションの横に情報/ヘルプアイコンを追加しました。カーソルを合わせると、名前の候補が表示されます。他のタイプの情報を提供するためにも利用できます。

0
Mo'ath

クリック可能なボタン/タグとして提案を表示してみませんか?これは、ユーザーが制御を維持している間にプレフィルを招待します(ユーザーが何か他のものを入力したい場合)。 https://www.instagram.com/p/B1FbvXAg1Jp/enter image description here

0
Jakub