Adobe Xd Masterclass

Tags: Adobe XD

Learn the next big thing - Adobe XD! You'll look like a superstar designer, even if you're a beginner!

Last updated 2022-01-10 | 4.7

- Use Adobe XD like a professional
- Advanced design techniques for modern projects
- Make your designs interactive by creating prototypes

What you'll learn

Use Adobe XD like a professional
Advanced design techniques for modern projects
Make your designs interactive by creating prototypes
Everything you need to know about Adobe XD
How to create awesome UI work and how to design for great UX

* Requirements

* Adobe XD (which is free)
* Windows 10 - Adobe XD doesn't work on Windows 7 or 8

Description

Adobe XD is the next big thing in the design industry! Learn how to use it to create better designs, impress your work colleagues or your boss, start a new business, or charge more for your freelancing projects.

Note: Adobe XD is totally free but it doesn't work on Windows 7 or 8!

This training is perfect for people of all levels. It doesn't matter if you're a long-time Photoshop user, an Illustrator enthusiast or you're just getting started. Adobe XD will make you a better UI & UX designer. Here's what you'll learn:

  • The fundamentals of Adobe XD - how to get up and running with it;

  • How to use Adobe XD's advanced features;

  • Design beautiful UI (user interface) projects: websites, mobile apps, presentations of all sorts;

  • Learn how to apply UX (user experience) principles without getting overwhelmed by loads of theory;

  • Create interactive prototypes that will impress clients;

  • Help your clients make more money by making key design changes to their websites;

Who is this training program for?

  • Anybody that wants to learn about the next big thing in the design world;

  • People who are not happy with Photoshop's performance - it's so slow sometimes!

  • Web designers who want to make more money from their projects;

  • People who need to create sleek and professional presentations (forget PowerPoint!);

  • App designers who want to quickly create iOS or Android apps;

  • Developers who want a better handover process from designers;

  • Project managers that need interactive prototypes done fast;

If you don't have a lot of time to learn about various design programs, then this is the best course for you! Adobe XD is easy to learn and you'll see how through fun exercises and activities, you'll become proficient in no time at all!

"Get great results as fast as possible!" - that's how I've created this course. We don't waste time with boring theory. We start with the absolute basics and we work our way up, gradually, step by step. This is beginner friendly, but in the later sections advanced users will have a lot to learn too!

Important Features Included:

  • Course workbooks (cheat sheets): use them to get up and running fast. They contain answers to most questions, detailed explanations about certain techniques shown in the videos, and much more;

  • Live chat: my students frequently find me on our Discord group chat. This is a free program where you can chat with my fantastic community of students, ask questions, and get help fast. I'm regularly on there!

  • All the sources files are included (.xd files): this means you can easily work along and pick things up at any point

  • Facebook group: get access to a private group of over 7000 people who regularly share their designs, insights, and comments.

Who this course is for:

  • This course is great for web designers, app designers, and people who rely on visual presentations
  • Designers who want to stay current with the latest design tools
  • Designers who are interested in making their work interactive
  • People who are interested in learning about UI & UX

Course content

10 sections • 97 lectures

Introduction Preview 01:45

How to get the most out of this training Preview 03:20

Download all the resources from the course Preview 00:00

Adobe XD vs Photoshop Preview 05:15

Get started with Adobe XD Preview 05:08

Create your first design in Adobe XD Preview 10:10

How to get around Adobe XD Preview 09:46

Best way to select layers in XD Preview 06:44

Exercise: Practice your selecting Preview 06:04

From Photoshop or Illustrator to Adobe XD! Preview 04:24

Cloud documents and saving your work Preview 06:11

Adobe XD quirks Preview 04:31

Section conclusions Preview 01:24

Introduction Preview 01:45

How to work with rectangles like a pro Preview 08:54

Use the ellipse, polygon and line tools Preview 04:51

Editing shapes Preview 06:51

Pen tool Preview 02:56

Let’s have fun – use all the tools Preview 07:38

Work with colors and gradients Preview 05:42

Grids, guides, smart guides – pixel perfect designs Preview 06:27

The alignment tools - Overview Preview 06:53

How to use the alignment tools Preview 03:24

Work with text layers like a pro Preview 07:14

Best way to work with images Preview 05:03

Create a collage Preview 05:25

Section conclusions Preview 01:33

Export our work as PNGs Preview 03:58

Share your work to get feedback Preview 06:30

Optional - Save presentations as PDFs Preview 03:43

Share your work with developers Preview 03:28

Shrink your PNGs and JPEGs without losing quality Preview 03:06

Introduction Preview 01:01

Fast designing with repeat grid Preview 06:45

Quickly replace content Preview 03:07

Components – a revolutionary feature Preview 06:05

Practice working with components Preview 02:27

Why we need to talk about style guides Preview 05:55

How to supercharge your color use Preview 06:28

How to work with character styles Preview 04:45

Here’s how you actually set up your assets panel Preview 05:25

A smarter way to work with linked assets Preview 03:13

Undecided? Keep multiple versions! Preview 03:31

Working with several designers AT ONCE Preview 01:56

Section conclusion Preview 00:54

Introduction to our first web design project Preview 01:44

Create the website’s header Preview 06:14

My advice for perfect social media icons Preview 05:52

Setting our typography Preview 05:00

Adding the search bar Preview 07:54

The website’s categories Preview 04:53

Build the content area with repeat grid Preview 07:53

Pagination through XD components Preview 05:43

Create the footer Preview 10:31

Overview of the homepage Preview 02:02

Create the product details page Preview 07:25

Finishing touches on the product details page Preview 06:09

What is responsive design? Preview 05:55

Designing without coding: why and how? Preview 06:37

Making the mobile version of the homepage Preview 07:40

Adjusting the design for the mobile version Preview 07:26

Editing the footer for the mobile version Preview 03:44

Create the mobile version for the product details page Preview 06:31

Design variation #1 - color Preview 05:47

Design variation #2 – typography Preview 03:53

Design variation #3 – the layout Preview 06:32

Key things about our design Preview 05:42

Introduction to prototyping Preview 05:37

The fundamentals of wiring a prototype Preview 05:42

Trigger types in Adobe XD Preview 03:45

Transition Animations and Easing Preview 03:52

Auto-animate – the incredible game changer Preview 05:37

Auto-animate and drag Preview 08:29

Previous artboard – a must in any large project Preview 05:21

How to make menus and pop ups seem real Preview 04:14

Jump to a part of your design with “Scroll To” Preview 02:30

Here’s why your animations don’t matter Preview 05:15

Here’s why we should animate our design Preview 02:57

What you should and shouldn’t animate Preview 02:07

Create hover states for social media & main menu Preview 03:36

Prototyping the search box – hover and down state + drop-down Preview 07:45

Create a hover state for the repeat grid Preview 05:53

Setting up the pagination and footer Preview 05:51

How to quickly change your layout with stacks Preview 03:37

Extras: Make the navigation work Preview 07:41

Introduction Preview 02:51

What’s UI, what’s UX? Preview 05:59

Bad UX is very expensive Preview 05:02

UX case study – icons Preview 04:47

UX case study – buttons Preview 04:50

UX case study – forms Preview 03:58

UX case study – vague actions Preview 04:19

UX case study – hierarchy Preview 03:44

UX case study – fake content Preview 05:13

Do this before you start freelancing Preview 03:21

Here's what I suggest you do next Preview 02:16

Final quiz