Software Used

• Figma
• Abode XD
• PhotoShop
• Illustrator
• Miro
• OverFlow
• Balsamiq
• cc
• FlowMap
• Timplee
• UserFlow Kit

Introduction to UX and UI

Introduction to User Experience

• Concept of UX
• Design thinking
• Trends in UX
• What is User Interaction

Module 1 – UX Design Process

• Tools and Method used for Research
• User Needs and its Goals
• Know about Business Goals
• Visual Design Principles
• Information Design and Data Visualization
• Interaction Design
• Elements and Widgets

Module 2  –  Research

• Importance of User Research in UX Design
• User Experience research techniques
• User personas / User Stories
• Creating Scenarios
• Empathy mapping
• Stakeholder Interview
• User Interviews / Observation
• Affinity Mapping
• User research method: Surveys.
• Identifying Appropriate Research Methods
• Defining user research goals, objectives and questions.

Module 3 – Analysis

• Competitor analysis
• User Centered analysis
• Data analysis

Module 4 – Designing Interactions

• Define problem
• Requirement definition
• Brainstorming & Ideation Techniques
• Information Architecture
• Task flow

Module 5 – Design Principles UI Design

• UI Elements-Patterns
• Interaction Principles & Interaction Behavior
• Master the Brand Platforms & Style Guides
• Become familiar with comments and current UI patterns

Module 6 – Principles of Sketching

• Core Responsive Design
• Wire framing vs Wire flows
• Click through Wire framing Prototyping
• Wire flow Creation

Module 7 – Product Thinking

• Product Vs. Project
• Product Design Approach
• Product Evolution
• Product Roadmap
• Handling Product Design

Module 8 – Colour Theory & colour scheme

• What is colour theory?
• Colours & emotions
• Colour scheme tools
• Screen Design

Module 9 – Introduction to Grid

• What is Grid?
• Types of grid
• Ratios
• Photoshop Grids & Plugins
• Use of grids in UI design
• Screen Design with grid using Figma

Module 10 – Visual Designing for Mobile & Web

• OS, devices & resolutions
• Principles of mobile design / web design
• Mobile / Web UI patterns & inspirations
• Screen design – Using Figma

Module 11- Brand Adaption for UI Design

• Understanding branding
• Visual and Graphic elements of branding
• Brand guidelines
• Brand adaption for UI Design

Module 12 – Wire framing  and Prototyping

• What is a Wireframe?
• Why should I use wireframes?
• How to use wireframes
• Different types of wireframes
• Digital & Non-Digital methods Low & High fidelity wireframes
• Intro to UI design patterns Responsive Design

Module 13 – Low & High fidelity

• Design and Designing for Accessibility
• Building High-Fidelity Mock-ups
• Designing Efficiently with Tools
• Interaction Patterns

Module 14 – Understand Style guides ,elements, Prototyping

• Style guides
• color palette
• UI elements, photography or imagery, and illustration
• Design animations and interaction patterns for key UI elements

Module 15 – Building blocks of UI design

• Elements & principles of design
• Iconography – Worksheet
• Typography for digital media

Module 16 – Frameworks

• Understand Frameworks
• Understand Grid System
• Material Grid System
• Bootstrap Grid System
• React Grid System
• Responsive Design

Photoshop

• What is Photoshop
• Features and tools of Photoshop

Illustrator

• What is illustrator
• Features and tools of illustrator

Font Selection & Text Presentation

Icon Creation & Assets Creation

Design Recreation

Learn Prototype Animation

Portfolio Development

Projects Figma & AdobeXD

• Designing UI for Mobile Screen in Figma
• Designing UI for Web Screen in Figma
• Designing UI for Mobile Screen in AdobeXD
• Designing UI for Web Screen in AdobeXD