Course Highlights
  • 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.
Curriculum

7 Topics
Getting started with your Adobe XD project.
What is Adobe XD for & does it do the coding
What's the difference between UI and UX in Adobe XD
What we are making in this Adobe XD course
What is a persona & task flow in UX design
Class Project 01 - Create your own brief
Class Project 01 - Create your own brief

2 Topics
What is Lo Fi Wireframe vs High Fidelity in Adobe XD
Artboards & how wide should my website or app be in Adobe XD

11 Topics
Working with type in your XD wireframes
Rectangles Circles Buttons and Rounded corners in Adobe XD
How to use color in Adobe XD
Strokes & copy & paste appearance in Adobe XD
Class Project 02 - Wireframe
Class Project 02 - Wireframe
Free icons for your Adobe XD & UX UI projects
How to find and use existing UI kits in Adobe XD
Groups & issues editing icons in Adobe XD
Class Project 03 - Icons
Class Project 03 - Icons

5 Topics
How to add interaction to your prototype in Adobe XD
Prototype animation & easing in Adobe XD
How see your design on XD App on iPhone & Android
Class Project 04 - Testing on your phone
Class project 04 - Testing on your phone

4 Topics
Getting started with auto-animations in Adobe XD
Understanding more about animation in Adobe XD
Class Project 05 - My first animation
Class project 05 - My first animation

1 Topic
Sharing Wireframes for comments in Adobe XD

5 Topics
Mood Boards & resources for Hi fidelity UI design in Adobe XD
How to create a mood board in Adobe XD
Class project 06 - Mood Board
Class Project 06 - Moodboard
How to work with Columns & Grids in Adobe XD

2 Topics
View port aka dotted line on the page in Adobe XD
How to add & delete guides to Adobe XD

6 Topics
Color Inspiration & the eyedropper in XD
How to create a color palette in Adobe XD
How to create gradients in Adobe XD
How to save and reused color swatches in Adobe XD
Class Project 07 - Colors & Columns
Class Project 07 - Colors & Columns

7 Topics
What fonts can I use in my web or app design in Adobe XD
Check what other font’s people have used
What common font sizes should I choose in web design
How to make Character Styles in Adobe XD
Plugin - Adding our first Plugin Lorem Ipsum to Adobe XD
Class project 08 - Text
Class Project 08 - Text

6 Topics
Drawing & editing shapes in Adobe XD
Strangeness with shapes in Adobe XD
Learn to draw with the pen tool in Adobe XD
Working with strokes & lines in Adobe XD
Class Project 09 - Icons & Buttons
Class Project 09 - Icons & Buttons

1 Topic
Do I need to know Illustrator with Adobe XD

4 Topics
Masking & cropping images in Adobe XD
Free images to use in your XD mockups - Unsplash Pexels Freeimage
Darkening background images with opacity in XD
Blurring backgrounds and objects in Adobe XD

4 Topics
Do I need to know Photoshop with Adobe XD
Snack bar Toast banners using masked image in Adobe XD
Class Project 10 - Add images
Class Project 10 - Images

5 Topics
How to make & use components in Adobe XD
Difference between Main & Instance Components in Adobe XD
How to create component hover states in XD
Class Project 11 - Buttons
Class Project 11 - Buttons

4 Topics
How to use the repeat grid in Adobe XD
Class Project 12 - Repeat Grid
Class Project 12 - Repeat Grid
Updating & issues with repeat grids of the edge

3 Topics
How to use stacks in XD to make a form
Class Project 13 - Stacks & Checkout Page
Class Project 13 - Stacks & Checkout Page

9 Topics
The difference between animation & micro interactions
Dan drawing stuff in Adobe XD
More animation in Adobe XD
Class Project 14 - My Second Animation
Class Project 14 - My Second Animation
Micro interaction toggle switch in Adobe XD
Micro interaction burger menu turned into a cross in XD
Class Project 15 - Micro interaction
Class Project 15 - Micro interaction

6 Topics
How to pin navigation to the top in Adobe XD
How to add a popup overlay modal in Adobe XD
Slide in mobile nav menu overlay in Adobe XD
Class Project 16 - Popup & Navigation
Class Project 16 - Popup & Navigation
What are Flows in Adobe XD

8 Topics
How to share your document with clients & stakeholders & user testers
Talking to your developer early in the XD design process
Export the right image file formats from Adobe XD
Batch export images at once using Mark for Export in XD
How to export code in XD for engineers using Design Specs
What is a style guide in Adobe XD
Class Project 17 - Final Design
Class Project 17 - Final Design

1 Topic
Whats next after Adobe XD Essentials

  Write a Review

User Experience Design Essentials - Adobe XD UI UX Design

Go to Paid Course