Mockup
A mockup is a visual representation of a product or interface’s intended appearance and structure, typically without full functionality.
Everyday Data Visualization
A visual prototype of a design that represents its intended appearance at a specified level of fidelity.
- How it is used
- Uses visual prototypes to compare layouts and secure stakeholder approval before development.
- How deep it goes
- Explains increasing fidelity and effort trade-offs, but stops short of detailed component construction.
- Examples
- Uses dashboard wireframes, bar graphs, a calendar view, line charts, colors, fonts, and interface controls as examples.
- What you can do after
- Evaluate layouts and apply an appropriate fidelity level before committing to development.
Design for Developers
A mock-up is a static visual representation of a proposed interface appearance used for review and refinement.
- How it is used
- Uses a static visual design to review interface appearance after wireframing and before development.
- How deep it goes
- Explains timing, visual decisions, review, revision, and handoff, while stopping short of interactive behavior or implementation detail.
- Examples
- Uses a travel-agency homepage with destination imagery, trending destinations, group travel, precise measurements, and content hierarchy.
- What you can do after
- Evaluate and communicate a proposed interface appearance, then guide collaborative implementation and revision.
Related concepts
- UI designused by · UI design is the practice of planning the visual elements and interactive behavior of interfaces through which people use software.
- wireframeproduced by · A wireframe is a simplified schematic representation of an interface’s structure, layout, content, and controls before detailed visual design or implementation.
- user testingused by · User testing is an evaluation method that observes or measures representative users interacting with a product or system while performing relevant tasks.
- HTMLuses · HTML (HyperText Markup Language) is the standard markup language for structuring content and elements in web documents.
- CSSuses · CSS, or Cascading Style Sheets, is a stylesheet language for specifying the presentation and layout of structured documents and user interfaces.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.