11

I have to show more than 11 fields within the screen. 4 fields are mandatory. How should I indicate the mandatory fields? Is there any standard or any ideas?

4 Answers 4

4

The standard, albeit not very creative, is an asterisk on the label. Since we're here to talk UX not UI and it's all about making it easy to understand this is probably the best option.

As a UI designer I like to combine that with more aesthetically pleasing I like to use other methods as well as this - see my question from a couple of weeks ago - Amber outlined required field

2
  • 1
    UI is on topic as well
    – Ben Brocka
    Aug 14, 2012 at 1:15
  • 1
    @TJH: "Since we're here to talk UX not UI" -> it's a common misperception that UX and UI are not related. But UX encompasses different concepts, partly UI too. From iOS Wow Factor: "[...]This led to the emergence of the more comprehensive “user experience” mindset and its gestalt approach to product design. That mindset included usability, but also encompassed aesthetics, perception, and emotional engagement on the part of the user." Aug 14, 2012 at 7:28
3

I would write a gray italic hint inside the textbox, which vanishes when focused. You could hint "required" in the four mandatory fields, or "optional" in the rest. But don't do both, to make differentiation easier.

0

Can you physically group the fields? If so, group the 4 required ones, put them at the top, and label them required.

2
  • I'd be worried that users might not read fieldset legends - only the form labels themselves. Aug 14, 2012 at 15:20
  • a valid worry. At that point, it becomes more of a UI design problem.
    – DA01
    Aug 14, 2012 at 15:30
0

There are few techniques to let the user understand what is mandatory and what's not. The iOS Human Interface Guideline doesn't state anything about that, but as far as I can say from my experience you could follow few different ways:

  • As TJH said, an asterix somewhere around the textfield can get the job done, even though not really aestetically pleasing.
  • Provide a Done button that becomes selectable only after the user filled up all the mandatory fields
  • As shown in this video, you could put an icon in the right part of the text field that changes its state depending on the user input. For instance, if the user moves the focus away from a mandatory field that is not filled up, a "wrong" symbol will appear on the right. This approach gives you the advantage that you can embody even a more fine grained validation for you text fields, so you could present the error even if the input is not correct.

I usually adopt a combination of the 2nd and 3rd techniques, so to let few room for interpretation to the user.

There are of course probably many other ways to achieve the result, here I posted just those the got to my mind now.

One last thing, in the iOS Human Interface Guideline, they say:

Make it easy for users to input their choices. For example, you can use a table view or a picker instead of a text field, because it’s usually easier for people to select an item from a list than to type words.

You are asking for how to show mandatory text fields, but maybe try to think if some of them can be mutated in pickers with few standard entries. With them you could put as the standard selection the first choice, so that the user will be obliged to change it to the correct one (without chances to leave it blank).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.