Lynda.COM Illustrator CS5 Web and Interactive Design

Author:
Mordy Golding

Duration:
06h 20m

Released on:
9/24/2010

Exercise files:
Yes

Software works on:
Windows only


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
Welcome           01m 33s
Choosing Illustrator for web and interactive design           02m 54s
Illustrator and the web design workflow           02m 07s
Using the exercise files           00m 22s

1. Key Concepts and Settings
Pixel dimension vs. resolution           04m 14s
Pixel Preview mode and anti-aliasing           05m 39s
Taking charge of anti-aliasing           05m 27s
Choosing the right color management settings           07m 25s
Setting up important preferences           06m 22s
Setting up a workspace optimized for web design           11m 02s

2. Creating New Documents and Projects
Using the Web document profile           03m 39s
Creating custom document profiles           09m 38s
Using Illustrator's free web templates           02m 33s
Creating a sitemap or wireframe           02m 50s
Setting up an entire web site           09m 33s
Setting up a grid           10m 37s
Setting up an online ad campaign           08m 13s
Setting up icons for iOS           02m 24s
Setting up mobile content with Adobe Device Central           04m 38s

3. Working with Web Color
Understanding web-safe colors           11m 50s
Limiting the Color Guide to web-safe colors           04m 53s
Using Recolor Art to convert art to web-safe colors           04m 54s
Getting color inspiration from Adobe Kuler           06m 48s
Using Recolor Artwork to modify colors across a site           03m 57s

4. Optimizing Web Graphics
Using the Save for Web & Devices feature           06m 44s
Understanding the GIF file format and its settings           10m 20s
Understanding the JPEG file format and its settings           07m 39s
Understanding the PNG file format and its settings           03m 21s
Understanding the WBMP file format and its settings           01m 18s
Understanding the SWF file format and its settings           04m 13s
Understanding the SVG file format and its settings           03m 41s
Adjusting the dimensions of a graphic           04m 46s
Optimizing files to a specific file size           04m 05s
Modifying Save for Web & Devices output settings           06m 51s
Previewing content in Adobe Device Central           03m 56s

5. Working with Text
Setting point type in Illustrator           04m 11s
Setting area type in Illustrator           05m 20s
Formatting text quickly with paragraph styles           14m 39s
Overriding formatting with character styles           03m 02s
Controlling text anti-aliasing           04m 50s
Simulating the CSS box model           11m 14s
Adding cool reflections to text and graphics           08m 26s
Applying settings quickly with Graphic Styles           04m 24s

6. Working with Web Slices
Understanding the concept of slicing           03m 22s
Creating slices manually           04m 26s
Creating slices from guides           02m 45s
Creating slices from objects           07m 33s
Understanding the different slice types           04m 20s
Applying settings to slices           09m 20s
Creating hotspots with image maps           04m 10s

7. Creating SWF Files from Illustrator
Exporting static SWF files from Illustrator           03m 35s
Animated SWF: Converting Illustrator layers to SWF frames           04m 03s
Animated SWF: Using blends to define motion           08m 35s
Animated SWF: Adding static artwork to an animation           03m 24s
Animated SWF: Controlling time within an animation           03m 58s

8. Workflow: Using Photoshop
Preserving slices and structure with PSD export           06m 10s
Working with Photoshop Smart Objects           04m 35s
Sharing color swatches between Illustrator and Photoshop           02m 52s
Generating an animated GIF file with Photoshop           03m 36s

9. Workflow: Using Dreamweaver
Exporting HTML from Illustrator for use in Dreamweaver           03m 31s
Exporting CSS and DIVs from an Illustrator layout           03m 57s

10. Workflow: Using Fireworks
Moving art between Illustrator and Fireworks           06m 25s
Using dynamic shapes from Fireworks           03m 48s
Sharing color swatches between Illustrator and Fireworks           02m 24s

11. Workflow: Using Flash Catalyst
Building files for use in Flash Catalyst           04m 28s
Creating a new Flash Catalyst project from an Illustrator file           03m 40s
Copying and pasting artwork between Illustrator and Flash Catalyst           02m 04s
Roundtrip editing between Illustrator and Flash Catalyst           03m 36s
Creating Flex skins for use in Flash Builder           02m 19s

12. Workflow: Using Flash Professional
Understanding symbols: The lifeblood of Flash           04m 58s
Symbols: Understanding 9-slice scaling           04m 18s
Setting text that will be used in Flash Professional           03m 05s
Moving artwork between Illustrator and Flash Professional           07m 27s

Conclusion
Goodbye           01m 06s