- Introduction
- Am I a UI UX designer now?
- UI Design Photoshop vs Illustrator vs Sketch vs InDesign vs Adobe XP
- What is Illustrator’s role when designing a website
Beginner
Online
4 Hours
₹ 449 3,499
Quick facts
particular | details | |
---|---|---|
Medium of instructions
English
|
Mode of learning
Self study
|
Mode of Delivery
Video and Text Based
|
Course and certificate fees
Fees information
certificate availability
certificate providing authority
The syllabus
Overview
Getting started
- Download the exercise files, completed files & cheat sheet
- Getting your workspace & Illustrator preferences ready for UI work
Planning
- What is the difference between a sitemap and a wireframe?
- Creating a sitemap in Illustrator
Setting up your first pages
- What screen sizes to use for desktop, tablet & mobile web design
- What is a grid system & responsive mobile & tablet design
- How to make a responsive 12 column grid in Illustrator
It all begins with Wireframing
- Creating a wireframe - Low fidelity - hand drawn
- Creating a wireframe - High Fidelity - Illustrator
- Creating the Tablet and Mobile wireframes in Illustrator
Designing your first page
- Inspiration for your web design
- Starting your web design using Illustrator templates
- Bring in your vector logo to the layout
Color
- Color.Adobe.com
- Matching brand colors using Adobe Illustrator
Fonts
- Using the right web fonts Google Fonts & Typekit
- Production video - finalising nav, hero box and fonts
Images
- Free vs Royalty Free images
- Adding Linking Cropping & Masking images in Illustrator
- Washing out images in Illustrator with with coloured background
- How to use layers in Illustrator 2017
Creating symbols & icons
- Using the Adobe Market for free icons
- Using Icon finder for free website UI social icons
- Align & distribute icons in Illustrator for web design
- How to adjust vector shapes in Illustrator
- Creating custom icons & logos using the shape builder tool in Illustrator
- Drawing icons & logos in Illustrator using the pen tool
Creating mobile & tablet versions of websites
- Creating a tablet version of our UI web design in Illustrator
- Creating a mobile responsive UI website design in Illustrator 2017
Exporting
- Export your full page web ui mockups from Illustrator 2017
- Should I be using SVG export in Illustrator 2017 for web design
- Exporting images and pictures from Illustrator 2017 for web
- Exporting logos and icons from Illustrator 2017 for UI
- Retina - HiDPI and responsive image export from Illustrator 2017
- Exporting your UI for App design using Illustrator 2017
- Exporting CSS for developers using Adobe Illustrator 2017
Working as a UI designer
- Learning the language of UI user interaction design
- How to get your first work as a UI designer
Next steps
- Next steps to becoming an amazing UI designer
- Your first project
Cheat Sheet
- Cheat Sheet
Articles
Popular Articles
Latest Articles
Similar Courses
User Experience Design And Research
UM–Ann Arbor via Futurelearn
Angular7 for Beginners
Great Learning
Front End Development CSS
Great Learning
Joomla for Beginners
Udemy
Joomla 3 Template Design
Udemy
User Interface Personalization
Georgia Tech via Edx
Express Bootcamp for Front End Development
Board Infinity
Angular JS
Board Infinity
Web Scraping for beginners
Board Infinity
Courses of your interest
C++ Foundation
PW Skills
Data Science Foundations to Core Bootcamp
Springboard
Data Analysis with Excel for Complete Beginners
CloudSwyft Global Systems, Inc via Futurelearn
Artificial intelligence Design and Engineering wit...
CloudSwyft Global Systems, Inc via Futurelearn
Data Science Fundamentals on Microsoft Azure
CloudSwyft Global Systems, Inc via Futurelearn
Artificial Intelligence Projects
Great Learning
Software Testing Tutorial
Great Learning