Input fields are several different controls such as textboxes, dropdown lists and radio buttons who reside in a (web) form.

learn more… | top users | synonyms

8
votes
2answers
714 views

What is an appropriate visual metaphor for time units?

My app displays time units, such as [minute, hour, day, month, year]. There will be no magnitude associated. They convey the information "About how long will this action take?" (Think TODO list) Is ...
8
votes
3answers
1k views

Display input text that exceed input width

I'm having some issues when the user types extensive text in a small input field. I need some good way to display data that will be cut off. I tried to use a Bootstrap based Tooltip or Popover on ...
8
votes
4answers
309 views

Canadian Postal Code Input field

The Canadian postal codes is formed from 6 letters and 6 numbers, interposed. Example: M1K 3H7 The Canadian postal code is quite tricky for a user to enter into an input form field, especially on ...
8
votes
2answers
286 views

Allowing user to input a constrained value

I need to allow users to enter a number between X (minimum number) and Y (maximum number). X and Y will have different values depending on the specific client set-up of the tool. These values could be ...
8
votes
2answers
412 views

Do users like icons on an input field?

Icons on input field Input field without icons Do icons really matter on an input field? Do they encourage users signing up?
8
votes
1answer
623 views

Time (duration) entry in webapp - pros/cons of various designs

In designing a way to enter time durations in a website, there are various proposals below. What are the pros/cons from a UX standpoint for both mouse & touch uses. Yellow boxes show input ...
8
votes
3answers
182 views

Form prompts inside form fields always wrong?

I've noticed in the edit-profile form on UX Stack Exchange a weird prompt with an important message - the date format. Personally I would consider it terribly wrong (force to memorize data format, ...
7
votes
4answers
5k views

Material Design required field

Has anyone seen in Material Design how to present a required field? At the moment it seems the guideline is either to hide the submit button until required fields are populated or else throw an error ...
7
votes
5answers
376 views

Usability of an email field without label “email”

Does it make sense to a user that this field is for email only? Or is it confusing?
7
votes
3answers
380 views

What is the best way to display nullable bool value as UI component?

There are common pattern for nullable (three state) bool checkbox But in real life, if user see only indeterminate (null) state and don't see checked (false) it often confusing that indeterminate is ...
7
votes
3answers
794 views

What is the best interaction pattern for entering a range on a mobile phone?

I have a mobile application where I need to filter a list by a range. (Imagine a dating app where you want to filter people by age). How should one design the range picker? A person should be able to ...
7
votes
3answers
2k views

Order of address, city, country in form

Is there any specific usability reason why the standard order of form elements for entering an address is this order: address address 2 city country Wouldn't it make more sense to go the reverse ...
7
votes
3answers
424 views

“Floating labels” vs “Fixed small labels” on the the web?

On devices with small screens floating labels can improve readability, since the size of the placeholder's text tends to be considerably bigger than the one in the small labels and the latter just ...
7
votes
2answers
355 views

List autocomplete delete/edit behaviour

I am not sure what these widgets are called, but they are the ones used to assigned tags to questions on SE and appear in webmail apps such as GMail and Hotmail as well: If someone could chime in ...
7
votes
2answers
272 views

Ship Date and Delivery Date Picking with Blackout Days?

Lets say that a user is entering a ship date and a delivery date for a customer order. The customer wants it delivered on a particular day. The customer has blackout days such as weekends and ...
7
votes
3answers
678 views

Should all fields in a web form be the same length? [duplicate]

Attached is a screenshot of a web application I am building. It shows where the user can enter input to perform a search. My question: should the text boxes/comboboxes all be the same width? The ...
6
votes
5answers
601 views

Forms: Sample description- for label or field? what should be the placement?

I need to place example input text [abc@pqr.com] for a field or label. Where should I place example (or sample) input description? Here, I have shown four examples of an email ID input for ...
6
votes
3answers
2k views

Showing/Hiding vs.Enable/Disabling form fields

I would like to know the benefits and drawback relative to form design of "dependent fields". For example, in my form I have a Marital Status field, and depending on it's value, I need to know the ...
6
votes
1answer
460 views

Placeholder : field label or sample data?

