User Experience Design Essentials - Adobe XD UI UX Design

12h 46m 57s
English
Paid
March 9, 2024

Hi there! My name is Dan & I’m an Adobe Certified Instructor. I’m here to help you learn Adobe XD efficiently and comprehensively. XD is a fantastic design tool used by industry professionals to product high quality & functional mockups. By the end of this course, you will be able to produce practical and effective User Experience (UX) and User Interface (UI) designs.

More

Throughout the course I’ll invite you to participate in a real-life freelance project which I’m working on. It’s a project that requires a fresh website and mobile app interface. This will prepare you for dealing with real world projects if you choose to move towards a UX/UI career path.

  • Aria: "This course is definitely above expectations so far. I didn't expect to get so much insight into the briefing and the communication between UX Designer and a client. It helps to see the brief and to learn that there are different tiers of income based on projects and experience. Love It!"

This course is aimed at people interested in UI/UX Design. We’ll start from the very beginning and work all the way through, step by step. If you already have some UI/UX Design experience but want to get up to speed using Adobe XD then this course is perfect for you too!

First, we will go over the differences between UX and UI Design. We will look at what our brief for this real-world project is, then we will learn about low-fidelity wireframes and how to make use of existing UI design kits.

I’ll go over all of the essential tools necessary for creating excellent wireframes, including: type, colours, icons, Lorem ipsum, artboards, prototyping, models and popups, symbols and repeat grids. We will even make use of the new prototyping app so that you can experience your prototype on your mobile device.

  • Kate: Excellent course - Dan is an excellent teacher and I thoroughly enjoyed following along with his videos. Highly recommend! July 2018: I have updated this review with an extra star because of how useful this course has been in the months following it's completion. I am using Adobe XD daily and Dan's instruction was instrumental to adding this feather to my front-end web development hat.

An important part of maximising your UX Design workflow is being able to utilise other software such as Photoshop and Illustrator. This is why I’ll be teaching you how to make use of both to help boost your XD productivity.

One of the awesome new features of XD is micro-interactions. I’ll be teaching you all about those and how to use them to grow icons and scenes. This is one of the parts of web design that’s growing and being adopted rapidly so you won’t want to miss out on learning it early.

  • Leigh: "I really enjoyed this course. I was a UX designer before the course and was looking for more information on XD and getting to know the program itself better, and this course really nailed it! It has great UX references and a few refreshing perspectives. As well as it really helps you learn XD in the process. The instructor is engaging and fun to listen to. Really really great course. I highly recommend to any new UX designers, as well as veterans looking for a refresh, or just to learn how to use XD."

There are two class projects for you to complete during this class, these will help develop your skills and will give you something for your own portfolio.

It is now time to upgrade yourself & learn Adobe XD.

Requirements:
  • You will need a copy of Adobe XD 2019 or above. A free trial can be downloaded from Adobe.
  • No previous design experience is needed.
  • No previous Adobe XD skills are needed.
Who this course is for:
  • Anyone who wants to start using Adobe XD in their career & get paid for their user experience design skills.
  • This course is for beginners, newbies & amateurs in the field of UX design.
  • Aimed at people new to the world of design & user experience.
  • For anyone that needs to add ‘UX Design’ to their portfolio.

What you'll learn:

  • Become a UX designer.
  • You will be able to start earning money from your XD Skills.
  • You will be able to add UX designer to your CV
  • Build a UX project from beginning to end.
  • Become a UI designer.
  • Build & test a full mobile app.
  • Build & test a full website design.
  • You will have a project of your own to add to your portfolio.
  • 93 lectures of well-structured, step by step content.
  • Learn to design websites & mobile phone apps.
  • Work with fonts & colors.
  • Prototype your designs with interactions.
  • Test on mobile phones.
  • You'll create realistic prototype complete with micro interactions.
  • Send your designs for feedback & commenting.
  • Export production ready assets.
  • Create your first UX brief & persona.
  • Create quick wireframes.
  • How to use premade UI kits.
  • Learn professional workflow tricks & shortcuts.
  • You will get the finished files so you never fall behind
  • Downloadable exercise files
  • Forum support from me and the rest of the BYOL crew
  • All the techniques used by UX professionals
  • Build a mobile app prototype that responses to voice commands.
  • You will be able to talk correctly with other UX design professionals.
  • You'll learn how to choose colors.
  • You'll learn how to pick the correct fonts.
  • You'll be able to send your finished work to other professionals in the correct formats.

Watch Online User Experience Design Essentials - Adobe XD UI UX Design

