XD Essentials Day 2

Note

On day 1, the teacher should have surveyed the class to find out how many students have experience with paths in a vector design program like Adobe Illustrator. If the class is inexperienced, plan on spending as much time teaching paths as you would in an Illustrator class and condensing the other material in the curriculum.

Objectives

• Students can use paths to make custom shapes and effects.
• Students can create various artboard sizes for expanded functionality and use groups to streamline the design process.
• Students can create a link to share a project with developers.

Outline

Introduction

• Review why XD and navigation
• Patron Badges
• Today’s topics
  • Artboard options
  • Grouping
  • Scrolling Prototypes
  • More Sharing

Design

Artboards

• Grids/Guides
  • Adding
  • Adjusting
  • Duplicating
• Scrolling

Assets

• Paths
  • Review double-click
  • Pen tool
  • Pathfinder options/Boolean operations-Live shapes!
• Grouping
  • Group/Ungroup
  • Responsive resize
  • Mask
  • Repeat Grid
• Color Spaces
  • RGB vs CMYK
  • Hex codes
• Gradients

Prototype

Two separate flows

Scrolling

• Pin Content
• Scroll To

Share

Share for Development

• How and Why

Restrict Privacy settings to “Anyone with the code”

Conclusion

• Recap
• Next Time
• Chat/Lab