2014
Lynda
Justin Putney
1:38
English
At first glance, InDesign might not seem like a natural choice for UX design. But the interactive and animation tools that make InDesign great for designing ebooks and apps also happen to be ideal for designing wireframes and prototypes. In this installment of UX Design Tools, Justin Putney shows how to use InDesign's grid and guides to align wireframe objects, create shapes, save and reuse text and object styles, and add interactivity and motion to your designs. Plus, learn how to create alternative layouts and liquid layouts that automatically scale when displayed on different devices, and build a library of reusable artwork.
Introduction
Welcome
About InDesign and UX
Using the exercise files
1. Setting Up Your Files
Creating a new InDesign document
Creating a document preset
Using a grid
Using guides
2. Creating Shapes
Creating rectangles
Adjusting the appearance of shapes
3. Organizing Content
Stacking artwork
Grouping artwork
Using the Layers panel
Creating application states using layers
4. Using Text
Creating text frames
Adding placeholder text
Creating character and paragraph styles
Setting document defaults
5. Adding Interactivity and Motion to Wireframes
Hiding and showing content with buttons
Challenge: Create an interactive video overlay using buttons
Solution: Create an interactive video overlay using buttons
Using multistate objects
Creating animations
6. Creating Responsive Wireframes
Using Liquid Layout
Using alternative layouts
7. Creating Reusable Artwork
Using master pages
Using object styles
Building a library of reusable artwork
8. Exporting Wireframes
Export to interactive PDF
Export to SWF
Export to HTML5 using in5
Exporting hex colors for HTML
Conclusion
Next steps
Download File Size:225.94 MB