Adobe XD - User Experience Design Essentials

Video Description

Learn Adobe XD efficiently & comprehensivelyWith this ’Adobe XD - User Experience Design Essentials’ online course, you will be able to produce practical and effective User Experience (UX) and User Interface (UI) designs using Adobe XD. Follow along with the included project files to create high quality and functional mockups. This Adobe XD - User Experience Design Essentials course teaches you how to create real world projects as you move towards a UX/UI career path.Aimed at people interested in UI/UX Design, the course starts with beginning concepts and works all the way through to more complex topics, 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, you’ll learn the differences between UX and UI Design. Look at the brief for the real-world project you’ll create, then learn about low-fidelity wireframes and how to make use of existing UI design kits. Next, go over all of the essential tools necessary for creating excellent wireframes, including: type, colors, icons, Lorem ipsum, artboards, prototyping, models and popups, symbols and repeat grids. You will even make use of the new prototyping app so that you can experience your prototype on your mobile device.An important part of maximizing your UX Design workflow is being able to utilize other software such as Photoshop and Illustrator. Learn how to make use of both programs to help boost your XD productivity. One of the awesome new features of XD is micro-interactions. You’ll learn all about those and how to use them to grow icons and scenes. This is one of the parts of web design that’s exploding right now and being adopted rapidly so you won’t want to miss out on learning it early.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!

