Design reflow for enlarged content
Adapt an exhibition guide for narrow views and enlarged text by preserving content, order, control access, and relationships, then investigate overflow rather than hiding it.
Test enlargement as well as phone layout
Responsive design and accessible reflow overlap, but a tidy phone screenshot does not prove that enlarged content remains usable. An exhibition guide may contain long titles, navigation, booking controls, and comparison details. Examine how those elements rearrange when space becomes constrained and when the reader enlarges the presentation.
Let content grow within useful relationships
Let content grow rather than fixing containers to a carefully chosen demonstration height. Keep important controls and labels together without forcing whole sections to remain wider than the view. Some content genuinely needs two dimensions, but that does not justify making ordinary paragraphs require sideways scrolling. Identify each exception rather than applying one blanket rule. Treat every additional requirement as a question with an owner. Determine whether the requirement comes from a real task, an operational constraint, or a team preference. Keep the first two visible in the design and challenge the third when it creates work. Writing these distinctions next to the sketch prevents a tidy layout from concealing an unresolved service decision or an unexplained restriction.
Inspect a constrained exhibition guide
Create a guide with a long exhibition title, two booking options, and a materials list. Inspect it in a narrow viewport and with browser zoom. Follow a link to a related page and return. Note any clipped labels, unreachable controls, content hidden under fixed elements, or relationships lost by the rearrangement. Use ordinary content rather than a perfect demonstration record. Include one short entry, one unusually long entry, and one entry with missing optional information. Work through the task in the order a newcomer would encounter it. Write down what they can reasonably know at each point. Whenever the sketch requires an explanation from its creator, add the missing cue to the artifact before increasing its visual fidelity.
Find the actual cause of overflow
If overflow appears, identify the element creating it before hiding horizontal overflow globally. A long unbroken identifier, fixed-width card, or grid minimum may be responsible. Hiding the symptom can leave information inaccessible. If a comparison needs a different narrow layout, preserve the connection between each value and its attribute. Avoid solving the failure by asking people to be more careful. Look for an earlier decision the design can clarify, a value it can preserve, or a consequence it can make reversible. If there is an unavoidable limitation, explain it before the affected action and provide a useful next step. The fallback deserves the same attention as the ordinary route through the experience.
Review all states after rearrangement
Review the entire task after layout changes, including errors and confirmation states. Verify that content remains available and the order still makes sense. Keep a list of deliberate two-dimensional exceptions and their rationale. A successful reflow design supports reading and action when space is constrained; it is not simply a smaller visual composition with the troublesome content concealed.
Worked decision
When a long exhibition title wraps, the booking control should remain available and readable rather than being pushed under a fixed-height card boundary.
References & further reading
Examples and exercises in this guide are original teaching scenarios.
