samcx.com
4.43 out of 5
4.43
15 reviews on Udemy

Adobe XD for Web Design: Essential Principles for UI & UX

Learn Responsive Web Design, UI & UX Principles, Prepare The Design For Coding, Increasing Sales via A Great Design
Instructor:
Cristian Doru Barin
168 students enrolled
English [Auto]
Design modern websites in Adobe XD
Learn the principles of UI & UX
Create beautiful designs for real companies
Learn how to prepare a design for coding

Create beautiful and responsive website designs in Adobe XD. This course will show you how you can design a beautiful website from scratch without any previous experience. Here’s what’s included:

  • essential exercises that will teach you how to work like a professional;

  • a complete web design project, from start to finish, both the desktop version and the responsive version;

  • how to prepare the design for coding;

  • how to understand what clients want & how to help them achieve their goals;

  • UI & UX principles that will help you design any website, no matter the style or client.

I made this course for anyone interested in web design – from beginners to professionals, from designers to coders, from business owners to someone who’s looking to start a new career or earn some money.

Adobe XD is the next big thing in terms of design tools. It makes you look like a professional designer even if you’re just a beginner. Start right now and take your designs to another level. At the end of this course, you’ll have a beautiful project for your portfolio, but also a deep understanding of what makes a website design successful.

Also included:

  • access to a community of over 10.000 students who are learning the same thing – chat in real time with them!

  • my mini e-books with my best advice for beginners;

  • access to a Facebook group of over 15.000 designers;

  • unlimited access to the course & you can watch it as many times as you want;

Getting Started with Web Design

1
Introduction
2
Quick answers to popular questions
3
Web design - what you need to know
4
How to select layers like a professional designer
5
Exercise practice your selecting
6
Here’s what coders do with our designs
7
Exercise: Test your skills & attention to detail
8
Solving the previous exercise
9
The three keys to becoming a great web designer

Our First Complete Responsive Website Design Project

1
Download all the resources here
2
The most important question when starting a new project
3
How to research/find inspiration for your project
4
Set up the most important part of the layout
5
Create the top bar
6
How to choose fonts for your project
7
How to choose beautiful colors
8
Organize the top bar
9
Create the structure for the header
10
Set a style for the header
11
Attention to detail in the header
12
Building a great hero area
13
Redesign the categories menu
14
How to display all the product details in a grid
15
Here’s how you find the best layout for the grid of products
16
Create the first version of the product card
17
The second version of the product card
18
The third version of the product card
19
How to design a clean and modern FAQ section
20
Create a newsletter sign up form
21
How to design a beautiful footer
22
Final variation and thoughts about the homepage
23
DOWNLOAD THE FINAL PROJECT HERE

How To Create Interior Pages

1
Analysing how we can improve the product page
2
Setting up the layout for the top part of the product page
3
How to organize lots of information in the product’s page
4
How to add small details that make a difference
5
How to handle large quantities of text
6
Creating the sidebar

How to Create A Responsive Design

1
Introduction to the mobile version
2
How to start the mobile version for the homepage
3
How to adjust the top bar for the mobile version
4
Here’s how you create the header for the mobile version
5
Modify the hero area & categories for the mobile version
6
Improve the navigation for the mobile experience
7
Create a grid of products suited for the mobile version
8
Finishing the grid of products – mobile version
9
Make the text easy to read in the FAQ section
10
How to make the newsletter form fit the mobile version
11
Make a new layout for the footer
12
Conclusions: e-commerce mobile version

Responsive Design for Interior Pages

1
The mobile version for the product’s page
2
Create the mobile structure for the product’s page
3
How to style items in terms of their importance
4
Create a variation to improve sales
5
10% more work for 50% better results
6
Create another layout for the product’s page
7
Make a smarter structure for the mobile version
8
Create the reviews and nutritional tabs
9
Adding small details that matter
10
Checking the design on a real phone
11
Incredible variations in no time at all

Prepare the Design for Coding

1
Preparing the design for coding
2
How to give the coder what he needs from Adobe XD
3
How to prepare graphics for coding
4
Server-side content and multi-layer graphics
5
Getting up and running with Zeplin
6
Best way to handle assets for the coders
7
Here’s why it’s essential you deliver what’s needed
8
How the coder sees the projects

The First Key to Becoming a Great Web Designer

1
The first pillar of web design
2
Best settings for a web design project
3
Case study: Non-standard layouts
4
Exercise: Create a standard website layout
5
How to size your web elements correctly
6
My formula for perfect text
7
Case study: text layers
8
Color Contrast
9
Case study: Colors – Part 1
10
Case study: Colors – Part 2
11
How to align elements in the hero area
12
3 rules for web design icons
13
Case Study: Visual Balance
14
Thoughts on the first pillar of web design

The Second Key to Becoming a Great Web Designer

1
Introduction
2
What’s the point of the website?
3
The user versus the business owner
4
Analytics in Web Design
5
Templates & Website Builders – The web designer’s death?
6
Case Study: 4 versions of the same website
7
E-commerce homepage layout
8
E-commerce product details
9
E-commerce checkout
You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.4
4.4 out of 5
15 Ratings

Detailed Rating

Stars 5
6
Stars 4
6
Stars 3
1
Stars 2
0
Stars 1
0
Get on Udemy
30-Day Money-Back Guarantee

Includes

10 hours on-demand video
2 articles
Full lifetime access
Access on mobile and TV
Certificate of Completion
Adobe XD for Web Design: Essential Principles for UI & UX
Category:
Design
Teacher
Daniel W
Price:
$218.98 $169
Get Course

Community

For Professionals

  • List Item #1
  • List Item #2
  • List Item #3

For Businesses

  • List Item #1
  • List Item #2
  • List Item #3

We support Sales, Marketing, Account Management and CX professionals. Learn new skills. Share your expertise. Connect with experts. Get inspired.

Linkedin Twitter Facebook

Community

Partnership Opportunities

  • Sponsorships
  • Advertise with us
  • List your Business
  • List your Event
  • List your Course

Company Information

  • About Us
  • Newsroom
  • Careers
  • Our Services
  • Contact us
Contribute now
Layer 1
samcx.com
Logo
Register New Account
Compare items
  • Total (0)
Compare
0