Please ensure Javascript is enabled for purposes of website accessibility
Illustrator: UI And Web Design Using Adobe Illustrator
0( 0 REVIEWS )
4h 7m

This course is designed for those interested in learning about web design using adobe illustrator.

Read more.
Course Skill Level
Time Estimate
4h 7m


Only want this course? Buy this course for $199 $29 and keep lifetime access. Click here

About This Course

Who this course is for:

  • This course is for beginners. Aimed at people new to the world of web and UI design. While no previous Illustrator experience is necessary.

What you’ll learn: 

  • You’ll learn to design a website with in Adobe Illustrator.
  • User Interface essentials.
  • 27 Completed files so you never fall behind.
  • Learn how to wire-frame at all levels
  • How to design for a responsive website.
  • Downloadable exercise files & cheat sheet.
  • Techniques used by professional website designers.
  • Professional workflows and shortcuts.
  • A wealth of other resources and websites to help your new career path.


  • You’ll need a copy of Adobe Illustrator CC 2017 or above. A free trial can be downloaded from Adobe.
  • No previous design skills are needed.
  • No previous Illustrator skills are needed.

UI design skills are one of the most employable opportunities of our lifetime. In this course, you’ll learn how to design a professional website in Adobe Illustrator. We’ll start right at the basics of Illustrator and work our way through to building professional UI designs. This course doesn’t cover how to code a website but focuses on the design processes that professional UI designers use when working.

This is a project-based class for students who are new to the world of app & web design. I created this for people nervous about changing their careers into the world of user interface design.

We’ll build a professional portfolio website. You can use this course to build your own portfolio website (the one you’ve been putting off for years). You’ll learn how to design desktop, tablet and mobile versions of your website. You’ll learn what you’ll need to deliver at the end of a project to your client.

This course is for people serious about becoming a User Interface design professional.

Now it’s time to upgrade your skills, get that better job, and impress your clients.

Our Promise to You
By the end of this course, you will have the knowledge about web design using Adobe Illustrator.

10 Day Money Back Guarantee. If you are unsatisfied for any reason, simply contact us and we’ll give you a full refund. No questions asked.

Get started today and develop your skill on web design using Adobe Illustrator!

Course Curriculum

Section 1 - Overview
Introduction 00:00:00
Am I A UI UX Designer Now? 00:00:00
UI Design Photoshop vs Illustrator vs Sketch vs InDesign vs Adobe XP 00:00:00
What Is Illustrator’s Role When Designing A Website 00:00:00
Section 2 - Getting Started
Download The Exercise Files, Completed Files & Cheat Sheet 00:00:00
Getting Your Workspace & Illustrator Preferences Ready For UI Work 00:00:00
Section 3 - Planning
Sitemap vs Wireframe 00:00:00
Creating A Sitemap In Illustrator CC 2017 00:00:00
Section 4 - Setting Up Your First Pages
What Screen Sizes To Use For Desktop, Tablet, And Mobile Web Design 00:00:00
What Is A Grid System & Responsive Mobile & Tablet Design 00:00:00
How To Make A Responsive 12 Column Grid In Illustrator 00:00:00
Section 5 - It All Begins With Wireframing
Creating A Wireframe – Low Fidelity – Hand Drawn 00:00:00
Creating A Wireframe – High Fidelity – Illustrator 00:00:00
Creating The Tablet And Mobile Wireframes In Illustrator 00:00:00
Section 6 - Designing Your First Page
Inspiration For Your Web Design 00:00:00
Starting Your Web Design Using Illustrator Templates 00:00:00
Bring In Your Vector Logo To The Layout 00:00:00
Section 7 - Color
Using Adobe Color 00:00:00
Matching Brand Colors Using Adobe Illustrator 00:00:00
Section 8 - Fonts
Using The Right Web Fonts Google Fonts & Typekit 00:00:00
Production Video – Finalizing Nav, Hero Box And Fonts 00:00:00
Section 9 - Images
Free vs Royalty Free Images 00:00:00
Adding Linking Cropping & Masking Images In Illustrator 00:00:00
Washing Out Images In Illustrator With Coloured Background 00:00:00
How To Use Layers In Illustrator CC 2017 00:00:00
Section 10 - Creating Symbols & Icons
Using The Adobe Market For Free Icons 00:00:00
Using Icon Finder For Free Website UI Social Icons 00:00:00
Align & Distribute Icons In Illustrator For Web Design 00:00:00
How To Adjust Vector Shapes In Illustrator CC 2017 00:00:00
Creating Custom Icons & Logos Using The Shape Builder Tool In Illustrator CC 2017 00:00:00
Drawing Icons & Logos In Illustrator Using The Pen Tool 00:00:00
Section 11 - Creating Mobile & Tablet Versions Websites
Creating A Tablet Version Of Our UI Web Design In Illustrator CC 2017 00:00:00
Creating A Mobile Responsive UI Website Design In Illustrator CC 2017 00:00:00
Section 12 - Exporting
Export Your Full Page Web UI Mockups From Illustrator CC 2017 00:00:00
Should I Be Using SVG Export In Illustrator CC 2017 For Web Design 00:00:00
Exporting Images And Pictures From Illustrator CC 2017 For Web 00:00:00
Exporting Logos And Icons From Illustrator 2017 For UI 00:00:00
Retina – HiDPI And Responsive Image Export From Illustrator CC 2017 00:00:00
Exporting Your UI For App Design Using Illustrator CC 2017 00:00:00
Exporting CSS For Developers Using Adobe Illustrator CC 2017 00:00:00
Section 13 - Working As UI Designers
Learning The Language Of UI User Interaction Design 00:00:00
How To Get Your First Work As A UI Designer 00:00:00
Section 14 - Next Steps
Next Steps To Becoming An Amazing Ui Designer 00:00:00
Your First Project – Adobe Illustrator CC 2017 00:00:00
Section 15 - Cheat Sheet
Cheat Sheet – Adobe Illustrator CC 2017 00:00:00

Are you interested in higher education?

We’re working on a service to connect learners with higher education programs, enter your name and email to join the waitlist

You’ve been added to the waitlist!

Keep an eye out for the announcement via email.

You’ll be the first to know.



Enter your Name and Email for a chance to win Lifetime Access to all courses!
Promotion ends today.



Enter your Name and Email for a chance to win Lifetime Access to all courses!
Promotion ends today.

Success! You are now entered to win lifetime access to all courses. Winners are selected at the beginning of each month. 

P.S. Look out for our exclusive sales only shown to students on our email list!