Wireframe
A simplified visual guide showing a layout's structure and hierarchy without detailed styling.
In practice
A wireframe is a simple drawing of a page or screen that shows its structure and priorities, where content goes and what matters most, without colors, images or final type. Gray boxes stand in for photos and lines for text. Wireframing a product page this way lets a team agree on what goes where before anyone debates colors or fonts.
Often confused with Mockup
A wireframe shows structure and hierarchy without styling; a mockup shows the finished visual design with real colors, type and imagery.
Try this
In ten minutes, draw a wireframe of your favorite app's home screen using only boxes, lines and labels.