This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.
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 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.
Adobe XD's tools and features
-
1Introduction
-
2How to get the most out of this training
-
3Download all the resources from the course
-
4Get started with Adobe XD
-
5Create your first design in Adobe XD
-
6Adobe XD vs Photoshop
-
7How to get around Adobe XD
-
8Best way to select layers in XD
-
9Exercise: Practice your selecting
-
10From Photoshop or Illustrator to Adobe XD!
-
11Cloud documents and saving your work
-
12Adobe XD quirks
-
13Section conclusions
Saving and exporting your work
-
14Introduction
-
15How to work with rectangles like a pro
-
16Best way to work with images
-
17How to design a modern presentation
-
18Use the ellipse, polygon and line tools
-
19How to edit shapes in Adobe XD
-
20Discover the Pen tool in XD
-
21Create geometric shapes
-
22Add text to our presentation
-
23Work with colors and gradients
-
24Grids, guides, smart guides – pixel perfect designs
-
25The alignment tools - Overview
-
26How to use the alignment tools
-
27Create a collage
-
28Let’s have fun – use all the tools
-
29Section conclusions
Adobe XD advanced features
First web design project
-
35Introduction
-
36Fast designing with repeat grid
-
37Quickly replace content
-
38Components – a revolutionary feature
-
39Practice working with components
-
40Why we need to talk about style guides
-
41How to supercharge your color use
-
42How to work with character styles
-
43Here’s how you actually set up your assets panel
-
44A smarter way to work with linked assets
-
45Undecided? Keep multiple versions!
-
46Working with several designers AT ONCE
-
47Section conclusion
Responsive design
-
48Introduction to our first web design project
-
49Create the website’s header
-
50My advice for perfect social media icons
-
51Setting our typography
-
52Adding the search bar
-
53The website’s categories
-
54Build the content area with repeat grid
-
55Pagination through XD components
-
56Create the footer
-
57Overview of the homepage
-
58Create the product details page
-
59Finishing touches on the product details page
Make the design interactive (prototyping)
-
60What is responsive design?
-
61Designing without coding: why and how?
-
62Making the mobile version of the homepage
-
63Adjusting the design for the mobile version
-
64Editing the footer for the mobile version
-
65Create the mobile version for the product details page
-
66Design variation #1 - color
-
67Design variation #2 – typography
-
68Design variation #3 – the layout
-
69Key things about our design
Advanced Prototyping
-
70Introduction to prototyping
-
71The fundamentals of wiring a prototype
-
72Trigger types in Adobe XD
-
73Transition Animations and Easing
-
74Auto-animate – the incredible game changer
-
75Auto-animate and drag
-
76Previous artboard – a must in any large project
-
77How to make menus and pop ups seem real
-
78Jump to a part of your design with “Scroll To”
-
79Here’s why your animations don’t matter
The First Key to Becoming a Great Web Designer
-
80Here’s why we should animate our design
-
81What you should and shouldn’t animate
-
82Create hover states for social media & main menu
-
83Prototyping the search box – hover and down state + drop-down
-
84Create a hover state for the repeat grid
-
85Setting up the pagination and footer
-
86How to quickly change your layout with stacks
-
87Extras: Make the navigation work