An easy way to explain what a mockup is, in relation to wireframes and prototypes, is to plot these different design techniques on a fidelity-versus-time chart:
Figure 8.3: A fidelity-versus-time chart, illustrating the difference with sketches, wireframes, mockups, and prototypes
In time and in fidelity, a mockup is another step up from a wireframe, which begins to show how your UI is going to look and feel. A mockup is still a static, non-interactive product at this stage. Its real value is in illustrating to other developers, testers, and users the aesthetics of your software.
Much like storyboards and wireframes, this is all about bringing your intangible software to life, visually, and therefore helping your stakeholders to picture what the finished product will look like and provide feedback to change it, if required, without having to...
