Compiled with the assistance of the Tiger University Program of the Estonian Information Technology Foundation

Mockups
Ilja Šmorgun

What is a Mockup?
• A model or replica of a machine or
structure, used for instructional or experimental purposes printed

• An arrangement of text and pictures to be

A full-size model of a design or device, used for teaching, demonstration, design evaluation, promotion, and other purposes

A pixel-perfect representation of the application’s user interface

Colors, graphics, UI elements and their dimensions are set

The foundation for developing a working prototype

Example

Tools for Creating Mockups

Adobe Photoshop

iPhone 4 GUI PSD

iPad GUI PSD

Android GUI PSD

OmniGraffle

http://graffletopia.com/ categories/iphone

PowerPoint

MockApp

Defining the Interactions

State Transition Diagram
• Give an abstract description of the
behavior of a system

• Behavior is analyzed and represented in

series of events, that could occur in one or more possible states

Start

Sign up to vote on this title
UsefulNot useful