| |
| |
| Introduction | |
| |
| |
| |
| UI Design with Adobe Illustrator: An Overview | |
| |
| |
| It's All About the Vector | |
| |
| |
| Typography + Color = Power | |
| |
| |
| Typography for UI Design | |
| |
| |
| Powerful Tools for Color | |
| |
| |
| Design for Consistency | |
| |
| |
| Layouts with Precision | |
| |
| |
| Conclusion | |
| |
| |
| |
| Tools and Panels | |
| |
| |
| Choosing Your Tools | |
| |
| |
| Selection Tools | |
| |
| |
| Selection Tool (V) | |
| |
| |
| Direct Selection Tool (A) | |
| |
| |
| Group Selection Tool | |
| |
| |
| Magic Wand Tool (Y) | |
| |
| |
| Lasso Tool (Q) | |
| |
| |
| Drawing | |
| |
| |
| Pen Tool (P) | |
| |
| |
| Lines and Shapes | |
| |
| |
| Typography | |
| |
| |
| Type Tool (T) | |
| |
| |
| Transformation Tools | |
| |
| |
| Reflect Tool (O) | |
| |
| |
| Free Transform Tool (E) | |
| |
| |
| Color | |
| |
| |
| Gradient Tool (G) | |
| |
| |
| Eyedropper Tool (I) | |
| |
| |
| Fill and Stroke | |
| |
| |
| Workspace Tools | |
| |
| |
| Modes | |
| |
| |
| Drawing Modes | |
| |
| |
| Screen Modes | |
| |
| |
| Panels | |
| |
| |
| The Control Panel | |
| |
| |
| Expanding and Collapsing Panels | |
| |
| |
| Workspaces | |
| |
| |
| Using a Custom Workspace | |
| |
| |
| Conclusion | |
| |
| |
| |
| The Illustrator Workspace | |
| |
| |
| Go from Print to Pixels | |
| |
| |
| Choosing the Right Units | |
| |
| |
| Optimizing the Color Space | |
| |
| |
| Application Frame | |
| |
| |
| Working with Artboards | |
| |
| |
| Opening a New Document | |
| |
| |
| Creating Artboards | |
| |
| |
| Organizing Artboards | |
| |
| |
| Conclusion | |
| |
| |
| |
| Ul Design Building Blocks | |
| |
| |
| Guides Objectified | |
| |
| |
| Creating Guides | |
| |
| |
| Making Guides from Objects | |
| |
| |
| Using Alignment Tools | |
| |
| |
| Smart Guides | |
| |
| |
| Alignment Guides | |
| |
| |
| Anchor/Path Labels | |
| |
| |
| Object Highlighting | |
| |
| |
| Measurement Labels | |
| |
| |
| Transform Tools | |
| |
| |
| Construction Guides | |
| |
| |
| Grids Made Easy | |
| |
| |
| Creating a Grid | |
| |
| |
| Making the Gridlines Fit | |
| |
| |
| Applying the Grid to Multiple Artboards | |
| |
| |
| Achieving Pixel Precision | |
| |
| |
| Pixel Preview Mode | |
| |
| |
| Aligning Objects to the Pixel Grid | |
| |
| |
| Coordinates and Reference Points | |
| |
| |
| Beginning the Layout | |
| |
| |
| Typography for the UI | |
| |
| |
| Looking Good on the Screen | |
| |
| |
| Typesetting Basics | |
| |
| |
| Adding the Final Headline | |
| |
| |
| Conclusion | |
| |
| |
| |
| Getting Stylish with Graphics | |
| |
| |
| Adding Style to Appearances | |
| |
| |
| Using the Appearance Panel | |
| |
| |
| Stacking Appearance Attributes | |
| |
| |
| Creating and Editing Graphic Styles | |
| |
| |
| Using Symbols | |
| |
| |
| Creating a Symbol | |
| |
| |
| Working with Symbols | |
| |
| |
| Going Off the Pixel Grid | |
| |
| |
| Creating an Application Logo | |
| |
| |
| Enhancing the Hierarchy | |
| |
| |
| Using Layers for Organization | |
| |
| |
| The Layers Panel | |
| |
| |
| Display Options | |
| |
| |
| Creating Layers | |
| |
| |
| Moving Objects Between Layers | |
| |
| |
| Tightening Up the Layout | |
| |
| |
| Conclusion | |
| |
| |
| |
| Finishing Touches | |
| |
| |
| Taking Appearances to the Next Level | |
| |
| |
| Illustrator and Photoshop Effects | |
| |
| |
| Adding Old-School Style to the Page Header | |
| |
| |
| Additive Styles | |
| |
| |
| Additional Type Techniques | |
| |
| |
| Getting Text into Illustrator | |
| |
| |
| Area Type Options | |
| |
| |
| Simulating Floats | |
| |
| |
| Using Find and Replace | |
| |
| |
| Working with Images | |
| |
| |
| Preparing Images for Import | |
| |
| |
| Importing Images | |
| |
| |
| Conclusion | |
| |
| |
| |
| Working Smarter | |
| |
| |
| UI Design Planning | |
| |
| |
| Creating a Site Map | |
| |
| |
| Creating Wireframes | |
| |
| |
| Communicate Your Design Intentions | |
| |
| |
| Visualizing Interactions with Story boards | |
| |
| |
| Adding Notes | |
| |
| |
| Style Libraries | |
| |
| |
| Create Color Schemes | |
| |
| |
| Portable Colors, Symbols, and Styles | |
| |
| |
| Templates | |
| |
| |
| Getting Your Work Out of Illustrator | |
| |
| |
| Presentation Mode | |
| |
| |
| Exporting to Other Formats | |
| |
| |
| Saving PDFs | |
| |
| |
| Save for Web | |
| |
| |
| Conclusion | |
| |
| |
| Index | |