UI Desingning

  • Last Update January 6, 2021




1.Start your course

  • What is adobe XD?
  • Installing adobe XD
  • Using the exercise files

2.Get familiar with adobe XD

  • About this section
  • The start screen
  • Learning the interface
  • A note to windows users
  • Keyboard shortcut sheet
  • The menu bar
  • The tools panel
  • The properties panel
  • Using the wire frame UI template
  • The layers panel
  • The assets panel
  • Using keyboard shortcuts
  • Copy and paste appearance
  • Prototype sharing
  • Using device preview

3.Get started with the project

  • Introduction to the Dolocal App
  • Creating artboards
  • Grids and layouts
  • Creating content wireframes
  • Designing your wireframes
  • Using repeat grids
  • Adding and formatting text
  • Adding images
  • Working with object styles
  • Working with color
  • Using color assets
  • Using character styles

4.Working with images and vectors

  • Importing icons
  • Masking images
  • Preparing images in Photoshop
  • Preparing icons in illustrator

5.Creating content in Adobe XD

  • Creating a logo
  • Creating icons
  • Using symbols
  • Design challenge
  • Completing our design

6.Prototyping and sharing

  • Why do we prototype?
  • Adding interactions to your prototype
  • Adding overlays to your prototype
  • Recording your prototype to video
  • Using mobile device preview

7.Developer Handoff

  • Exporting your designs and assets
  • Creating design specs for developers
  • Working with 3rd party apps like zeplin and ProtoPie

8.Adobe XD for power users

  • Importing sketch and Photoshop files into XD
  • Importing icons from the web and 3rd party tools
  • Using CC libraries for icons and images


  • Conclusion
18,000.00 6,000.00