Web Design | |||
0.1 Promo-Workflow | 00:03:00 | ||
0.2 What we will cover in this course | 00:03:00 | ||
Requirements to take this course | |||
1.1 Skills-and-apps-you-need-to-take-this-course auto generated | 00:02:00 | ||
1.2. Photoshop Extensions We Need | 00:07:00 | ||
Organizing your Web Design Project | |||
2.1 How To Organize A Design Project | 00:05:00 | ||
2.2 Client’s Sketches | 00:04:00 | ||
2.2 Naming Psd layers and Groups | 00:06:00 | ||
2.3.Naming Conventions To Help Developers | 00:03:00 | ||
Gathering project information from client | |||
3.1 Design Briefs | 00:10:00 | ||
3.3 Getting More Info On Project | 00:05:00 | ||
3.4 Content Template For Gathering Information | 00:03:00 | ||
Sketching, Wireframing, Atomic Design & 8point Grid system | |||
4.1 Mood boards | 00:06:00 | ||
4.2 Ideation Phase | 00:05:00 | ||
4.3 Introduction To Balsamiq | 00:10:00 | ||
4.4 Desining Wireframes Part 1 | 00:08:00 | ||
4.5 Desining Wireframes Part 2 | 00:14:00 | ||
4.6 Atomic Design | 00:08:00 | ||
4.7 8pt Grid | 00:09:00 | ||
Style Guides, colors and typographics scales | |||
5.1 Typeface And Color Combinations | 00:04:00 | ||
5.2 Ui Style Guides | 00:07:00 | ||
5.3 Examples Of Ui Style Guides | 00:03:00 | ||
5.4 How I Created My Style Guide | 00:07:00 | ||
5.5 Style Guide-Type Scale Explained | 00:03:00 | ||
5.6 Style Guide-Assignment | 00:01:00 | ||
Designing for Desktop/Large View (Wstudio Web Design Project) | |||
6.1 Online Tools For Grid Calculations | 00:13:00 | ||
6.2 Planning Your Grid | 00:05:00 | ||
6.3 White Space Plan | 00:06:00 | ||
6.4 Setting Up Artboard For Desktop Design | 00:07:00 | ||
6.5 Designing Header And Hero Part 1 | 00:12:00 | ||
6.6 Designing Header And Hero Part 2 | 00:09:00 | ||
6.7 Designing Steps Area Part 1 | 00:10:00 | ||
6.8 Designing Step Area Part 2 | 00:09:00 | ||
6.9. User Reviews Area Design | 00:09:00 | ||
6.10 Adjusting White Space And Vertical Rhythem | 00:06:00 | ||
6.11 Desining Team Part 1 | 00:11:00 | ||
6.12 Desining Team Part 2 | 00:07:00 | ||
6.13 Footer Design Part 1 | 00:08:00 | ||
6.14 Footer Design Part 2 | 00:11:00 | ||
Planning Responsive Web Design | |||
7.1 Responsive Design Considerations Part 1 | 00:06:00 | ||
7.2 Responsive Design Considerations Part 2 | 00:06:00 | ||
Designing for Tablet/Medium View (Wstudio Web Design Project) | |||
7.3.Establishing Grid For Tablets | 00:07:00 | ||
7.4.Header Area For Tablet View | 00:11:00 | ||
7.5.Section how it work – steps | 00:10:00 | ||
7.6.Section team Tablet View | 00:09:00 | ||
7.7 footer Design | 00:09:00 | ||
Designing for Mobile/Small View (Wstudio Web Design Project) | |||
8.1.mobile Artboard And Grids | 00:04:00 | ||
8.2.header Mobile View | 00:11:00 | ||
8.3.steps Section-mobile | 00:09:00 | ||
8.4.section 2 Team Members For Mobile | 00:09:00 | ||
8.5.footer And Final Adjustments | 00:08:00 | ||
Designing for Developers | |||
9.1.what Developes Needs To Know | 00:05:00 | ||
9.2.Red Line Document with Ink 1 | 00:10:00 | ||
9.3.Red Line Document with Ink 2 | 00:06:00 | ||
9.4.which layer styles you can use photoshop | 00:08:00 | ||
9.5.installing Using Zeplin | 00:10:00 | ||
9.6.style Guides With Zeplin | 00:14:00 | ||
9.7.tools-zeplin-avocode-1 | 00:04:00 | ||
9.8.avocode And Sympli | 00:06:00 | ||
Prototyping with Invision app | |||
10.1. What Are Prototypes | 00:04:00 | ||
10.2.getting Familiar With Invision App For Prototyping | 00:07:00 | ||
10.3.creating First Prototype With Invision App | 00:06:00 | ||
SVGs and Icon Fonts in Web Design | |||
11.1 using iconmoon app to create custom icon fonts set | 00:08:00 | ||
11.2 Using SVG in Web design | 00:11:00 | ||
Wordpress Training | |||
Introduction & installing Wordpress | |||
Course Outline | 00:02:00 | ||
Website Online Hosting | 00:10:00 | ||
Installing wordpress | 00:03:00 | ||
Installing wordpress theme ocean wp & elementor page builder | 00:02:00 | ||
Creating website pages & menu | 00:07:00 | ||
Wordpress page builder Familiarization | |||
Quick tour in Elementor | 00:04:00 | ||
Creative Art directions & layout inspirations for web design | 00:08:00 | ||
Familiarize with Elementor ( Sections ) | 00:16:00 | ||
Familiarize with Elementor ( widgets ) & Desiging them | 00:04:00 | ||
Brain storming & Tips for fast workflow with elementor | 00:10:00 | ||
Wordpress home page Design & development | |||
WordPress website header design & banner ( part 1 ) | 00:17:00 | ||
WordPress website header design & banner ( part 2 ) | 00:13:00 | ||
WordPress website header design & banner ( part 3 ) | 00:08:00 | ||
Features Section Design | 00:09:00 | ||
Png Section Design | 00:04:00 | ||
Email opt-in section | 00:11:00 | ||
Testmonials section design | 00:12:00 | ||
Image carousel section (slider) design | 00:10:00 | ||
WordPress Website Footer Design | 00:13:00 | ||
WordPress Customizer tour & website logo | 00:18:00 | ||
Finalizing our home page & design hints | 00:05:00 | ||
Wordpress About Us page Design & development | |||
About Us page Design ( part1 ) | 00:17:00 | ||
About Us page Design ( part2 ) | 00:18:00 | ||
About Us page Design ( part3 ) | 00:12:00 | ||
Wordpress Contact Us & blog page design & development | |||
Contact Us page & Blog Page Creation | 00:23:00 | ||
Creating WordPress Blog & Posting with Elementor | 00:21:00 | ||
Wordpress Responsive website & publishing website | |||
WordPress Mobile & Tablet Responsive Website | 00:21:00 | ||
Publishing wordpress website & creating maintance & coming soon pages | 00:09:00 | ||
Free Plugins to mimic the Elementor Pro | |||
Free plugins to Mimic the Elementor pro | 00:14:00 | ||
Exporting & importing our Elementor pages | |||
Exporting & Importing Elementor pages | 00:05:00 | ||
Creating Our Wordpress ecommerce store | |||
installing woocommerce plugin ( Ecommerce Section ) | 00:06:00 | ||
Making the first product (simple product) | 00:09:00 | ||
Making Variable products | 00:09:00 | ||
Up sells & cross sells Products | 00:04:00 | ||
Discount coupons | 00:06:00 | ||
Designing ecommerce store with elementor | 00:14:00 | ||
Wordpress website customization | |||
Converting WordPress Website to https | 00:04:00 | ||
Google Analytics & webmaster tool (SEO ranking) | 00:10:00 | ||
Speeding up our wordpress website | 00:13:00 | ||
Optimizing images & creative images Art directions | 00:11:00 | ||
Understanding subdomains | 00:06:00 | ||
Wordpress Website Backup, official email & more | |||
Website official email (domain email & device setup) | 00:05:00 | ||
Site back up & site lock trust seal English | 00:09:00 | ||
Course Certification | |||
Order Your Certificate QLS | 00:00:00 | ||
Assignment | |||
Assignment – Web Design and WordPress Training | 3 weeks, 5 days |
Membership renews after 12 months. You can cancel anytime from your account.