This course is designed for those interested to learn the basics of web design using Adobe Xd, from creating a great design brief, website architecture, drawing your wireframes on paper, up to exporting your assets for developers. Read more.
My mission is to improve the lives of others and to pass on my knowledge back to the community and to all those who want to learn about design.
Access all courses in our library for only $9/month with All Access Pass
Get Started with All Access PassBuy Only This CourseAbout This Course
Getting into UI/UX design can be difficult because there is so much information out there and you don’t know which direction to follow. There are so many tools and techniques, so choosing the right one for you can be difficult.
Adobe Xd gives you unlimited possibilities because you can create, prototype and share, all in one tool, on Mac or PC, for free.
Hey designer, my name is Alex and in this 20+ hours long masterclass you are going to learn:
- Basics of Adobe Xd and what it can do (this course uses Adobe Xd CC v.35, but any version will do)
- How to create great design brief
- Create website architecture
- Draw your wireframes on paper
- Then import and create them in Adobe Xd
- Create complex designs by adding colors, images and animations
- Share those designs with client to get feedback
- Create responsive design with multiple sizes
- Present your designs in a portfolio
- And finally, how to export your assets for developers using industry standards.
This course covers everything you need to know to get started in UI/UX design, or to improve your skills. You don’t need any previous knowledge of UI/UX or Adobe Xd, we are going to cover it all in this course.Â
So if you want to improve your skills and productivity, save a lot of time and money on iterations and create designs faster, then I’ll see you in the course.
Our Promise to You
By the end of this course, you will have learned web designing in Adobe Xd.
10 Day Money Back Guarantee. If you are unsatisfied for any reason, simply contact us and we’ll give you a full refund. No questions asked.
Get started today and learn more about web designing from scratch.
Course Curriculum
Section 1 - Adobe Xd Basics | |||
Course Introduction | 00:00:00 | ||
Course Overview | 00:00:00 | ||
Introduction To Adobe Xd | 00:00:00 | ||
Install Adobe Xd | 00:00:00 | ||
Home Screen | 00:00:00 | ||
Get To Know Adobe Xd | 00:00:00 | ||
Shapes | 00:00:00 | ||
Pen Tool | 00:00:00 | ||
Text Tool | 00:00:00 | ||
Artboards | 00:00:00 | ||
Guides | 00:00:00 | ||
Repeat Grid | 00:00:00 | ||
Section 2 - Design Process And Brief | |||
Design Process Overview | 00:00:00 | ||
Our Design Brief | 00:00:00 | ||
Find The Target Audience | 00:00:00 | ||
Section 3 - Creating Wireframes | |||
Paper Wireframe Resources | 00:00:00 | ||
Paper Wireframing Styles | 00:00:00 | ||
Paper Wireframes 1 | 00:00:00 | ||
Paper Wireframes 2 | 00:00:00 | ||
Paper Wireframes 3 | 00:00:00 | ||
Paper Wireframes 4 | 00:00:00 | ||
Paper Wireframes 5 | 00:00:00 | ||
Paper Wireframes 6 | 00:00:00 | ||
Paper Wireframes 7 | 00:00:00 | ||
Paper Wireframes 8 | 00:00:00 | ||
Importing Our Paper Wireframes | 00:00:00 | ||
Creating Website Architecture | 00:00:00 | ||
Wireframes In Adobe Xd 1 | 00:00:00 | ||
Wireframes In Adobe Xd 2 | 00:00:00 | ||
Wireframes In Adobe Xd 3 | 00:00:00 | ||
Wireframes In Adobe Xd 4 | 00:00:00 | ||
Wireframes In Adobe Xd 5 | 00:00:00 | ||
Wireframes In Adobe Xd 6 | 00:00:00 | ||
Wireframes In Adobe Xd 7 | 00:00:00 | ||
Wireframes In Adobe Xd 8 | 00:00:00 | ||
Wireframes In Adobe Xd 9 | 00:00:00 | ||
Section 4 - Creating Design | |||
Free VS Premium Resources And Licences | 00:00:00 | ||
Optimizing Your Images | 00:00:00 | ||
Creating Design 1 | 00:00:00 | ||
Creating Design 2 | 00:00:00 | ||
Creating Design 3 | 00:00:00 | ||
Creating Design 4 | 00:00:00 | ||
Creating Design 5 | 00:00:00 | ||
Creating Design 6 | 00:00:00 | ||
Creating Design 7 | 00:00:00 | ||
Creating Design 8 | 00:00:00 | ||
Creating Design 9 | 00:00:00 | ||
Creating Design 10 | 00:00:00 | ||
Creating Design 11 | 00:00:00 | ||
Creating Design 12 | 00:00:00 | ||
Creating Design 13 | 00:00:00 | ||
Creating Design 14 | 00:00:00 | ||
Creating Design 15 | 00:00:00 | ||
Section 5 - Creating Responsive Design | |||
What Is Responsive Design | 00:00:00 | ||
Creating Responsive Design Grid System | 00:00:00 | ||
Responsive Design 1 | 00:00:00 | ||
Responsive Design 2 | 00:00:00 | ||
Responsive Design 3 | 00:00:00 | ||
Responsive Design 4 | 00:00:00 | ||
Responsive Design 5 | 00:00:00 | ||
Responsive Design 6 | 00:00:00 | ||
Responsive Design 7 | 00:00:00 | ||
Responsive Design 8 | 00:00:00 | ||
Section 6 - Sharing And Feedback | |||
Importance Of Sharing | 00:00:00 | ||
Design Sharing Options | 00:00:00 | ||
Sharing The Design With Client | 00:00:00 | ||
Sharing The Design With Developers | 00:00:00 | ||
Creating Design Tokens | 00:00:00 | ||
Creating A Design System | 00:00:00 | ||
Create A Project Presentation | 00:00:00 | ||
3D In Adobe Xd | 00:00:00 | ||
Section 7 - Exporting | |||
Folder Structure For Asset Export | 00:00:00 | ||
Exporting Your Assets | 00:00:00 | ||
Creating Project Styleguide | 00:00:00 | ||
Section 8 - Conclusion And Resources | |||
Conclusion And Resources | 00:00:00 | ||
Downloadable Resources | 00:00:00 |
About This Course
Getting into UI/UX design can be difficult because there is so much information out there and you don’t know which direction to follow. There are so many tools and techniques, so choosing the right one for you can be difficult.
Adobe Xd gives you unlimited possibilities because you can create, prototype and share, all in one tool, on Mac or PC, for free.
Hey designer, my name is Alex and in this 20+ hours long masterclass you are going to learn:
- Basics of Adobe Xd and what it can do (this course uses Adobe Xd CC v.35, but any version will do)
- How to create great design brief
- Create website architecture
- Draw your wireframes on paper
- Then import and create them in Adobe Xd
- Create complex designs by adding colors, images and animations
- Share those designs with client to get feedback
- Create responsive design with multiple sizes
- Present your designs in a portfolio
- And finally, how to export your assets for developers using industry standards.
This course covers everything you need to know to get started in UI/UX design, or to improve your skills. You don’t need any previous knowledge of UI/UX or Adobe Xd, we are going to cover it all in this course.Â
So if you want to improve your skills and productivity, save a lot of time and money on iterations and create designs faster, then I’ll see you in the course.
Our Promise to You
By the end of this course, you will have learned web designing in Adobe Xd.
10 Day Money Back Guarantee. If you are unsatisfied for any reason, simply contact us and we’ll give you a full refund. No questions asked.
Get started today and learn more about web designing from scratch.
Course Curriculum
Section 1 - Adobe Xd Basics | |||
Course Introduction | 00:00:00 | ||
Course Overview | 00:00:00 | ||
Introduction To Adobe Xd | 00:00:00 | ||
Install Adobe Xd | 00:00:00 | ||
Home Screen | 00:00:00 | ||
Get To Know Adobe Xd | 00:00:00 | ||
Shapes | 00:00:00 | ||
Pen Tool | 00:00:00 | ||
Text Tool | 00:00:00 | ||
Artboards | 00:00:00 | ||
Guides | 00:00:00 | ||
Repeat Grid | 00:00:00 | ||
Section 2 - Design Process And Brief | |||
Design Process Overview | 00:00:00 | ||
Our Design Brief | 00:00:00 | ||
Find The Target Audience | 00:00:00 | ||
Section 3 - Creating Wireframes | |||
Paper Wireframe Resources | 00:00:00 | ||
Paper Wireframing Styles | 00:00:00 | ||
Paper Wireframes 1 | 00:00:00 | ||
Paper Wireframes 2 | 00:00:00 | ||
Paper Wireframes 3 | 00:00:00 | ||
Paper Wireframes 4 | 00:00:00 | ||
Paper Wireframes 5 | 00:00:00 | ||
Paper Wireframes 6 | 00:00:00 | ||
Paper Wireframes 7 | 00:00:00 | ||
Paper Wireframes 8 | 00:00:00 | ||
Importing Our Paper Wireframes | 00:00:00 | ||
Creating Website Architecture | 00:00:00 | ||
Wireframes In Adobe Xd 1 | 00:00:00 | ||
Wireframes In Adobe Xd 2 | 00:00:00 | ||
Wireframes In Adobe Xd 3 | 00:00:00 | ||
Wireframes In Adobe Xd 4 | 00:00:00 | ||
Wireframes In Adobe Xd 5 | 00:00:00 | ||
Wireframes In Adobe Xd 6 | 00:00:00 | ||
Wireframes In Adobe Xd 7 | 00:00:00 | ||
Wireframes In Adobe Xd 8 | 00:00:00 | ||
Wireframes In Adobe Xd 9 | 00:00:00 | ||
Section 4 - Creating Design | |||
Free VS Premium Resources And Licences | 00:00:00 | ||
Optimizing Your Images | 00:00:00 | ||
Creating Design 1 | 00:00:00 | ||
Creating Design 2 | 00:00:00 | ||
Creating Design 3 | 00:00:00 | ||
Creating Design 4 | 00:00:00 | ||
Creating Design 5 | 00:00:00 | ||
Creating Design 6 | 00:00:00 | ||
Creating Design 7 | 00:00:00 | ||
Creating Design 8 | 00:00:00 | ||
Creating Design 9 | 00:00:00 | ||
Creating Design 10 | 00:00:00 | ||
Creating Design 11 | 00:00:00 | ||
Creating Design 12 | 00:00:00 | ||
Creating Design 13 | 00:00:00 | ||
Creating Design 14 | 00:00:00 | ||
Creating Design 15 | 00:00:00 | ||
Section 5 - Creating Responsive Design | |||
What Is Responsive Design | 00:00:00 | ||
Creating Responsive Design Grid System | 00:00:00 | ||
Responsive Design 1 | 00:00:00 | ||
Responsive Design 2 | 00:00:00 | ||
Responsive Design 3 | 00:00:00 | ||
Responsive Design 4 | 00:00:00 | ||
Responsive Design 5 | 00:00:00 | ||
Responsive Design 6 | 00:00:00 | ||
Responsive Design 7 | 00:00:00 | ||
Responsive Design 8 | 00:00:00 | ||
Section 6 - Sharing And Feedback | |||
Importance Of Sharing | 00:00:00 | ||
Design Sharing Options | 00:00:00 | ||
Sharing The Design With Client | 00:00:00 | ||
Sharing The Design With Developers | 00:00:00 | ||
Creating Design Tokens | 00:00:00 | ||
Creating A Design System | 00:00:00 | ||
Create A Project Presentation | 00:00:00 | ||
3D In Adobe Xd | 00:00:00 | ||
Section 7 - Exporting | |||
Folder Structure For Asset Export | 00:00:00 | ||
Exporting Your Assets | 00:00:00 | ||
Creating Project Styleguide | 00:00:00 | ||
Section 8 - Conclusion And Resources | |||
Conclusion And Resources | 00:00:00 | ||
Downloadable Resources | 00:00:00 |