Create User Interface for Apps and Design Vector Graphics

What you will learn

You could Build Prototypes for applications in XD

You could build toggle button, auto-animate, overlay, and other actions

You could build responsive design for Left navigation, status bar and toggle button

You could draw various complex shapes in Illustrator, Trace an Image and convert it to an Artwork

You could create Isometric and Perspective illustrations


In this course, you will learn about Designing User Interface with Adobe XD and Designing Vector Graphics with Adobe Illustrator. Here you will learn various tools and techniques used in the process of creating user interface and workflow for the Mobile app. User Experience Designing is a crucial step in overall application development cycle, being the early stage, it allows core team of designers, managers and developers to visualize the application with a prototype. It enables them to make sufficient changes in the UI before the code development and testing begins.

Working in the Adobe ecosystem allows its users to easily integrate with other Adobe CC software such as Photoshop and Illustrator.

What is Adobe XD?

Adobe XD is an industry recognized Designing software used for creating Design prototypes and wireframes for the Mobile applications and Websites. It is used for visualizing complete User Interface by designing individual components that lead to a overall improved User Experience.

This training would give you insight into how the interface works, all the main tools and features, and the most common shortcuts which will dramatically increase your productivity. Here you will learn how you can give life to your design and create a working prototype directly within Adobe XD, without the need of any third-party software.

Get Instant Notification of New Courses on our Telegram channel.

In Adobe XD, you will learn to-

  • Create Photo gallery with thumbnails using Repeat Grid
  • Create toggle button using component states
  • Designing and Prototyping Left Navigation panel
  • Create a prototype and auto animate
  • Designing Status and Navigation bar

What is Adobe Illustrator?

Adobe Illustrator is a vector graphics editor and design program developed by Adobe Systems and used by Creative Artists, Graphics Designers, Vector Artists, Animators, Students and others. But it is also widely used by Hobbyists and Illustrator enthusiasts.

In Adobe Illustrator you will be learning some Graphics Design tools and techniques such as-

  • Joining and combining different shapes with Shape builder
  • Creating Cloud, Mechanical Tools
  • Various editing tools such as width, knife, Envelop Distort
  • Creating Photo Masks
  • Effects such as 3D Extrude and Bevel
  • Area type tool
  • Isometric and Perspective Illustration




Getting familiar with Adobe XD

Getting started with XD
Repeat Grid
Toggle Button

Creating Prototype

Create Prototype- Auto animate ball
Designing Left Navigation
Prototyping Left Navigation
Designing Status bar and Navigation bar

Getting started with Illustrator

Shape Builder- Draw clouds
Shape Builder- Mechanical wheel gear

Image tracing and Recolor Artwork

Image Tracing
More tracing options
Recolor artwork Part-1
Recolor artwork Part-2

Other Graphics Design tools

Envelop distort- banana
Area type and knife
Photo mask- wildlife
width tool basics

Perspective and Isometric Illustration

Isometric cylinder coins extrude and bevel
isometric drawing on perspective grid
perspective pattern background