Join premium to watch
Go to premium
# Title Duration
1 Introduction to the User Experience Course 02:54
2 Getting started with your Adobe XD project 02:22
3 What is UI vs UX - User Interface vs User Experience vs Product Designer 06:20
4 The UX brief & persona for our real life project 11:23
5 Wireframing (low fidelity) in Adobe XD 01:59
6 How wide should my website or app be in Adobe XD? 13:07
7 Working with existing UI kits in Adobe XD 07:50
8 Working with type in your XD wireframes 09:10
9 Basic Colors & buttons in Adobe XD wireframes 14:15
10 Free icons for your Adobe XD & UX UI projects 11:46
11 Adding footers & Lorem Ipsum to our XD wireframe 05:28
12 New Pages & Artboards in Adobe XD 04:21
13 Class Project 01 – Wireframe Homepage & Contact Us Page 11:12
14 Prototyping & adding interactivity to Adobe XD 08:54
15 How to create a Popup Modal or popup box in Adobe XD 07:58
16 Class project 02 – Prototype 02:55
17 Working with groups & isolation mode in Adobe XD 02:31
18 How to make & use symbols in Adobe XD 17:20
19 Production Video - Left Nav 03:53
20 Using the repeat grid in Adobe XD 05:28
21 Updating symbols & problems with using repeat grids 08:55
22 Prototype Trick to save time in Adobe XD 06:04
23 Navigation tricks & tips in Adobe XD 04:49
24 Class Project 03 - Symbols & Repeat Grids 04:08
25 Mocking up an App in Adobe XD 09:41
26 How to use the XD App on iPhone & Android 08:05
27 Adding iPhone & Android battery & status icons to mockup 03:11
28 How to fixed the position of the nav or battery icons in XD 01:02
29 Production Video - Login & Dashboard 06:46
30 Sharing Wireframes for comments in Adobe XD 13:33
31 Recording your interactions via video using Adobe XD 03:14
32 Class project - Wireframe Feedback 01:22
33 Mood Boards & resources for Hi fidelity UI design in Adobe XD 07:44
34 Class project - Mood Board 01:00
35 How to create a 12 Column or Grid in Adobe XD 2018 04:58
36 Working with colors inside Adobe XD CC 09:03
37 Tricks for using colors in Adobe XD 06:35
38 How to create gradients in Adobe XD 03:51
39 Class project 06 – Colors 02:15
40 Use Web safe fonts or iOS or Android specific fonts in Adobe XD 18:01
41 How to use Character Styles in Adobe XD 07:00
42 Font & Text tips tricks in Adobe XD 05:44
43 Adding our first Plugin Lorem Ipsum to Adobe XD 05:40
44 Creating realistic buttons in Adobe XD with paste properties 13:16
45 Class project 07 - Text & Buttons 02:22
46 How to draw your own custom icons in Adobe XD 04:14
47 Working with stokes & lines in Adobe XD 14:29
48 Learn to drawing with the pen tool in Adobe XD 14:35
49 Drawing practise with the pen tool in Adobe XD 07:16
50 Production Video with some drawing tips 12:29
51 Back and forth with Illustrator in Adobe XD 09:35
52 Class project 08 - Draw your own icons 01:50
53 Working with InDesign in Adobe XD 11:39
54 The pros & cons for working with images inside Adobe XD 03:59
55 Working with images and CC Library connection 11:02
56 Adobe Stock connection to find similar image for XD project 05:21
57 Free images to use in your XD mockups - Unsplash Pexels Freeimage 01:49
58 Masking & Opacity & Blurring background images 06:45
59 Working with Photoshop in Adobe XD 08:42
60 Production Video – Infographic 12:13
61 Class project 09 - Full Hi Def mockup 05:39
62 How to make a mobile phone mockup with Adobe XD & Photoshop 18:09
63 Class project 10 - Mobile Website 01:25
64 Hidden features for Adobe XD Repeat Grid 05:18
65 Plugin - Content Generator in Adobe XD 04:30
66 Plugin - UI Faces adding random profile photos to XD 03:16
67 Plugin - PhotoSplash automatically import Unspash images 04:32
68 Plugin - Copy Cat or Mimic to style and images from a site 03:20
69 Advanced Asset Panel tricks in Adobe XD 04:38
70 Advanced Symbol Tricks & Tips for Adobe XD 07:54
71 What are UI micro interactions in Adobe XD 07:22
72 Button grow or full screen image micro interaction in Adobe XD 06:14
73 Animated Image Gallery with micro interactions in Adobe XD 06:40
74 Full vector change micro interaction in Adobe XD 08:20
75 Class project 11 - Micro Interactions 05:13
76 Time delay transitions in Adobe XD 04:43
77 How to create a popup menu or modal in Adobe XD 12:17
78 Animated mobile side nav for burger menu in Adobe XD 03:27
79 How to make a working drop down menu in Adobe XD 03:25
80 How to use the drag transition in Adobe XD 07:20
81 How to make a number ticker scroll using masks in Adobe XD 06:52
82 How to add Alexa style voice commands to Adobe XD 09:38
83 What is user testing in Adobe XD 16:54
84 How to run an unmoderated UX User Test in Adobe XD 12:08
85 Class project 12 - User Testing 02:24
86 Mocking up your designs in situ on a real phone in Photoshop 09:22
87 Advanced micro interactions & prototyping with Protopie in Adobe XD 02:41
88 How to add animation in Adobe XD using Adobe After Effects 09:40
89 How to export images & assets from Adobe XD for developers 12:57
90 How to export code in XD for engineers using Design Specs 10:50
91 Class Project 13 – Roar Cycles 10:30
92 BONUS: Software Updates 2019 37:25
93 BONUS: Software Updates 2021 01:00:19
94 Conclusion for Adobe XD training course 06:12

Similar courses to User Experience Design Essentials - Adobe XD UI UX Design

Design Mobile Apps: UI, UX & Prototyping in Adobe XD & PS

Design Mobile Apps: UI, UX & Prototyping in Adobe XD & PS

Duration 14 hours 51 minutes 9 seconds
Create a Personal Portfolio using Angular 2 & Behance

Create a Personal Portfolio using Angular 2 & Behance

Duration 2 hours 8 minutes 10 seconds
From Zero to Application Designer (Web, mobile, tablet)

From Zero to Application Designer (Web, mobile, tablet)

Duration 10 hours 50 minutes 17 seconds
Using Vue 2 to Create Beautiful SEO-Ready Websites

Using Vue 2 to Create Beautiful SEO-Ready Websites

Duration 1 hour 48 minutes 11 seconds
Learn Adobe Experience Design CC 2018 by Example

Learn Adobe Experience Design CC 2018 by Example

Duration 1 hour 32 minutes 48 seconds
Adobe XD Crash Course

Adobe XD Crash Course

Duration 3 hours 11 minutes 58 seconds