Illustrator CS5 for Web and Interactive Design

In Illustrator CS5 Web and Interactive Design, Mordy Golding shows how to create pixel-perfect graphics for use in web sites, video compositions, and mobile apps. This course covers a wide range of workflows, from creating online ad campaigns, web sites, icons, to taking art from Illustrator to Flash Professional. Sharing tips, tricks, and creative techniques along the way, Mordy provides insight and instruction for taking projects from initial concept straight through to production. Exercise files accompany the course.

Topics include:
* Getting perfectly sized pixel graphics from Illustrator
* Setting up preferences in Illustrator for web design
* Creating custom document profiles
* Getting great color on the web
* Understanding web graphic file formats (GIF, JPG, PNG, SWF, and SVG)
* Setting great-looking type
* Slicing artwork for various tasks
* Creating Flash animations directly from Illustrator
* Working with Photoshop Smart Objects
* Exporting HTML and CSS from Illustrator
* Integrating with Flash Catalyst

Introduction 06:56
Welcome 01:33
Choosing Illustrator for web and interactive design 02:54
Illustrator and the web design workflow 02:07
Using the exercise files 00:22
1. Key Concepts and Settings 40:09
Pixel dimension vs. resolution 04:14
Pixel Preview mode and anti-aliasing 05:39
Taking charge of anti-aliasing 05:27
Choosing the right color management settings 07:25
Setting up important preferences 06:22
Setting up a workspace optimized for web design 11:02
2. Creating New Documents and Projects 54:05
Using the Web document profile 03:39
Creating custom document profiles 09:38
Using Illustrator's free web templates 02:33
Creating a sitemap or wireframe 02:50
Setting up an entire web site 09:33
Setting up a grid 10:37
Setting up an online ad campaign 08:13
Setting up icons for iOS 02:24
Setting up mobile content with Adobe Device Central 04:38
3. Working with Web Color 32:22
Understanding web-safe colors 11:50
Limiting the Color Guide to web-safe colors 04:53
Using Recolor Art to convert art to web-safe colors 04:54
Getting color inspiration from Adobe Kuler 06:48
Using Recolor Artwork to modify colors across a site 03:57
4. Optimizing Web Graphics 56:54
Using the Save for Web & Devices feature 06:44
Understanding the GIF file format and its settings 10:20
Understanding the JPEG file format and its settings 07:39
Understanding the PNG file format and its settings 03:21
Understanding the WBMP file format and its settings 01:18
Understanding the SWF file format and its settings 04:13
Understanding the SVG file format and its settings 03:41
Adjusting the dimensions of a graphic 04:46
Optimizing files to a specific file size 04:05
Modifying Save for Web & Devices output settings 06:51
Previewing content in Adobe Device Central 03:56
5. Working with Text 56:11
Setting point type in Illustrator 04:11
Setting area type in Illustrator 05:20
Formatting text quickly with paragraph styles 14:39
Overriding formatting with character styles 03:02
Controlling text anti-aliasing 04:50
Simulating the CSS box model 11:19
Adding cool reflections to text and graphics 08:26
Applying settings quickly with Graphic Styles 04:24
6. Working with Web Slices 35:56
Understanding the concept of slicing 03:22
Creating slices manually 04:26
Creating slices from guides 02:45
Creating slices from objects 07:33
Understanding the different slice types 04:20
Applying settings to slices 09:20
Creating hotspots with image maps 04:10
7. Creating SWF Files from Illustrator 23:35
Exporting static SWF files from Illustrator 03:35
Animated SWF: Converting Illustrator layers to SWF frames 04:03
Animated SWF: Using blends to define motion 08:35
Animated SWF: Adding static artwork to an animation 03:24
Animated SWF: Controlling time within an animation 03:58
8. Workflow: Using Photoshop 17:13
Preserving slices and structure with PSD export 06:10
Working with Photoshop Smart Objects 04:35
Sharing color swatches between Illustrator and Photoshop 02:52
Generating an animated GIF file with Photoshop 03:36
9. Workflow: Using Dreamweaver 07:28
Exporting HTML from Illustrator for use in Dreamweaver 03:31
Exporting CSS and DIVs from an Illustrator layout 03:57
10. Workflow: Using Fireworks 12:37
Moving art between Illustrator and Fireworks 06:25
Using dynamic shapes from Fireworks 03:48
Sharing color swatches between Illustrator and Fireworks 02:24
11. Workflow: Using Flash Catalyst 16:07
Building files for use in Flash Catalyst 04:28
Creating a new Flash Catalyst project from an Illustrator file 03:40
Copying and pasting artwork between Illustrator and Flash Catalyst 02:04
Roundtrip editing between Illustrator and Flash Catalyst 03:36
Creating Flex skins for use in Flash Builder 02:19
12. Workflow: Using Flash Professional 19:48
Understanding symbols: The lifeblood of Flash 04:58
Symbols: Understanding 9-slice scaling 04:18
Setting text that will be used in Flash Professional 03:05
Moving artwork between Illustrator and Flash Professional 07:27
Conclusion 01:06
Goodbye 01:06