Wireframe
A flat visualization of a user interface that depicts only structure. This is typically a bunch of empty shapes with labels that show the positions and relative sizes of things. Technically speaking, a wireframe isn't a mockup because a mockup depicts exactly how the end-product will look while a wireframe only gives you a rough idea of how it will look.Picture
A hand drawn or digital image may be used as a mockup for a two dimensional work product such as a user interface.Hardcoded User Interface
A user interface that looks and acts much like the final product but with hardcoded data and functionality. For example, a banking mobile app that looks like the final product but doesn't show data from a database or perform transactions.Paper Prototype
Paper crafts that represent two or three dimensional work products. For example, a strip of paper that represents a sequence of screens in a mobile app.Full Size Model
A physical model may be crafted with inexpensive materials at full size. For example, a snowboard mockup may look exactly like the finished product but be crafted from a softwood such that it is lighter and far less durable than the finished product.Scale Model
A model that is accurately constructed at a smaller scale than the finished product. Relative sizes of parts are controlled to be the same as the final product. For example, a model of a train station design complete with buildings, landscapes and infrastructure at 1:40 scale.Digital Twin
An explorable 3D model of a design. For example, a 3d model of a chair that can be used to compare design alternatives.Animation
A moving picture such as an animated gif or a full animation of a work product. For example, an architectural firm that visualizes projects for clients with an animation that explores the exterior and interior of a building.Simulations
Mockups can have a game-like interface whereby users can interact and explore. For example, a digital model of a building that you can navigate at human scale like a character in a video game.Prototype
A prototype is a functional or semi-functional early stage work product that is used for demonstration and feasibility analysis. For example, an experimental solar panel module that actually generates power. Unlike a mockup, a prototype is potentially an expensive item such as an evolutionary prototype of an advanced technology. Inexpensive prototypes are known as throwaway prototypes.| Overview: Mockup | ||
Type | ||
Definition | An inexpensive representation of the look and feel of a user interface, product, service, component, part, building or physical environment. | |
Related Concepts | ||
