web-dev-qa-db-ja.com

長方形とモバイルのテキストフィールドの角の丸み

角丸四角形のテキストフィールドの認識に違いがあると思いますか?

私の目標は、丸い角がユーザーが入力できるフィールドであり、長方形の角が読み取り専用のフィールドであるという規則を確立することです。その目標を達成する他の方法があることは知っていますが、私の質問はこれらの視覚的要素のみに焦点を当てています。

mockup

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

6
AsafBO

丸みを帯びた角と正方形の角との認識には違いがありますが、意味論ではありません-これは設計上の選択であり、明示的な意味を持ちません。したがって、コーナースタイルをセマンティックとして使用することを選択した場合、多くの人々を混乱させることになります。しないでください。

フィールドを無効にするか、編集不可にする必要がある場合は、適切に機能する標準の方法を使用してください。


丸みを帯びたコーナーと四角いコーナーの心理的知覚は、 日常の形の心理学 に関する質問で扱われます。

5
JohnGB

質問に答えるために、純粋に形状のみの観点から、長方形をテキストフィールド(編集可能またはその他)と接続し、丸みを帯びた形状をボタンのようなアクションでさらに接続します。実際、検索ボックスは丸みを帯びていることが多く、複数の要素を組み合わせることがよくあります。これらは、編集可能領域とアクション領域の特殊なケースのようなものです。

私の解釈は、1つの図形が編集可能かどうかというあなたの質問にほぼ垂直です。つまり、どちらの場合もそうではなく、実際には別の意味を観察します。

意図した意味と私のものを組み合わせるのは非常に混乱し、翻訳で失われる可能性があります。

ただし、 コンテンツはインターフェイス であり、人間の直感に基づいた自然なユーザーインターフェイスの使用が増加するはずのモバイルの世界では、読み取り専用のコンテンツに境界線を付ける必要はなく、なるべく避けてください。 (私はそれが一般化の何かであることを理解しています。)

読み取り専用コンテンツは単純です:content

この質問をすることで、ほぼ答えが得られます。すでに他の人に馴染みのある、認められているメカニズムを使用する方がはるかによいでしょう。

2
Roger Attrill

前に述べたように、丸みを帯びたエッジはより魅力的です。これによると XMovementによる記事 、彼らは目に優しく、「鋭さ」の危険をもたらすことはありません。最近の 心理学的研究 はこの概念をサポートしており、鋭いエッジを見た結果として脳にネガティブな感情が生じることを示しています。丸みを帯びた形状のみを使用する余裕がある場合は、より良いです。また、ユーザーから利害関係者まで、人々があなたのデザインがどれほど成功しているかを判断する必要がある場合にも、それはよりよくわかります。

丸みのあるテキストフィールドと角のあるテキストフィールドを区別する強力な規則はないと思います。 iOSでは、ほとんどすべてのテキストフィールドが標準として半分丸められているため、ここでは操作する余地がほとんどないことに注意してください(Appleのデザインのもう1つの驚異)。また、ほとんどの場合、テキストフィールドが編集できない場合は、テキストフィールドのフレームを保持する理由がまったくわかりません。単純なラベルでコンテンツを表示するだけです。

形状を読み取り専用にすることは興味深いアイデアです。ユーザーがそれを理解するのにしばらく時間がかかる可能性があるため、私はその差別化された次元だけに頼ることはしません。ここで他の人が提案しているように、従来の読み取り専用マーカーでサポートすると、ユーザーが読み取り専用属性を非常に簡単かつ迅速に判別しやすくなる場合があります。しかし、これは、ユーザーが定期的かつ頻繁に両方のコントロールグループにさらされている場合にのみ発生します。そうでない場合、規則はユーザーの期待に沿うことができません。

1
Dvir Adler

規約はすでに存在しますdisabled = "disabled"は読み取り専用の入力ボックスをレンダリングしますが、セマンティックHTMLでもあります。この属性は、入力ボックスの背景の色も灰色に変更し、テキストは少し色あせて見えます。同様の手法を使用して、非アクティブなメニュー項目を表示します。

1
Igor-G