ryux-forms: Forms

Group UX · Delivery Gate area UX · RX-2.0. Levels are defined in ryux-core.

A form is a conversation. Design it field by field, then as a whole.

• Grouping: related fields together, with a group label when there are more than a few.
• Labels: visible and tied to the field; placeholders are examples, not labels.
• Layout: one column for sequential input is the default; put short related fields side by side when people read them as one unit. Decide by relationship, not by filling width.
• Fewest fields: ask only what the task needs; mark whichever of required or optional is less common.
• Validation timing: validate a field after the user leaves it or when the format is clear; never erase what they typed.
• Defaults and autofill: prefill what you know; set autocomplete and inputmode.
• Multi-step: show the step, allow going back without losing data.
• Unsaved changes: autosave with a visible status, or warn before discarding.
• Submission: prevent double submits, show progress, then success with what happens next, or failure with input kept and a retry.