Going full screen

Design a full-screen pattern for a web app or media surface. The focus is the transition into and out of full-screen, not the content itself. Show the default state with a clear control, then the expanded state with only the controls users need to keep going or leave.

In the expanded view, remove browser chrome from the design and keep the interface visually quiet. If navigation, playback, status, or progress still needs to be present, place it where it does not compete with the main content. The layout should make it clear what stays visible, what collapses, and what appears on interaction.

Design the exit behavior as carefully as the entry behavior. Include a visible exit control, a keyboard path, and any transient UI that appears on hover or tap. The pattern should feel reversible, predictable, and easy to recover from on every screen size.

An engaging full-screen experience can often make the difference between an average and an extraordinary user interaction. Consider animations or transitions when entering or exiting full-screen for added flair!