Graphic Design | User Experience Design
User Experience Design Essentials - Adobe XD UI UX Design
WHY THIS COURSE?
DESCRIPTION
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.
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.
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.
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.
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.
What are the requirements?
- You will need a copy of Adobe XD 2018 or above. A free trial can be downloaded from Adobe.
- No previous design experience is needed.
- No previous Adobe XD skills are needed.
What am I going to get from this course?
- 92 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.
- 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
What is the target audience?
- This course is for beginners.
- Aimed at people new to the world of design & user experience.
- No previous Adobe XD experience is necessary.
- For anyone that needs to add ‘UX Design’ to their portfolio.
COURSE CONTENT
92 Lessons 10:56:46
Lesson- 1: Introduction to Adobe XD 00:02:54
Lesson- 2: Getting started with your Adobe XD project 00:02:21
Lesson- 3: What is UI vs UX - User Interface vs User Experience 00:06:20
Lesson- 1: The brief & persona for our real life project 00:11:22
Lesson- 1: Wireframing (low fidelity) in Adobe XD 00:01:58
Lesson- 2: How wide should my website or app be in Adobe XD? 00:13:06
Lesson- 3: Working with existing UI kits in Adobe XD 00:07:50
Lesson- 1: Working with type in your XD wireframes 00:09:10
Lesson- 2: Basic Colors & buttons in Adobe XD wireframes 00:14:14
Lesson- 3: Free icons for your Adobe XD & UX UI projects 00:13:41
Lesson- 4: Adding footers & Lorem Ipsum to our XD wireframe 00:05:28
Lesson- 5: New Pages & Artboards in Adobe XD 00:04:20
Lesson- 6: Class Project 01 – Wireframe Homepage & Contact Us Page 00:11:12
Lesson- 1: Prototyping & adding interactivity to Adobe XD 00:08:13
Lesson- 2: How to create a Popup Modal or popup box in Adobe XD 00:07:58
Lesson- 3: Class project 02 – Prototype 00:02:55
Lesson- 1: Working with groups & isolation mode in Adobe XD 00:02:30
Lesson- 2: How to make & use symbols in Adobe XD 00:07:16
Lesson- 3: Production Video - Left Nav 00:03:52
Lesson- 4: Using the repeat grid in Adobe XD 00:05:27
Lesson- 5: Updating symbols & problems with using repeat grids 00:08:54
Lesson- 6: Prototype Trick to save time in Adobe XD 00:06:03
Lesson- 7: Navigation tricks & tips in Adobe XD 00:04:48
Lesson- 8: Class Project 03 - Symbols & Repeat Grids 00:04:07
Lesson- 1: Make an APP version of your Adobe XD UX project 00:09:41
Lesson- 2: How to use the XD App on iPhone & Android 00:08:05
Lesson- 3: Adding iPhone & Android battery & status icons to mockup 00:03:10
Lesson- 4: How to fix the position of the nav or battery icons in XD 00:01:01
Lesson- 5: Production Video - Login & Dashboard 00:06:45
Lesson- 1: Sharing Wireframes for comments in Adobe XD 00:13:32
Lesson- 2: Recording your interactions via video using Adobe XD 00:03:13
Lesson- 3: Class project - Wireframe Feedback 00:01:21
Lesson- 1: Mood Boards & resources for Hi fidelity UI design in Adobe XD 00:07:43
Lesson- 2: Class project - Mood Board 00:01:00
Lesson- 3: How to create a 12 Column Grid in Adobe XD 2018 00:04:57
Lesson- 1: Working with colors inside Adobe XD CC 00:09:03
Lesson- 2: Tricks for using colors in Adobe XD 00:06:35
Lesson- 3: How to create gradients in Adobe XD 00:03:51
Lesson- 4: Class project 06 – Colors 00:02:14
Lesson- 1: Use Web safe fonts or iOS or Android specific fonts in Adobe XD 00:18:00
Lesson- 2: How to use Character Styles in Adobe XD 00:06:59
Lesson- 3: Font & Text tips tricks in Adobe XD 00:05:43
Lesson- 4: Adding our first Plugin Lorem Ipsum to Adobe XD 00:05:40
Lesson- 5: Creating realistic buttons in Adobe XD with paste properties 00:13:15
Lesson- 6: Class project 07 - Text & Buttons 00:02:21
Lesson- 1: How to draw your own custom icons in Adobe XD 00:04:13
Lesson- 2: Working with stokes & lines in Adobe XD 00:14:29
Lesson- 3: Learn to draw with the pen tool in Adobe XD 00:14:34
Lesson- 4: Drawing practise with the pen tool in Adobe XD 00:07:15
Lesson- 5: Production Video with some drawing tips 00:12:28
Lesson- 1: Back and forth with Illustrator in Adobe XD 00:09:34
Lesson- 2: Class project 08 - Draw your own icons 00:01:50
Lesson- 1: Working with InDesign in Adobe XD 00:11:38
Lesson- 1: The pros & cons for working with images inside Adobe XD 00:03:58
Lesson- 2: Working with images and CC Library connection 00:11:01
Lesson- 3: Adobe Stock connection to find similar image for XD project 00:05:21
Lesson- 4: Free images to use in your XD mockups - Unsplash Pexels Free image 00:01:48
Lesson- 5: Masking & Opacity & Blurring background images 00:06:45
Lesson- 1: Working with Photoshop in Adobe XD 00:08:41
Lesson- 2: Production Video – Infographic 00:12:12
Lesson- 3: Class project 09 - Full Hi Def mockup 00:05:38
Lesson- 1: How to make a mobile phone mockup with Adobe XD & Photoshop 00:18:09
Lesson- 2: Class project 10 - Mobile Website 00:01:25
Lesson- 1: Hidden features for Adobe XD Repeat Grid 00:05:17
Lesson- 2: Plugin - Content Generator in Adobe XD 00:04:30
Lesson- 3: Plugin - UI Faces adding random profile photos to XD 00:03:15
Lesson- 4: Plugin - PhotoSplash automatically import Unspash images 00:04:31
Lesson- 5: Plugin - Copy Cat or Mimic to style and images from a site 00:03:19
Lesson- 1: Advanced Asset Panel tricks in Adobe XD 00:04:38
Lesson- 1: Advanced Symbol Tricks & Tips for Adobe XD 00:07:53
Lesson- 1: What are UI micro interactions in Adobe XD 00:07:21
Lesson- 2: Button grow or full screen image micro interaction in Adobe XD 00:06:13
Lesson- 3: Animated Image Gallery with micro interactions in Adobe XD 00:06:39
Lesson- 4: Full vector change micro interaction in Adobe XD 00:07:37
Lesson- 5: Class project 11 - Micro Interactions 00:05:13
Lesson- 1: Time delay transitions in Adobe XD 00:04:42
Lesson- 2: How to create a popup menu or modal in Adobe XD 00:12:17
Lesson- 3: Animated mobile side nav for burger menu in Adobe XD 00:03:27
Lesson- 4: Advanced prototyping using buttons & dropdown menus in Adobe XD 00:03:24
Lesson- 5: How to use the drag transition in Adobe XD 00:07:19
Lesson- 6: How to make a number ticker scroll using masks in Adobe XD 00:06:52
Lesson- 1: How to add Alexa style voice commands to Adobe XD 00:09:37
Lesson- 1: What is user testing in Adobe XD 00:16:53
Lesson- 2: How to run an unmoderated UX User Test in Adobe XD 00:12:07
Lesson- 3: Class project 12 - User Testing 00:02:24
Lesson- 1: Mocking up your designs in situ on a real phone in Photoshop 00:09:21
Lesson- 2: Advanced micro interactions & prototyping with Protopie in Adobe XD 00:02:41
Lesson- 3: How to add animation in Adobe XD using Adobe After Effects 00:09:39
Lesson- 1: How to export images & code from Adobe XD for developers 00:12:56
Lesson- 2: How to export code in XD for engineers using Design Specs 00:10:50
Lesson- 1: Class Project 13 – Roar Cycles 00:10:30
Lesson- 2: Conclusion for Adobe XD training course 00:04:14
SIMILAR COURSES
COURSE FEATURES
92 Lessons
1 Resources Files
Full Lifetime Access
Access on Mobile
Access on Web
Certificate of Completion
1 Resources Files
Full Lifetime Access
Access on Mobile
Access on Web
Certificate of Completion
M.R.P.:
₹ 12495.00
ISC Price:₹ 699.00
You Save: ₹ 11796 (94.41% off)
ISC Price:
You Save: ₹ 11796 (94.41% off)
DON'T HAVE TIME?
We can send you everything you need to know about this course through email.
We respect your privacy. your information is safe and will never be shared.
