From the course: Interaction Design: Software and Web Design Patterns

Unlock the full course today

Join today to access over 22,700 courses taught by industry experts or purchase this course individually.

Preview

Preview - Sketch Tutorial

From the course: Interaction Design: Software and Web Design Patterns

Start my 1-month free trial

Preview

- [Instructor] Previews are a pattern in which the user is shown a preview of the task or the outcome of what they've been working on before submitting changes. Previews may not work as well in a mobile environment, so if you need to use a preview pattern on mobile you'll have to consider a layout that takes spatial constraints into consideration. You also don't need to preview something that doesn't have any stylistic or visual elements as an output. When using a live preview the user can in real-time see the changes they're making in a separate panel. For example, you can see this pattern with some web development editors. Here's an example from Dreamweaver. The changes you make in either the preview panel or the code updates in real-time. And in this example from Google Ads as you enter information on the left the information displays on the right in real-time. This pattern works well when the user has to view a design…

Contents