Learn Adobe Xd Webdesign: Design Websites From Zero: Ux & Ui

Become an efficient Adobe Xd Webdesigner by using my Copy & Paste workflow method

What you'll learn
Design full websites from begin to end in Adobe Xd
How to get images, color pallets and icons for free
You will be able to add Xd Designer to your CV
How to have a great workflow optimised for speed & quality
How to make a style-guide for your website
How to make a quick prototype that you can share
How to record your design while scrolling through it
Requirements
You will need to have Adobe XD. A free trial can be downloaded from Adobe
Besides that, nothing. No previous Adobe XD skills are needed
Description
Is Adobe Xd really better than Photoshop when it comes to webdesign?The problemThe problem with designing websites in older design tools (like Photoshop or Illustrator) is that these tools don't have the features that UX/UI designers really need to help them designing websites. Like working with color pallets, font style guides and repeating elements. Or things like sharing your work via prototypes. These old software tools are also not vector, which can be an issue for development.  What is the solution?Working with Adobe Xd! Because Adobe Xd was built with UI/UX designers in mind. This means that Adobe has done everything to make sure that you can design and share your work without limitations. The only thing you have to do is prepare a few things upfront and then re-use your elements on the whole website.  What if I don't have any design elements?In this course was build for people who only have Adobe Xd on their computer. I will give you my design files to practice and I will give you websites where you can get fonts, colors and images for free (for your next project). The opportunityLearning how to design websites comes with huge opportunities. You will be able to design your own website (like I do in this course) or design websites for other people or businesses. This makes website creation a hugely profitable skill. Companies are willing to spend thousands of dollars for each website. Why is this course different?Most Adobe Xd courses on this platform focus on App Design. This is cool and very fancy, but I like a more realistic approach. Because from my experience an UI/UX designer doesn't start his first interface design project for a cool startup. We start by designing websites for web and mobile. This is why I believe this course is very different from most of the courses about Adobe Xd. Again, app design is fancy, but I like to give you a skill that you can actually start using next week (because you probably already know a few people who need a redesign for their current website, don't you?).Step by stepIn this course we are not going to rush and design a quick cool website without learning the basics first. There is enough of that on the internet. I am going to show you a real project where I'm going to start from scratch and slowly built up 4 pages in Adobe XD. This means that I will show you all the steps, from the first title to the last button.Once we progress in the course (and you've seen the same techniques over and over) we will slowly start increasing the speed so will also be able to speed up your skills by watching this course. Reviews from others"I watch your videos and I get inspired every time because of your work/design." - Sam"Your channel has inspired me to start designing myself." - Jordy"I can't wait until the next video. I am following you for 4 years already and I've learned how to design this way :)" - FloorBuy without any riskIf you really don't like my course, then that's not a problem. You can just ask your money back with the 30-Day Money-Back Guarantee that this website offers. This makes it possible for everybody to hop on the course. Sign up for the course and you can start right away!

Overview

Section 1: Introduction

Lecture 1 Welcome to the course! What to expect

Lecture 2 Here are your downloads (don’t forget to install fonts)

Lecture 3 Adobe Interface Basics

Lecture 4 Understanding Layers in Xd

Lecture 5 Selecting, moving and duplicating

Lecture 6 Alignment fundamentals

Lecture 7 The very useful Assets panel

Lecture 8 Artboards. All you need to know.

Section 2: Getting the right tools

Lecture 9 Where to get the latest pre-made templates

Lecture 10 Getting free fonts & icons & images & color pallets & filler text

Section 3: Preparing our design file

Lecture 11 Preparing our first Artboard

Lecture 12 Preparing our colours

Lecture 13 Preparing our fonts

Section 4: Create our first Home page

Lecture 14 The big header image & menu

Lecture 15 The wave shape divider

Lecture 16 Floating images with shadows

Lecture 17 Client Logo section with the Repeat Grid tool

Lecture 18 Statistics section with empty boxes

Lecture 19 Testimonial section with the pen tool

Lecture 20 Call to action section with gradients

Lecture 21 Footer as a reusable symbol

Section 5: Creating the other pages quickly

Lecture 22 The portfolio page

Lecture 23 About page part 1: A Quick Start

Lecture 24 About page part 2: Tabs + Gallery

Lecture 25 About page part 3: FAQ section

Lecture 26 Contact page with vector icons

Lecture 27 A travel website with background blur

Lecture 28 A book store website with masks

Section 6: Responsive design

Lecture 29 Responsive mobile design - Part 1

Lecture 30 Responsive mobile design - Part 2

Section 7: Exporting & sharing

Lecture 31 Artboard and Element exporting

Lecture 32 The Sticky Menu on top

Lecture 33 Creating a prototype for web & mobile

Lecture 34 Making a video and shareable link

Section 8: The end

Lecture 35 Congratulations + Do you want more?

Beginning Adobe Xd users who want to design websites more efficiently