YoVDO

Adobe XD to Editor X Tutorial

Offered By: Codex Community via YouTube

Tags

Adobe XD Courses Web Design Courses Content Management Courses

Course Description

Overview

Learn how to convert an Adobe XD design to an Editor X website in this comprehensive 17-minute tutorial. Follow along as the instructor recreates a Frontend Mentor challenge, covering the entire process from header to footer. Master techniques for importing and resizing assets, creating responsive layouts using containers, and implementing design elements such as logos, menus, and hero sections. Gain valuable insights into no-code development and website creation while exploring features like text scaling, grid systems, and color management. By the end of this tutorial, you'll have the skills to efficiently transform Adobe XD designs into fully functional Editor X websites, enhancing your web development capabilities.

Syllabus

Intro
Design Overview
Create a New Site
Import Assets
Header
Logo
Menu
Header Text
Arrow
Text scaling
Grid
Import Image
Expand Image
Copy Paste
Progress Report
Adding Images
Resize Containers
Adding Hex Values
Client Testimonials
Avatar
Testimonial
Color
Footer
Header Logo
Social Links
Social Bar
Comparison
Conclusion


Taught by

Codex Community

Related Courses

User Experience Responsive Hero in XD for Beginners
Coursera Project Network via Coursera
Customer Journey Prototyping in XD
Coursera Project Network via Coursera
Fashion E-Commerce in XD
Coursera Project Network via Coursera
Ultimate Web Designer & Web Developer Course
Udemy
Web Design com Adobe XD, Bootstrap, GIMP, HTML e Photoshop
Udemy