UX & Web Design Master Course: Strategy, Design, Development

UX & Web Design Master Course: Strategy, Design, Development

English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 23.5 Hours | 5.21 GB

Learn how to apply User Experience (UX) principles to your website designs, code a variety of sites, and increase sales!

This course will teach you everything you need to know about UX, including design, content, and coding. And you’ll learn from the ground up, so it doesn’t matter how much experience you have when you start.

You’ll be exposed to principles and strategies, but, more importantly, you’ll learn how to actually apply these abstract concepts by coding three different websites for three very different audiences.

Improve Your Website with UX Strategies

  • Apply UX strategies to a site’s content & design
  • Understand Information Architecture to enhance the content on your website
  • Know what dictates how your website should look
  • Design and code a B2B website, a B2C blog, and an ecommerce site

Understand UX and Learn How to Develop Winning Websites

This course will help you stand out as a web designer, teaching you how to apply User Experience (UX) strategies that will make every site you build useful, usable, and valuable.

Reinforce what you’re learning using the bonus 30-page downloadable UX Guidebook. Filled with exercises and activities, the UX Guidebook is a great tool to reference as you progress through the course, or while developing your own custom sites.

You’ll also get hands-on experience designing and coding three different types of sites. This will give you the confidence to pursue similar projects if you’re already a website designer, if you want to get into web design, or if you want to enhance your current business site.

Contents and Overview

Even if you’re a complete beginner, this course will show you how to make a website functional, attractive and successful. It will walk you through all of the steps required to enhance the User Experience on any site, right down to the code, content, and design.

You’ll begin by defining who your website users are and what they expect from the website. You’ll also learn how business goals — yours or your client’s — have to be uncovered and addressed for site success.

You’ll learn what questions to ask both groups, and you’ll use the answers to inform your content and design decisions.

Next, you’ll dig into Information Architecture (IA), which looks at the content on your website, how you should categorize it, what you should call it, and more.

This will lay the foundation on which you can further build out your website to make users flock to it, stay on it, and hopefully make purchases.

Plus, you’ll tackle how to design your website depending upon who your visitors are, whether your website is B2B (business-to-business), B2C (business-to-consumer), or an ecommerce site for selling products online.

Different audiences have different needs, so learning what your target user expects from your site means you’ll be able to design and build a site that meets those expectations and leads to greater conversions.

In addition to knowing what you need to put into your website to make it stand out from the crowd, you’ll also learn how to identify and remove UX- and UI-related obstacles.

The ability to see and solve these problems will ensure every website you build moving forward will be useful, usable and valuable to the people who use it.

Most importantly, you’ll then learn how to actually build and code these types of sites using HTML, CSS, WordPress, and more.

You’ll not only know how to effectively design B2B, B2C, and ecommerce sites, but you’ll also know exactly how to develop these sites, from start to finish.

By the end of this course, you’ll have an in-depth understanding of UX and web design, as well as the tools to develop a variety of sites with the right code.

You’ll know why UX is so important to both users and businesses, what content is needed on a site, what UI design is appropriate, and how to transform your vision into a fully functional website using the most effective tools available.

What you’ll learn

  • A clear understanding of the principles and benefits of good UX and how to apply it to your website
  • A strategy for making sure you know what people need from your website, and what you or your client needs from it in order to succeed
  • The confidence to know what information should be included in your website, and how to design it to increase conversions
  • The ability to code a variety of websites with HTML, CSS, WordPress, and other tools
Table of Contents

Course Overview
1 Welcome Get Ready to Define, Design and Code!
2 Download the BONUS 30-page Course Guidebook
3 Introduction to UX

Definition Planning for Success
4 Why Are We Doing This
5 Three Crucial Questions (You Must Ask)
6 What’s Worth Doing
7 What Are We Creating
8 What Value Does It Provide
9 SNACK BREAK Who Are Your Users
10 Exercise Determining Value & Strategic Opportunity

Definition Planning for Success Part II
11 It’s Not Just About Users The UX Value Loop
12 Generating Meaningful Requirements
13 Three Kinds of Requirements
14 Documenting Requirements
15 Determining Project Scope
16 Controlling Scope Creep
17 Exercise Smart Project Scoping
18 Business Stakeholder Research
19 Identifying Business Goals
20 SNACK BREAK What Are Your (or Your Client’s) Business Goals
21 User Research Putting People First
22 Identifying User Needs
23 Decision Paths Connecting User Needs with Strategy
24 Exercise Create a Decision Path
25 Introduction to Requirements