I am designing a generic form. Every input has a label positioned right above it. My question is about using input fields placeholder : Should they be a reminder of the label (Ex : Label : Username ...
6
votes
2answers
3k views

Date range picker in mobile app

In my current project, I'd like to filter a list by a date range. I'm not sure how I should design the interface in such a way that it's as easy as possible to select a range. My first idea was to ...
6
votes
3answers
380 views

What's the best way to show form labels that are longer than the corresponding fields (which require a short input)?

I'm having trouble with labeling of short input fields. Some labels have standard 280px width approximately, but others are quite small in order to offer clues on the expected input (characters). ...
6
votes
2answers
2k views

How to structure complex forms for business documents?

In our enterprise management software we use forms to record document like customers, invoices, sales order, tasks, products, etc. We wanted forms to look like their hard paper version. Below is an ...
6
votes
1answer
109 views

Make predictions on network configuration data based on IP

I am currently designing an interface for a network device, which needs to be configured by network admins. They are able to change the network settings (IP, subnet, gateway, dns), which got me ...
6
votes
2answers
871 views

Automatically limiting or correcting numeric input field values

The application interface I am working on has a slider to select a number, but offers a text input field next to it. This allows you to read the currently selected value, but also supports keyboard ...
6
votes
4answers
429 views

'Same as billing address' checkbox - Ticked or unticked by default?

I'm working on a subscription user journey. Most of the subscriptions are for digital products. However, a few of them may have a print included in the package and we would need a delivery in this ...
6
votes
1answer
360 views

I have a typeahead in my form. How do I get people to select its options?

I am the UXD (I use this as loosely as possible) for an education startup company. I have a typeahead in my sign up form: This is the last entry in the sign up form. Underneath that (hidden right ...
6
votes
2answers
145 views

What control would best allow the adjustment of signal/noise ratio?

I am developing a web app where a prominent feature is the ability to adjust the signal/noise ratio of the app's content on the fly. The value needs to be represented along a spectrum which includes ...
6
votes
1answer
521 views

Many-to-Many associations - Edit in place or on new screen?

I am trying to design an interface to do two things: Create Items and Objects Create links between Items and Objects (in a many-to-many association) An Item is a simple attribute that must be ...
5
votes
4answers
355 views

Balance between mandatory fields and optional fields

I am working on the project part of which is building a user profile page that is used to collect some information from the user so that this can be used to display better matching results for that ...
5
votes
3answers
1k views

Best practices for how search icon functionality should work

I’m trying to find out how exactly the search icon functionality should work when the icon is clicked. This is for a responsive website. I have three scenarios, please view them on a smaller ...
5
votes
3answers
310 views

Side by Side, Stacked, or something else?

I am creating a property manager module for our CMS, one of the forms is very basic, but I am having trouble getting what should be the most appropriate layout for the form. Below is a screenshot of ...
5
votes
3answers
346 views

Should I vary input field lengths in a single page checkout form?

I am currently designing a single page checkout form. I would appreciate some feedback on the lengths of my input fields. In the Billing and Shipping sections I have staggered the length of the ...
5
votes
3answers
227 views

Minimum length of characters for an autocomplete search input

I'm in the process of creating an a search input for restaurants with autocomplete. I was wondering if it would be best for me to require a minimum amount of characters before returning suggested ...
5
votes
2answers
192 views

What is the best way to display empty fields in a user card?

I'm creating a user widget for dashboard. What is the best way to fill the empty fields here? I can't hide the labels here if they are empty. And if I use "No information available" does it seems ...
5
votes
2answers
978 views

Inline validation icon usability

I have been looking at the styling for validation of input forms of Bootstrap, and wondered if there was a specific reason for where the icons used for inline input validation is positioned. I ...
5
votes
1answer
319 views

What is the most user-friendly software license installation process?

I have Windows desktop software that requires the installation of a small binary license file (1KB) that controls access to DLLs that are installed with the software package. The GUI part of the ...
5
votes
1answer
1k views

Is the asterisk the common symbol to mark fields as required in all languages?

I did some research but didn't find an answer to it. The asterisk seems to be a common symbol on the web for marking input or user interaction as required. Most likely it has it's origins in print ...
5
votes
2answers
379 views

What's better UX: Letting users completing a form with errors marked inline? Or, block the rest of the form as soon as there´s a wrong field?

I'm using inline validation (on blur) as soon as the user clicks/tabs another field. Is it good to block the rest of the fields (previous and following) when a field is validated? The case is: ...
5
votes
2answers
555 views

i18N and form design

I'm trying to design a web form supporting internationalization (i18n). The form will be part of a large event management software. Users login, create events (like conferences, roadshows, and so ...
4
votes
4answers
2k views

Required fields [duplicate]

What are the rules around indicating required fields in a flow that has some pages that have all required fields and some that are mixed? Is it better to denote optional fields in this case?
4
votes
4answers
621 views

Radio input appearance for mixed values

I'm looking for ideas on how to design radio buttons that have a second state that means "no change". So the user selects a few items, similar to how rectangular selection works in Windows Explorer ...
4
votes
5answers
304 views

Best way to enter/display relative time in a text box

In a reporting client I'm working on now, there is a need to filter data by different conditions, among which are conditions based on date/time. Decided, that user first selects a predicate from a ...
4
votes
3answers
496 views

Locking input form fields, does it make sense?

In certain views of our web-application, all information is usually presented as input fields as they can be modified. Now, because of our rights and roles system, for some people, several input ...
4
votes
1answer
1k views

Why do so many forms use input masks in for input fields?

To be honest, I find input masks annoying. Different masks on different sites sometimes work differently, such that their behavior unpredictable and it actually makes me take more time to type out ...
4
votes
2answers
201 views

Does the size of an input influence its value?

I've recently started using BackBlaze as my backup service and I noticed something interesting on their restore sign-in page. The password input is slightly longer than their email input. Since ...
4
votes
2answers
364 views

What's the best practice for limiting text length in a field?

I have a field on a form that I want to limit to 55 characters due to some constraints with an integration platform we use. I've searched both Google and UX.SE and haven't found any good resources ...
4
votes
2answers
359 views

Choice with a Radio button group

Context: In our application we implemented a responsive disclosure. Currently the choices the user can make are rendererd as a set of radio buttons. Currently there a two valid options, A and B. When ...
4
votes
3answers
415 views

Address form, field for “region”

I've done some research and found that each country has its own way of subdividing the country into smaller parts. Examples: Departments (France) States (USA) Provinces (Netherlands) Counties (UK) ...
4
votes
2answers
213 views

Validating Phonewords/Vanity Numbers

I am redesigning a system where the user can enter various contact details for associates via a personal details form. In this form there is a phone number input field. After a phone number is ...
4
votes
4answers
436 views

Date input: with or without “calendar button”?

Nowadays I'm working with Primefaces and I have to choose between two date input controls from here: Popup vs button. The difference: When clicking on the "Popup" text input, you are able to type ...