Design Your First Website In Adobe Xd

About Design Your First Website In Adobe Xd

Welcome to the Class

What You Will Find In This Class

What Is Adobe Xd

The Starter Version

How To Download Adobe Xd

The Home Screen

The Workspace

Designing vs Prototyping in Xd

Creating a New File

Managing Artboards

Layers

Tools Overview

Adding and Managing Plugins

Plugins You Are Most Likely to Use in Your Designs

How to Use the Document Assets

Quick Introduction to Design Systems in Xd

How to Choose the Right Colors For Your Designs

5 Tools to Find the Right Colors for Your Layouts

How to Choose the Right Typeface for Your Websites

Best Practices of Modern Web Design

Getting Ready to Start Designing

Let’s Create a New File First

Finding the Right Colors for Our Design

Let’s Add the Logo and the Navigation

Let’s Prototype Our First Element

Let’s Add the Active State and the First Hero Elements

Let’s Start the Mobile Version of the Design

Let’s Add the Mobile Menu

Let’s Learn a Better Way of Animating the Menu Icon

Let’s Add More Hero Elements

Let's Add The Social Media Icons

Let’s Make the Hero Section Responsive

Let's Start The Sevices Section

Let’s Add the Services

Let’s Add the Call to Action Button

Let’s Make the Services Responsive

Let’s Start Adding the Portfolio Items

Let’s Finish the Portfolio

Let’s Make the Portfolio Reponsive

Let’s Add an Image Carousel

Let’s Start Adding the Blog Section

Let’s Start Adding the Blog Posts Excerpts

Let’s Set Up Blog Pages

Let’s Learn Some Pagination Effects

Let’s Set up the Single Post Page and Finish the Section

Let’s Add the About Me Section

Let’s Add the Contact Me Section

Let’s Add the Footer

Let’s Make the Footer Responsive

The Finishing Touches

Sharing by Exporting

The Share Workspace

Sharing With a Client

Summary