Definition Planning for Success Part III
26 Planning for User Testing
27 Definition Takeaways Things to Remember
28 Creating a Test Plan Who Are We Testing For
29 Prioritizing Device and Browser Support
30 What to Test Functionality
31 What to Test Usability
32 What to Test Errors and Exceptions
33 What to Test Compatibility
34 What to Test Performance
35 What to Test Security

Architecture Creating a Solid Foundation
36 Information Architecture Organizing Content and Flow
37 Grouping and Classifying Content
38 Exercise Determining Information Priority
39 What IS Information Architecture (IA)
40 Content Strategy Identifying, Organizing and Delivering
41 Determining Content Requirements
42 Exercise Identifying Content Workflows
43 My Tips for Successful Information IA Modeling
44 Creating and Prioritizing IA
45 Content Labeling
46 File Naming

Architecture Creating a Solid Foundation Part II
47 Exercise Turning Information Priority into an IA Model
48 Socializing and Validating Your IA Model
49 SNACK BREAK Create an IA Model for Your Website
50 IA Models Which One’s Right for My Site
51 Hierarchical Tree IA Model
52 Nested List IA Model
53 Hub and Spoke IA Model
54 Bento Box IA Model
55 Filtered View IA Model
56 Combining IA Models
57 Tools for Creating IA Models

Architecture Creating a Solid Foundation Part III
58 Navigation Design
59 My Tips for Creating Successful Wireframe Prototypes
60 Creating Wireframes Tools of the Trade
61 SNACK BREAK Try Creating a Basic Wireframe on Your Own
62 Exercise Creating a B2B Wireframe with Axure RP Pro
63 Socializing and Validating Wireframes
64 Architecture Takeaways Things to Remember
65 Primary and Secondary Navigation
66 Global and Local Navigation
67 Navigation for Different User Types
68 Validating Your Navigation Scheme
69 Exercise Determining Key Navigation Paths
70 Wireframing 101
71 What a Wireframe ISN’T
72 What a Wireframe IS

Design Information, Interaction and Interface
73 What’s It Gonna Look Like An Introduction to Design
74 Defining Appropriate User Interface (UI) Design
75 How Definition and IA Inform UI Design
76 Timeless UI Design Principles, Part 01
77 Timeless UI Design Principles, Part 02
78 Timeless UI Design Principles, Part 03
79 Timeless UI Design Principles, Part 04
80 SNACK BREAK Identify Design Principles in an Existing UI

Design Information, Interaction and Interface Part II
81 My Tips for Solving Visual Problems
82 Exercise Create a UI Design Layout for a WordPress Blog – Part 03
83 Exercise Create a UI Design Layout for a WordPress Blog – Part 04
84 Exercise Create a UI Design Layout for an Ecommerce Website
85 SNACK BREAK Evaluate Your UI Design
86 Design Takeaways Things to Remember
87 Organizing Visual Information – Part 01
88 Organizing Visual Information – Part 02
89 Designing Appropriate Visual Hierarchy
90 Designing for Audience Expectation
91 Designing for Interaction
92 Exercise Create a UI Design for a B2B Website
93 Exercise Create a UI Design Layout for a WordPress Blog – Part 01
94 Exercise Create a UI Design Layout for a WordPress Blog – Part 02

Development – Building a B2B Website with HTML & CSS
95 Development Coding, Customizing and Configuring
96 Creating Your First Web Page Applying What You’ve Learned
97 Content Elements – Hyperlinks Getting from Here to There
98 Content Elements – Unordered and Ordered Lists Creating and Formatting
99 Content Elements – Images Adding Images and Defining Attributes
100 Content Elements – Audio and Video Adding Media to Your Web Page
101 Font Styling Defining Style, Color and Size
102 Exercise Adding Images, Unordered Lists and Hyperlinks
103 CSS – Content Styling Adding Good Skin to Good Bones
104 CSS – Inline, Internal or External Getting Smart
105 CSS – Inheritance Sharing Attributes Efficiently
106 Dreaming in Code You’ve Got the Power!
107 CSS – Background Color and Image Creating Background Effects
108 CSS – Font Color and Weight Giving Text Impact and Emphasis
109 CSS – Classes and Spans Getting Specific with Styling
110 CSS – Working with Divs Dividing and Conquering with Classes and IDs
111 CSS – Link Styling Using Text Decoration
112 Exercise – Creating a Navigation Menu Leveraging CSS for Wayfinding
113 Basic Table Structure Organizing Content
114 Styling Tables with CSS Enhancing Communication and Readability
115 Margins and Padding Establishing Purposeful Negative Space
116 Display and Positioning What, Where and How
117 Hosting & Domain Considerations
118 The Box Model The Parts and the Whole
119 Float and Clear Controlling Visual Flow
120 Nested Layouts Using Divs for Precision and Flexibility
121 Forms Creating Good Input (and Output)
122 Creating Forms Grouping Form Data
123 Styling Forms with CSS Creating Consistency and Usability
124 File Structure and FTP Organizing & Uploading
125 Basic HTML Structure Building a Solid Foundation
126 Tags, Elements and Attributes Describing HTML Content
127 What’s In a Name Titles and Headings
128 Formatting Paragraphs Creating and Styling Text Content
129 Organizing Your Code Using Indentation and Comments

