JOUR 103 Lecture Notes - Lecture 22: Website Wireframe, Mockup, High Fidelity
Wireframe: graphic structure of a website or app containing the content and elements.
(blueprint for the website)
• Contains the main information
• Draws the outline of structure and layout
• Visual description of the user interface
1. Visual features
a. simple lines, boxes, & gray color
b. should include pictures, video, and text etc
b.
Prototype: prototype must be a high fidelity prototype which is interactive and fit the final user
interface
• Necessary to test products
• Can save development and time
• Used to collect feedback
2. Visual features
a. Aesthetic
Mockup: "visual script" used for the presentation of the overall visual design of the product
• Richer visual elements
• Static and not interactive