Table of Contents

  1. CHAPTER 1: GETTING STARTED
    1. Introduction to Adobe XD 00:02:54
    2. Getting Started with Your Adobe XD Project 00:02:21
    3. What is UI vs UX - User Interface vs User Experience? 00:06:20
  2. CHAPTER 2: THE BRIEF
    1. The Brief and Persona for our Real Life Project 00:11:22
  3. Wireframing (low fidelity) in Adobe XD
    1. How wide should my website or app be in Adobe XD? 00:01:58
    2. Working with existing UI kits in Adobe XD 00:13:06
  4. CHAPTER 04: TYPE, COLOR, AND ICON INTRO
    1. Working with type in your XD wireframes 00:09:10
    2. Basic Colors and buttons in Adobe XD wireframes 00:14:14
    3. Free icons for your Adobe XD and UX UI projects 00:13:41
    4. Adding footers and Lorem Ipsum to our XD wireframe 00:05:28
    5. Creating New Pages and Artboards in Adobe XD 00:04:20
    6. Class Project 01 – Wireframe Homepage and Contact Us Page 00:11:12
  5. CHAPTER 05: PROTOTYPING A WEBSITE INTRO
    1. Prototyping and adding interactivity to Adobe XD 00:08:13
    2. Creating a Popup Modal or popup box in Adobe XD 00:07:58
    3. Class project 02 – Prototype 00:02:55
  6. CHAPTER 06: SYMBOLS AND REPEAT GRIDS
    1. Working with groups and isolation mode in Adobe XD 00:02:30
    2. Making and Using Symbols in Adobe XD 00:07:16
    3. Production Video - Left Nav 00:03:52
    4. Using the repeat grid in Adobe XD 00:05:27
    5. Updating symbols and problems with using repeat grids 00:08:54
    6. Prototyping Trick to save time in Adobe XD 00:06:03
    7. Navigation tricks and tips in Adobe XD 00:04:48
    8. Class Project 03 - Symbols and Repeat Grids 00:04:07
  7. CHAPTER 07: PROTOTYPING AN APP INTRO
    1. Making an App version of your Adobe XD UX project 00:09:41
    2. How to use the XD App on iPhone and Android 00:08:05
    3. Adding iPhone and Android battery and status icons to mockup 00:03:10
    4. Fixing the position of the nav or battery icons in XD 00:01:01
    5. Production Video - Login and Dashboard 00:06:45
  8. CHAPTER 08: WIREFRAME FEEDBACK
    1. Sharing Wireframes for comments in Adobe XD 00:13:32
    2. Recording your interactions via video using Adobe XD 00:03:13
    3. Class project - Wireframe Feedback 00:01:21
  9. CHAPTER 09: HIGH FIDELITY UI DESIGN
    1. Mood Boards and resources for Hi fidelity UI design in Adobe XD 00:07:43
    2. Class project - Mood Board 00:01:00
    3. Creating a 12 Column Grid in Adobe XD 2018 00:04:57
  10. CHAPTER 10: COLORS
    1. Working with colors inside Adobe XD 00:09:03
    2. Tricks for using colors in Adobe XD 00:06:35
    3. Creating gradients in Adobe XD 00:03:51
    4. Class project 06 – Colors 00:02:14
  11. CHAPTER 11: ADVANCED TEXT AND FONTS
    1. Using Web safe fonts or iOS or Android specific fonts in Adobe XD 00:18:00
    2. Using Character Styles in Adobe XD 00:06:59
    3. Font and Text tips and tricks in Adobe XD 00:05:43
    4. Adding our first Plugin Lorem Ipsum to Adobe XD 00:05:40
    5. Creating realistic buttons in Adobe XD with paste properties 00:13:15
    6. Class project 07 - Text and Buttons 00:02:21
  12. CHAPTER 12: DRAWING
    1. Drawing your own custom icons in Adobe XD 00:04:13
    2. Working with strokes and lines in Adobe XD 00:14:29
    3. Drawing with the pen tool in Adobe XD 00:14:34
    4. Drawing practice with the pen tool in Adobe XD 00:07:15
    5. Production Video with some drawing tips 00:12:28
  13. CHAPTER 13: WORKING WITH ILLUSTRATOR
    1. Back and forth with Illustrator in Adobe XD 00:09:34
    2. Class project 08 - Draw your own icons 00:01:50
  14. CHAPTER 14: WORKING WITH INDESIGN
    1. Working with InDesign in Adobe XD 00:11:38
  15. CHAPTER 15: IMAGES
    1. The pros and cons for working with images inside Adobe XD 00:03:58
    2. Working with images and CC Library connection 00:11:01
    3. Adobe Stock connection to find similar image for XD project 00:05:21
    4. Free images to use in your XD mockups 00:01:48
    5. Masking, Opacity, and Blurring background images 00:06:45
  16. CHAPTER 16: WORKING WITH PHOTOSHOP
    1. Working with Photoshop in Adobe XD 00:08:41
    2. Production Video – Infographic 00:12:12
    3. Class project 09 - Full Hi Def mockup 00:05:38
  17. CHAPTER 17: APP DESIGN
    1. Making a mobile phone mockup with Adobe XD and Photoshop 00:18:09
    2. Class project 10 - Mobile Website 00:01:25
  18. CHAPTER 18: PLACEHOLDER CONTENT AND PLUG-INS
    1. Hidden features for Adobe XD Repeat Grid 00:05:17
    2. Plugin - Content Generator in Adobe XD 00:04:30
    3. Plugin - UI Faces adding random profile photos to XD 00:03:15
    4. Plugin - PhotoSplash automatically import Unsplash images 00:04:31
    5. Plugin - Copy Cat or Mimic to style and images from a site 00:03:19
  19. CHAPTER 19: ASSETS PANEL
    1. Advanced Asset Panel tricks in Adobe XD 00:04:38
  20. CHAPTER 20: ADVANCED SYMBOLS
    1. Advanced Symbol Tricks and Tips for Adobe XD 00:07:53
  21. CHAPTER 21: MICRO INTERACTIONS
    1. What are UI micro interactions in Adobe XD? 00:07:21
    2. Button Grow or Full Screen Image micro interaction in Adobe XD 00:06:13
    3. Animated Image Gallery with micro interactions in Adobe XD 00:06:39
    4. Full Vector Change micro interaction in Adobe XD 00:07:37
    5. Class project 11 - Micro Interactions 00:05:13
  22. CHAPTER 22: ADVANCED PROTOTYPING
    1. Time delay transitions in Adobe XD 00:04:42
    2. Creating a popup menu or modal in Adobe XD 00:12:17
    3. Animated mobile side nav for burger menu in Adobe XD 00:03:27
    4. Advanced prototyping using buttons and dropdown menus in Adobe XD 00:03:24
    5. Using the drag transition in Adobe XD 00:07:19
    6. Making a number ticker scroll using masks in Adobe XD 00:06:52
  23. CHAPTER 23: VOICE INTERACTIONS
    1. How to add Alexa style voice commands to Adobe XD 00:09:37
  24. CHAPTER 24: USER TESTING
    1. What is user testing in Adobe XD? 00:16:53
    2. Running an unmoderated UX User Test in Adobe XD 00:12:07
    3. Class Project 12 - User Testing 00:02:24
  25. CHAPTER 25: PITCHING TO CLIENTS AND CUSTOMERS
    1. Mocking up your designs in situ on a real phone in Photoshop 00:09:21
    2. Advanced micro interactions and prototyping with ProtoPie in Adobe XD 00:02:41
    3. Adding animation in Adobe XD using Adobe After Effects 00:09:39
  26. CHAPTER 26: EXPORTING
    1. Exporting images and code from Adobe XD for developers 00:12:56
    2. Exporting code in XD for engineers using Design Specs 00:10:50
  27. CHAPTER 27: WHAT NEXT
    1. Class Project 13 – Roar Cycles 00:10:30
    2. Conclusion for Adobe XD training course 00:04:14

Product Information

  • Title: Adobe XD - User Experience Design Essentials
  • Author(s): Daniel Scott
  • Release date: March 2019
  • Publisher(s): Total Training
  • ISBN: 10000BBACRODC