ユーザーがクレジットカードの有効期限を編集するとどうなりますか？
クレジットカードの有効期限の月と年を入力するためのUXは、扱いにくい場合があります。私はいくつかのサービス（Netflix、Lyft、Uber）を試しましたが、すべてバグがありました。 Amazonでは、ドロップダウンフィールドを使用してこれを回避しています。 Cash App（Squareから）は、最後からのバックスペース以外の編集を禁止することでこれを回避します。
https://ux.stackexchange.com/a/9898 や クレジットを入力する最も直感的な方法）など、このサイトの関連するスレッドとそれらがリンクする記事を見てきましたカードの有効期限 。
ユーザーが最初の2桁を入力した後に自動的に/を追加するなど、いくつかの原則が広く受け入れられています。しかし、私は私の質問に対処する何かを見つけることができません。
ユーザーが2030年6月を表す06/30のような有効期限を入力するとします。すると、ユーザーはその月の07を入力するつもりであることに気付きます。カーソルを6とバックスペースの直後に置きます。彼らは何を見ますか？私は2つの主な選択肢があると思います：
0/3003/0
これらは2つの異なる哲学を表しています。 ＃1は、月と日を個別に編集できる個別のフィールドとして扱います。 ＃2は、有効期限を2番目の文字の後に/を付けた単一のテキストフィールドとして扱います。
どちらが優れたUXですか？どちらもユーザーには奇妙に見え、最初に入力するときよりも制限が少ない編集で編集する必要があります。
電話番号や社会保障番号を編集する場合は、＃2を使用します。明らかに1つのフィールドです。 Square Cash Appのようなもので、クレジットカード番号と有効期限、およびCVVがすべて1行に表示されている場合、これらは明確に別々のフィールドであり、私は＃1を期待します（ただし、この場合、移動は許可されません）カーソルと前の文字の編集）。月と年が物理的に別々のフィールドにあった場合、それらは個別に編集する必要があります。しかし、このケースはあいまいです。
重要な場合は、Androidアプリ用です。
より良いUXとは何ですか？ ＃1、＃2、または他の何か？
2つの数値フィールドのように扱います。
このようにして編集は単純で明白になり、入力は最小限の労力で済みます。
より良いものにするために追加したい実装の詳細：
/文字で区切られた2つのフィールドを使用しますが、1つの領域のように見えるようにスタイルを設定します。- ユーザーが入力した
/、\、-、.文字は年フィールドに進みます。 - 月のフィールドに2桁を入力した後。
03、ユーザーが20で日付を入力できるように、年フィールドに進みます 0320、03.20、3.20および03[タップ]20のユーザー入力は、すべて同じ結果になります。- パスワードマネージャー/オートフィルで動作することを確認してください。多くのユーザーはこれを行う必要はありません！
いいえ、ドロップダウンではありません
ドロップダウンは、フィールドに数値を入力するための非常に退屈な方法です。特に、数字パッドを使用できる電話では。フィールドタイプが数字に設定されている場合、Androidは数字パッドを表示する必要があります。
クレジットカードの有効期限は12か月と数年しかありませんが、すべての日付入力フィールドに一貫性を持たせる必要があり、ドロップダウンに31の数値を含めないでください。
ここであなた自身の質問に答えたと思います...
Amazonは、ドロップダウンフィールドを使用してこれを回避しています
そのソリューションで問題を大幅に簡略化できます。
ドロップダウンの唯一の本当のUXの警告は、カードが示すものと一致する値を表示する必要があることです。これはMM/YYスタイルです（例：09/22）。そのため、ドロップダウンには数字の代わりに月の名前を使用しないでください。一部の人々は頭の上から毎月の数を知っていますが、知らない人もいます。