Exercises Build A B2B Website with HTML & CSS
130 Exercise Create Your B2B Website Header
131 Exercise Create Your B2B Website Content
132 Exercise Create Your B2B Website Footer
133 Exercise Create Your B2B Web Page Putting It All Together
134 Browser Testing Tips and Tools

Development – WordPress Content Management System (CMS)
135 Installing WordPress Automatically Using Your Hosting Provider’s CPanel
136 Adding Images Inserting and Managing Images in WordPress
137 Adding Video Inserting and Managing Video in WordPress
138 Working with Plugins Extending WordPress Features and Functions
139 Exercise Adding a Contact Form Plugin
140 Using Widgets Enhancing Your WordPress Layout
141 Exercise Adding a Widget
142 Choosing a WordPress Theme Finding, Evaluating and Installing
143 Customizing Your Theme Structure, Content and Appearance
144 Creating Custom Menus Replacing Theme Menus
145 Using the Code Editor Modifying Your WordPress Theme
146 Installing WordPress Manually Using an FTP Client
147 WordPress Settings General, Reading, Writing and Permalinks
148 Users and Roles Assigning WordPress Access and Privileges
149 WordPress Backup Backing Up Your Blog and Database
150 Updating WordPress Automatic and Manual Updates
151 The WordPress Dashboard A Quick Tour of Features and Functions
152 Posts vs. Pages Creating Content in WordPress
153 Categories Organizing WordPress Content
154 Tags Adding Context To Your Posts
155 Comments Connecting and Managing Conversations
156 Formatting Text Using the WordPress Text Editor
157 Adding Hyperlinks Creating and Managing Links in WordPress

Exercises Build A Blog with WordPress
158 Exercise Customizing Your Theme Header, Part 01
159 Exercise Customizing Your Theme Header, Part 02
160 Exercise Customizing Your Page Content
161 Exercise Customizing Your Footer

Development – Ecommerce Website with WooCommerce
162 Installing WooCommerce
163 Adding Variable Products in WooCommerce
164 Adding Virtual and Downloadable Products in WooCommerce
165 Adding Linked and Related Products in WooCommerce
166 Creating Coupons Configuring Special Offers in WooCommerce
167 Customizing Email Email Messaging Customization in WooCommerce
168 Managing Orders with WooCommerce
169 Managing Inventory with WooCommerce
170 Reporting Sales Reporting in WooCommerce
171 Configuring Product Category Navigation in WooCommerce
172 Basic Settings Getting Started with WooCommerce
173 Product Settings Configuring Products in WooCommerce
174 Tax Settings Configuring Sales Tax in WooCommerce
175 Checkout Settings Configuring Checkout Options in WooCommerce
176 Shipping Settings Configuring Shipping in WooCommerce
177 Account Settings Configuring Customer Accounts in WooCommerce
178 Product Categories Adding Product Categories in WooCommerce
179 Adding Simple Products in WooCommerce

Exercises Build An Ecommerce website with WooCommerce and WordPress
180 Exercise Creating Your Storefront Home Page, Part 01
181 Exercise Creating Your Storefront Home Page, Part 02
182 Exercise Creating Your Storefront Home Page, Part 03
183 Exercise Creating Your Storefront Home Page, Part 04
184 Exercise Creating Your Category Landing Page

Launch and Beyond
185 Prepare to Launch! Approval, Testing, Bugs and Beyond
186 Pre-Launch Checklist What to Do Before You Launch
187 Bonus Convincing ClientsStakeholders to Include UX in Requirements Work