Autoplay
Autocomplete
Previous Lesson
Complete and Continue
UX + Web Design Master Course: Strategy, Design + Development
Course Overview: What You'll Learn
Welcome: Get Ready to Define, Design and Code! (2:32)
Download the BONUS 30-page Course Guidebook
Introduction to UX (3:23)
Definition: Planning for Success
Why Are We Doing This? (5:53)
Three Crucial Questions (You Must Ask) (1:17)
What's Worth Doing? (4:25)
What Are We Creating? (7:16)
What Value Does It Provide? (5:46)
SNACK BREAK: Who Are Your Users? (1:18)
Exercise: Determining Value & Strategic Opportunity (10:27)
Definition: Planning for Success Part II
It's Not Just About Users: The UX Value Loop (2:50)
Business Stakeholder Research (2:49)
Identifying Business Goals (13:30)
SNACK BREAK: What Are Your (or Your Client's) Business Goals? (1:01)
User Research: Putting People First (2:46)
Identifying User Needs (8:11)
Decision Paths: Connecting User Needs with Strategy (4:53)
Exercise: Create a Decision Path (4:28)
Introduction to Requirements (2:30)
Generating Meaningful Requirements (3:58)
Three Kinds of Requirements (6:27)
Documenting Requirements (4:47)
Determining Project Scope (2:57)
Controlling Scope Creep (6:38)
Exercise: Smart Project Scoping (6:41)
Definition: Planning for Success Part III
Planning for User Testing (3:59)
Creating a Test Plan: Who Are We Testing For? (3:22)
Prioritizing Device and Browser Support (2:49)
What to Test: Functionality (5:48)
What to Test: Usability (4:41)
What to Test: Errors and Exceptions (1:57)
What to Test: Compatibility (2:18)
What to Test: Performance (1:30)
What to Test: Security (2:30)
Definition Takeaways: Things to Remember (3:46)
Information Architecture: Creating a Solid Foundation
Information Architecture: Organizing Content and Flow (3:05)
What IS Information Architecture (IA)? (5:02)
Content Strategy: Identifying, Organizing and Delivering (5:52)
Determining Content Requirements (7:24)
Exercise: Identifying Content Workflows (9:42)
My Tips for Successful Information IA Modeling (12:50)
Creating and Prioritizing IA (3:30)
Content Labeling (7:40)
File Naming (7:08)
Grouping and Classifying Content (3:00)
Exercise: Determining Information Priority (5:50)
Information Architecture: Creating a Solid Foundation Part II
Exercise: Turning Information Priority into an IA Model (4:01)
IA Models: Which One's Right for My Site? (2:36)
Hierarchical Tree IA Model (1:05)
Nested List IA Model (0:55)
Hub and Spoke IA Model (1:03)
Bento Box IA Model (1:51)
Filtered View IA Model (1:12)
Combining IA Models (1:46)
Tools for Creating IA Models (3:39)
Socializing and Validating Your IA Model (8:21)
SNACK BREAK: Create an IA Model for Your Website (1:28)
Information Architecture: Creating a Solid Foundation Part III
Navigation Design (0:55)
Primary and Secondary Navigation (3:52)
Global and Local Navigation (4:15)
Navigation for Different User Types (4:34)
Validating Your Navigation Scheme (6:00)
Exercise: Determining Key Navigation Paths (10:12)
Wireframing 101 (1:45)
What a Wireframe ISN'T (5:05)
What a Wireframe IS (6:33)
My Tips for Creating Successful Wireframe Prototypes (12:16)
Creating Wireframes: Tools of the Trade (9:41)
SNACK BREAK: Try Creating a Basic Wireframe on Your Own (1:27)
Exercise: Creating a B2B Wireframe with Axure RP Pro (52:00)
Socializing and Validating Wireframes (5:35)
Information Architecture Takeaways: Things to Remember (4:42)
Design: Information, Interaction and Interface
"What's It Gonna Look Like?" An Introduction to Design (3:10)
Defining Appropriate User Interface (UI) Design (17:12)
How Definition and IA Inform UI Design (5:11)
Timeless UI Design Principles, Part 01 (13:11)
Timeless UI Design Principles, Part 02 (16:14)
Timeless UI Design Principles, Part 03 (12:45)
Timeless UI Design Principles, Part 04 (18:58)
SNACK BREAK: Identify Design Principles in an Existing UI (1:21)
Design: Information, Interaction and Interface Part II
My Tips for Solving Visual Problems (16:23)
Organizing Visual Information - Part 01 (17:20)
Organizing Visual Information - Part 02 (22:47)
Designing Appropriate Visual Hierarchy (27:57)
Designing for Audience Expectation (14:50)
Designing for Interaction (28:49)
Exercise: Create a UI Design for a B2B Website (50:11)
Exercise: Create a UI Design Layout for a WordPress Blog - Part 01 (13:21)
Exercise: Create a UI Design Layout for a WordPress Blog - Part 02 (11:17)
Exercise: Create a UI Design Layout for a WordPress Blog - Part 03 (15:29)
Exercise: Create a UI Design Layout for a WordPress Blog - Part 04 (28:00)
Exercise: Create a UI Design Layout for an Ecommerce Website (78:07)
SNACK BREAK: Evaluate Your UI Design (1:37)
Design Takeaways: Things to Remember (7:15)
Development - Building a B2B Website with HTML & CSS
Development: Coding, Customizing and Configuring (2:23)
Dreaming in Code: You've Got the Power! (3:10)
Hosting & Domain Considerations (3:53)
File Structure and FTP: Organizing & Uploading (7:33)
Basic HTML Structure: Building a Solid Foundation (3:50)
Tags, Elements and Attributes: Describing HTML Content (2:51)
What's In a Name? Titles and Headings (6:51)
Formatting Paragraphs: Creating and Styling Text Content (4:03)
Organizing Your Code: Using Indentation and Comments (3:43)
Creating Your First Web Page: Applying What You've Learned (4:35)
Content Elements – Hyperlinks: Getting from Here to There (3:04)
Content Elements – Unordered and Ordered Lists: Creating and Formatting (2:49)
Content Elements – Images: Adding Images and Defining Attributes (4:49)
Content Elements – Audio and Video: Adding Media to Your Web Page (7:16)
Font Styling: Defining Style, Color and Size (2:54)
Exercise: Adding Images, Unordered Lists and Hyperlinks (5:18)
CSS – Content Styling: Adding Good Skin to Good Bones (4:07)
CSS – Inline, Internal or External? Getting Smart (4:38)
CSS – Inheritance: Sharing Attributes Efficiently (3:16)
CSS – Background Color and Image: Creating Background Effects (3:49)
CSS – Font Color and Weight: Giving Text Impact and Emphasis (4:25)
CSS – Classes and Spans: Getting Specific with Styling (6:59)
CSS – Working with Divs: Dividing and Conquering with Classes and IDs (6:25)
CSS – Link Styling: Using Text Decoration (5:46)
Exercise – Creating a Navigation Menu: Leveraging CSS for Wayfinding (7:01)
Basic Table Structure: Organizing Content (7:39)
Styling Tables with CSS: Enhancing Communication and Readability (7:10)
Margins and Padding: Establishing Purposeful Negative Space (7:09)
Display and Positioning: What, Where and How (12:02)
The Box Model: The Parts and the Whole (4:43)
Float and Clear: Controlling Visual Flow (7:48)
Nested Layouts: Using Divs for Precision and Flexibility (8:39)
Forms: Creating Good Input (and Output) (15:05)
Creating Forms: Grouping Form Data (2:46)
Styling Forms with CSS: Creating Consistency and Usability (4:44)
Exercises: Build A B2B Website with HTML & CSS
Exercise: Create Your B2B Website Header (15:08)
Exercise: Create Your B2B Website Content (17:46)
Exercise: Create Your B2B Website Footer (9:11)
Exercise: Create Your B2B Web Page: Putting It All Together (4:32)
Browser Testing: Tips and Tools (4:36)
Development – WordPress Content Management System (CMS)
Installing WordPress Automatically: Using Your Hosting Provider's CPanel (2:56)
Installing WordPress Manually: Using an FTP Client (8:27)
The WordPress Dashboard: A Quick Tour of Features and Functions (5:56)
Posts vs. Pages: Creating Content in WordPress (5:27)
Categories: Organizing WordPress Content (5:25)
Tags: Adding Context To Your Posts (4:57)
Comments: Connecting and Managing Conversations (3:42)
Formatting Text: Using the WordPress Text Editor (5:50)
Adding Hyperlinks: Creating and Managing Links in WordPress (1:55)
Adding Images: Inserting and Managing Images in WordPress (5:32)
Adding Video: Inserting and Managing Video in WordPress (6:35)
Working with Plugins: Extending WordPress Features and Functions (8:19)
Exercise: Adding a Contact Form Plugin (12:14)
Using Widgets: Enhancing Your WordPress Layout (7:00)
Exercise: Adding a Widget (5:11)
Choosing a WordPress Theme: Finding, Evaluating and Installing (7:06)
Customizing Your Theme: Structure, Content and Appearance (5:13)
Creating Custom Menus: Replacing Theme Menus (6:58)
Using the Code Editor: Modifying Your WordPress Theme (5:50)
WordPress Settings: General, Reading, Writing and Permalinks (9:38)
Users and Roles: Assigning WordPress Access and Privileges (4:48)
WordPress Backup: Backing Up Your Blog and Database (3:18)
Updating WordPress: Automatic and Manual Updates (4:36)
Exercises: Build A Blog with WordPress
Exercise: Customizing Your Theme Header, Part 01 (8:13)
Exercise: Customizing Your Theme Header, Part 02 (8:49)
Exercise: Customizing Your Page Content (15:01)
Exercise: Customizing Your Footer (14:38)
Development - Ecommerce Website with WooCommerce
Installing WooCommerce (4:25)
Basic Settings: Getting Started with WooCommerce (4:26)
Product Settings: Configuring Products in WooCommerce (9:45)
Tax Settings: Configuring Sales Tax in WooCommerce (7:05)
Checkout Settings: Configuring Checkout Options in WooCommerce (5:22)
Shipping Settings: Configuring Shipping in WooCommerce (11:25)
Account Settings: Configuring Customer Accounts in WooCommerce (2:00)
Product Categories: Adding Product Categories in WooCommerce (3:18)
Adding Simple Products in WooCommerce (8:10)
Adding Variable Products in WooCommerce (5:50)
Adding Virtual and Downloadable Products in WooCommerce (7:02)
Adding Linked and Related Products in WooCommerce (4:18)
Creating Coupons: Configuring Special Offers in WooCommerce (6:23)
Customizing Email: Email Messaging Customization in WooCommerce (4:55)
Managing Orders with WooCommerce (4:21)
Managing Inventory with WooCommerce (2:07)
Reporting: Sales Reporting in WooCommerce (4:21)
Configuring Product Category Navigation in WooCommerce (3:41)
Exercises: Build An Ecommerce website with WooCommerce and WordPress
Exercise: Creating Your Storefront Home Page, Part 01 (11:51)
Exercise: Creating Your Storefront Home Page, Part 02 (12:58)
Exercise: Creating Your Storefront Home Page, Part 03 (12:04)
Exercise: Creating Your Storefront Home Page, Part 04 (6:45)
Exercise: Creating Your Category Landing Page (7:56)
Launch and Beyond
Prepare to Launch! Approval, Testing, Bugs and Beyond (4:26)
Pre-Launch Checklist: What to Do Before You Launch (8:34)
Bonus: Convincing Clients/Stakeholders to Include UX in Requirements Work (22:42)
CSS – Link Styling: Using Text Decoration
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in UX 365 to Unlock