Single-question page

Problem Context

• The service is collecting sequential answers, eligibility decisions, or task data where one answer may shape the next screen.
• Users may be on small screens, under stress, using assistive technology, or completing a high-stakes government, finance, health, or support flow.
• The answer may use one field or several related controls, but those controls all answer the same question.

Selection Rules

• Choose a single-question page when one conceptual question deserves focused reading and answering before the next task step.
• Use the question text as the page heading when it is the main task on the page.
• Keep related fields together when they answer one question, such as a date split into day, month, and year.
• Prefer a single-page form for short low-risk data sets that users need to scan, compare, or edit together.
• Use single-question pages inside a multi-step form when the broader journey has several ordered pages or sections.
• Avoid wizard framing unless users need a guided sequential tool with strict branching, step locking, or complex progress management.
• Use the appropriate answer control inside the page, such as radio group, checkbox group, text input, textarea, date input, or file upload.
• Validate on Continue or after interaction, preserve the answer, and keep the user on the same question until it is fixable.

Required States

• Initial unanswered state with question heading, optional explanation, answer control, Back link, and Continue action.
• Answered state showing the selected or typed answer before submission.
• Conditional detail state when an answer reveals another field that still belongs to the same question.
• Missing-answer error state after Continue with the answer control still available.
• Recovered state after correcting the current question.
• Back-return state with the previous answer restored.
• Loading or saving state when Continue persists the answer before moving to the next page.

Interaction Contract

• Back returns to the previous page or step without clearing the current answer.
• Continue validates only the current question and moves forward only when the answer is complete enough for the next page.
• Changing an answer updates any related conditional content without navigating unexpectedly.
• Errors identify the question and affected controls, preserve the answer, and keep focus or reading order in a recoverable place.
• The browser Back button and service Back link do not create conflicting histories or duplicate submissions.
• Progress indicators, if present, describe the broader flow without turning the page into a dense wizard dashboard.

Implementation Checklist

• Write the page heading as the exact question users need to answer.
• Place any explanation, eligibility context, or privacy note before the answer control.
• Choose the answer control by the data being collected rather than by the page pattern name.
• Group related controls on the same page when they answer one conceptual question.
• Provide Back and Continue actions with consistent placement and labels across the flow.
• Persist the current answer before navigation and restore it after Back, validation, reload, or server errors.
• Add field-level errors and an error summary when the page is submitted with invalid or missing answers.
• Test the page with keyboard, screen reader, zoom, mobile viewport, browser Back, service Back, validation, and conditional answer changes.

Common Generated-UI Mistakes

• Putting several unrelated questions on one page and still calling it one thing per page.
• Splitting one answer across several pages when the fields need to be understood together.
• Using the pattern as a substitute for choosing the right field control.
• Adding wizard chrome, progress locking, or branching UI to a simple isolated question.
• Clearing the answer after Back, Continue, validation, or reload.
• Using vague headings such as Details or Step 2 instead of the actual question.
• Showing a generic error that does not name the unanswered question.
• Making users continue through many trivial pages when a short single-page form would be faster and lower risk.

Critique Questions

• Is there exactly one conceptual question on this page?
• Does the page heading clearly state the question users are answering?
• Do all controls on the page answer the same question?
• Would users benefit more from scanning these fields together on one page?
• Does Back, browser Back, validation, and Continue preserve the current answer?
• Is the next page determined by this answer, and is that transition understandable?