Tag Info

Hot answers tagged

8

I like the way Facebook and other show lists of people. A possibility would be: No selection: One city selected: Two cities: More than two: Hover to see selection without opening (maybe with something more elegant than a title attribute): *Finally, if all options are checked:


7

Twitter FTW I've always thought Twitter has the best solution to this. It allows you to hammer out whatever you like, then edit it down to something that fits. It's extremely clear to the user.


4

Are you sure that you're sure? This is the question you ask your users with this type of strategy. Business goals From a business perspective the thinking is: Required field - we must have it. Optional field - provide at will. Users The way optional fields are seen by users is: I can either provide it or not. If the user is aware of what is ...


4

TL;DR: Don't disable the submit button and wait to present errors until after the user has hit the submit button. Studies have been conducted showing that users tend to complete forms in full before fixing errors, regardless of error presentation. One such study looked at how users reacted to different error presentations: Usable error message presentation ...


4

Don't leave fields blank When a field is blank, the user has no indication that the blank space is intentional (and not a page/widget error). It's for the same reason that publishers print intentionally blank notices in books to avoid user confusion: The presentation in your screenshot (using the - indicator) works fine from a usability perspective. ...


4

Keep it for business addresses In business contexts it is often used for 'Attn:' lines or department names. In large metro areas, it is also commonly used for building ID, eg 'West Tower'. You could mask it until business address is checked. Unfortunately, people don't always catch that requirement. In the end, you have to ask yourself what's more likely ...


4

A simple resolution would be to show a simple descriptive text which tells them what to do i.e. they need to atleast upload two images to continue. Here is a quick wire frame for that. Until the user doesn't add the required number of images keep the continue\save button disabled.


4

It's best not to reload during a signup process, but sometimes it can't be avoided. There are many signup processes for even very mature sites (e.g. gmail, ebay, etc) which involve page reloads. What issues need to be addressed? Page loads create cognitive disruption to users. While you're filling in a form, the page becomes your universe so a reload ...


3

Given you’re designing the user interface, not the program’s interface, it makes sense to signal what’s required of the user, not what’s required of the program. Part of the purpose of the UI is to communicate the actions the user can or must make. In the case of require fields, the commonly used red asterisk communicates to the user “you must put something ...


3

Ticked and delivery address folded or greyed/disabled. Because: "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 case" Most users don't need it - don't show it. Show it only on demand or make it obvious as optional. It makes your form more convenient, ...


3

Conscious Decision IF the main idea here is to force the user to make a conscious decision to provide or not provide a phone number then maybe you could integrate a radio button group into the control. Radio Buttons The first radio button could live alongside the text box for the phone number. Selecting this one would mean they then have to provide some ...


3

Two address lines are necessary. A common use for the second line is to bring attention to a specific location or sub-address within a large business park or manufacturing facility. It is also commonly used when shipping internationally when the addresss is very lengthy. Example #1 (Attention to location inside shipyard): Block X, Office Number 0-12, 2nd ...


3

Instead of showing an empty list, show one with two placeholders that need to be filled before continuing - this shows the user that you're expecting at least two images. As real images are added, remove the placeholders.


3

In the process of developing a new app (releasing next week), we ran into this exact problem. We originally included a date picker, but went back to the drawing board because we realized we didn't ask the right question. For us, it was straight text inputs, no pickers or options. So, apologies, but you're not asking the right question either. What is the ...


2

You could use a date range picker in order to have a combined view of start and end date. Also by re arranging the fields you can make the layout more compact and easier to scan


2

At least one example is in spreadsheets. Both Excel and Google Docs have Enter move to the next row and Tab move to the next column. If your the end user is familiar with certain types of data entry, using Enter may be more familiar to them. For example see: This is a fake example, but many financial documents are set up to be entered a single column at a ...


2

When showing multiple offers, then an emphasized product suggestion might be a good idea as some people need a little nudge. I believe there are some psychology studies out there which suggest that the more choice there is, then the lower the chances of a decision actually being made and acted upon. In order to combat such analysis paralysis, try emphasizing ...


2

From a visual point of view, 2 sizes is OK, different sizes for input fields is very confusing, and the same applies if you expect to input 2 characters and have room for 40. The user will wonder if they need to add something else in most cases, so visual hinting plays a role. Of course, like Chris commented, you need to keep in mind that under a certain ...


2

I would use a mix of your options: Show an inline validation and don't disable the submit button. If the form is still invalid when clicking submit you could auto scroll to show them (if they've get "out of the screen") and show the errors below the fields until each field is modified. This approach is currently used by Google, Facebook and Twitter. In ...


2

Since this is in the UX forum I'm going to give you some UX feedback. :) Side-by-side forms, particularly for complex forms, are not good from a usability perspective. Best practices for form layout is a single column form, or possibly two very clear, distinct columns. Save yourself some work and forget about the form library or coding this up. It won't ...


2

Here's a more condensed version of what you posted. I kept the read-only fields on a row separate from the inputs you can actually alter.


2

The trust is not built at the logi form but before! It takes into account the presentation of content, footer of your site and some associations verifying the authenticity. Depends on business you are operating, one of the biggest trust building factor can be simple login form with links to your public domain content. Like contact details with real address. ...


2

You are describing a use case for an expert interface Expert interfaces are specialized to accomplish a particular task effectively. The UX trades off intuitiveness in favor of productivity/accuracy/speed. Here's an example of an expert interface, a stock trading keyboard: Unfortunately, expert interfaces are so specialized that they aren't very well ...


1

Part One You Do! Simply: If you need the information, it's required. If you don't need, but want it, it's optional. Part Two The Database Does! I like this better, in terms of the back-end. If your database has it as NOT NULL, mark it as required. If your database has it as NULL, you leave it as is and take what you get from the user. ...


1

While it depends on the form and the data, in your particular case I wouldn't do it. If you pre-fill fields, most users will leave them "as is" because they won't know if they can modify those fields, or they won't care. Either way, a bad behavior because neither you nor the user will get the expected results. Pre-filled forms should only be used when the ...


1

Those are still required fields. Based on your edit, your watermarking is using actual data, so you need to signify what fields are required. The From field you obviously need them to fill in, so you can't accept the default. The Report Name, Subject, and Date Range fields, however, that's your call. They are valid defaults that the user may want to ...


1

Regarding designing a longer form The problem with two columns forms is users would be confused by the two column layout and interact differently needing them to more time to get the task done. To quote this article One of the problems with form fields in multiple columns is that your users are likely to interpret the fields inconsistently. ...


1

Having inputs on the right side of the tablet that are easy to hit with the thumbs is almost irrelevant, or a at least a pretty low level concern. Users will typically rush through forms to get them over with, and having inputs scattered around the page will take away from the discoverability of inputs and their labels. Left aligned inputs and a scrollable ...


1

Neither approach If possible, settings should be on one page, and you should not have to re-enter your password. There are several ways to do this. Here are two: In the second approach, the password form is hidden and is displayed when the user wants to change the password.


1

This depends on the level of security you require. Perhaps you can conditionally require the password depending on which fields the user has altered?



Only top voted, non community-wiki answers of a minimum length are eligible