UI/UX Design Course – Complete Beginner to Pro Training in UX & UI Design

Master UI/UX design from beginner to pro. Learn user interface & experience design with practical training, projects, and pro-level techniques.

Course Outline

Module1-Introduction

◻️What is UI/UX Design

◻️How to access the community PDFs

Module 2-UIUX Design principles

◻️Intro. To Design principles

◻️Layout

◻️Visual hierarchy

◻️Visual noise

◻️Iconograph

◻️Topography

◻️Contrast

◻️Color pallette

◻️Spacing

◻️Grids

◻️Consistency

◻️Laws of UX

Module 3-Figma academy

◻️Introduction to figma

◻️Figma environment

◻️Shapes, images, editing shapes.

◻️Layer basics

◻️Pen & pencil

◻️Boolean operation

◻️Masks, measurements, texts

◻️Auto layout

◻️Constraints and adaptive layouts

◻️Styling fill stroke effects

◻️Text and color styles

◻️Components and variants

◻️Interactive components

◻️Layout Grids, plugins, exporting

◻️Collaboration and commenting

◻️Important keyboard shortcuts

◻️Variables & Dev mode.

Module 4- UI elements

◻️Intro to UI elements

◻️Buttons, Test fields, Sliders, Tooltips, selection controls, Cards, Dialogs, Lists, Tables, Navigation, Charts, Snackbars.

Module 5- Master colors in UIUX Design.

◻️The importance of colors in UIUX Design

◻️Color mode, color ingredients, master the color wheel , Different types of colors, Color Harmonies, color contrast, color schemes.

◻️Introduction to color psychology

◻️Gender differences or preferences

◻️How to create a color for your project

◻️How to choose your base color

◻️How to choose an accent color

◻️How to choose background colors

◻️Semantic colors in UI design

◻️What is a color scale

◻️What is grayscale

◻️How to apply a color to your design

◻️How to create great gradients

◻️What is color accessibility

◻️Validate your color and contrast ratio

◻️Useful tools for accessibility

Module 6- Web design project

Module 7- UI Design Challenge

Module 8 – Advanced Prototyping

◻️What is prototyping

◻️Types of UI Animation

◻️Basics prototyping in figma

◻️Animated like button

◻️Variants and interactive components

◻️Animated switches

◻️Animated Sliders

◻️Animated cards

◻️Animated Texts

◻️Interactive Dropdown menu

◻️Animated notification

◻️iPhones dynamic island

◻️3D animation in figma

◻️Loading animation

◻️Animated mesh gradient

◻️Scroll animation

◻️Animated Tab Bar

◻️Animated image carouse

◻️Animated floating action button

◻️Accordion effects.

Module 9- conclusion

◻️What’s Next..

Get complete course for N10000 only!