Overview
-
Learn how to use Adobe XD to design and prototype responsive layouts that can adapt to a variety of screen sizes and types.
Syllabus
-
Introduction
- Building out a responsive component library
- About the exercise files
- Components are supercharged symbols
- Exploring button design variations
- Converting objects to components
- Creating and styling component instances
- Understanding component inheritance
- The advantages of atomic design
- Using Repeat Grid with components
- Replacing nested components
- Introducing states
- Creating component states to organize content
- Adding a hover transition between states
- Adding additional custom states and transitions
- Using states for layout variations
- Building alternate layouts with responsive resize
- Applying responsive states to a slideshow component
- Using responsive resize at an artboard level
- Defining responsive resize at an artboard level
- Adjusting elements for a tablet layout
- Where to go from here
