Skip to main content

Watch Preview

Designing Websites in Illustrator: Effective Workflow

with Brian Wood

Log in or Sign up for FREE and get full access to these and thousands of other Open Lessons in our catalog! Watch 2 Lessons For Free

  •   02 Getting Started

    08:03
  •   03 Set up your Design Document and Layout Grid

    11:58

Class duration: 2h 25m

See all 11 lessons
  • 7K students

    100% satisfaction guaranteed

  • 100% recommended

    8 student reviews

  • Access anytime

    OFFLINE SYNC WITH iOS APPS

Get the Pass

starting at $25 $13/month*

$299 $149/year or $39/month

Unlock this class plus 1500+ more >

Watch Now

You already have access!

Buy Class

$29

About The Class

designing sites with illustrator


Get a complete overview of your options for designing websites with an assist from Adobe Illustrator in this web design class with Brian Wood.

Brian is a veteran web developer and educator and Designing Websites in Adobe Illustrator: Effective Workflow, he’ll help you understand the state of the web today and review your best options for designing for it. 

You’ll learn how to:


  • Create a working mockup
  • Design with hosted web fonts 
  • Add dynamic buttons
  • Use styles and symbols to simplify your process

Discover just how much you’ll want to integrate Adobe Illustrator into your web design workflow and best practices for using Adobe Illustrator’s features and functions for wireframes and designs.


There are endless options when designing for the web – learn to how Illustrator can help in Designing Websites in Adobe Illustrator: Effective Workflow with Brian Wood.


Software Used: Adobe Illustrator CC 2014


Lesson Plan

  1. 01

    Understanding the "Responsive" Web Today

    15:26
  2. 02

    Getting Started

    08:03
  3. 03

    Set up your Design Document and Layout Grid

    11:58
  4. 04

    Setting up Artboards to Mock up Device Sizes

    05:51
  5. 05

    Work with the Pixel Grid, Live Shapes, Pixel Precision

    10:44
  6. 06

    Design with Web Fonts

    21:47
  7. 07

    Using Styles and Symbols to Make your Life Easier

    22:46
  8. 08

    Mocking up Dynamic Buttons

    12:09
  9. 09

    Working with Frameworks

    05:23
  10. 10

    Work with Raster Images

    16:02
  11. 11

    Create a "Working" Mock Up with MarvelApp

    15:49

Meet Your Expert

Brian Wood

Brian Wood is a web developer, the author of 14 books, including Adobe Muse CC Classroom in a Book and Adobe Illustrator CC 2018 Classroom in a Book. The author of numerous training titles including Muse, Dreamweaver, InDesign, Illustrator and more. ... read more

See instructor's Classes

Bonus Material

Access your course materials here!

Get access to exclusive bonus content when you purchase this class.

  • pdf Adobe Illustator Workflow-Links.pdf

100% of students recommend this class.
See what some of them have to say.

  • user-ef521b

    November 2017

    Quick introduction to Illustrator's website prototyping use. What I needed for better understanding of designing for retina screens, designing at pixel level, smart guides, and wireframes. I like the real-world suggestions for how to show website plan to clients efficiently. Hope to find the next course on best practices in exporting website from AI.

  • Creativelive Student

    Creativelive Student

    June 2017

    wonderful thank you

  • Nikkita Cohoon

    Nikkita Cohoon

    June 2015

    The class was very useful and offered a number of tricks and techniques I found useful. The PDF mentioned appears to be missing, and I think there should have been a video that touches on best practices for exporting.

    Similar classes you might like

    You know who’d love this class...?

    When gift-spiration strikes, grab it. Give this class to a friend who’d love it. For their birthday or just because. (Or just because you missed their birthday.)

    GIFT THIS CLASS