Skip to content

Optimize generated form layout to follow best practices #121

@danielnaab

Description

@danielnaab

Goal

As a person filling out a digitized form, I want a layout that is easy to follow, not overwhelming, and guides me through the process so that I can complete the form accurately without frustration.

Context

Generated forms currently place many fields on a single page, which can feel overwhelming and increases the chance of errors or abandonment. Government forms often have dozens of fields, and presenting them all at once contradicts established UX best practices for form design. The form generation pipeline should produce layouts that are usable by default, without manual intervention.

Scope

Audit the current form generation output against established form design best practices and implement improvements. Areas to evaluate include:

  • Page structure: Break long forms into logical sections or steps rather than a single page
  • Field grouping: Related fields should be visually grouped with clear section headings
  • Progressive disclosure: Show fields contextually where possible (e.g., conditional sections)
  • Field density: Limit the number of visible fields per page/section to reduce cognitive load
  • Labels and help text: Ensure every field has a clear label, and complex fields have guidance
  • Error handling: Inline validation and clear error messages positioned near the relevant field
  • Mobile layout: Forms should be usable on small screens without horizontal scrolling
  • Accessibility: Form structure should be navigable by screen readers with proper ARIA attributes

Acceptance Criteria

  • An audit of current form output identifies specific issues with examples
  • Forms with more than ~10 fields are broken into logical sections or multi-step flows
  • Related fields are grouped with descriptive section headings
  • The form layout works well on mobile viewports
  • Accessibility review confirms screen reader compatibility
  • At least one real-world form (e.g., a government PDF) is tested end-to-end through the improved pipeline and the output reviewed for usability

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions