UI/UX Designing Course (English) From 0 To Hero

Course Content

Basic Introduction Of UI/UX Designing

Introduction to UI vs UX – Career Roles & Industry Flow

Section 1: UX Research & Wireframing Basics (Figma) (Theory)

Section 2: UI Design Principles & Figma Tools Mastery (Figma) (Practical)

Section 3: Components, Prototyping & Design Systems (Figma) (Practical)

Section 4: Advanced Projects + Portfolio & Case Study (Figma) (Practical)

Section 1: UI Design in Adobe XD – Tools & Visual System (Adobe XD) (Practical)

Section 2: Components, Prototyping & Design Systems (Adobe XD) (Practical)

Section 3: Real Projects + Developer Handoff + Portfolio (Adobe XD) (Practical)

Final Test

Career Guidance And Job Assistance (Practical)

Give Us Your Feedback And Suggestions

On Demand Lessons

Software & Industry Updates

Add this certificate to your resume to demonstrate your skills & increase your chances of getting noticed.

Course Features

Course Content

Basic Introduction Of UI/UX Designing

Introduction to UI vs UX – Career Roles & Industry Flow

Section 1: UX Research & Wireframing Basics (Figma) (Theory)

Class 1: Getting Started With Figma : Account Creation

Class 2: Design Thinking & Human-Centered Design Principles

Class 3: Creating User Personas & Behavioral Segments

Class 4: User Journey Mapping, Empathy Maps & FigJam Basics

Class 5: Task Flows & User Flow Diagrams

Class 6: Information Architecture & Sitemap Creation

Class 7: Low-Fidelity Wireframing Using Figma Tools

Class 8: Competitive Analysis & UX Audit Techniques

Class 9: Structuring a Design Brief for Client/Startup Projects

Class 10: Project 1 – Wireframe a Mobile App (3–5 Screens)

Section 2: UI Design Principles & Figma Tools Mastery (Figma) (Practical)

Class 11: Figma Interface, Tools, Pages, Layers & Shortcuts

Class 12: Frames, Layout Grids, Columns & Responsive Artboards

Class 13: Color Theory, Palette Creation & Brand Guidelines

Class 14: Typography in UI – Font Pairing, Hierarchy, Readability

Class 15: UI Components – Buttons, Inputs, Cards, Alerts

Class 16: Icons & Imagery – Plugins, Libraries, Best Practices

Class 17: Designing Dashboards & Data UI (Tables, Graphs)

Class 18: Mobile vs Web – Responsive Design Workflow

Class 19: Project 2 – Full Website Homepage UI Design

Class 20: Real-Time Collaboration & Version History

Section 3: Components, Prototyping & Design Systems (Figma) (Practical)

Class 21: Components & Variants – Buttons, Navbars, Toggles

Class 22: Auto Layout, Constraints & Smart Layouts

Class 23: Design Systems Setup – Colors, Text Styles, Grids

Class 24: Prototyping Basics – Link Screens, Transitions

Class 25: Smart Animate, Hover, Tap, Overlay & Scroll Effects

Class 26: Advanced Prototyping – Modals, Multi-Page Flows

Class 27: Mobile App Prototype – Login to Dashboard

Class 28: Testing Prototype on Devices (Figma Mirror)

Class 29: Project 3 – E-commerce App UI + Prototype

Class 30: Design System Export for Developer Handoff

Section 4: Advanced Projects + Portfolio & Case Study (Figma) (Practical)

Class 31: UX Writing – Buttons, Error States, Microcopy

Class 32: Accessibility – Color Contrast, Keyboard Navigation, ARIA Basics

Class 33: UI Animation Techniques Using Smart Animate

Class 34: Using FigJam for Team Brainstorm & Flow Diagrams

Class 35: Usability Testing – Heatmaps, Screen Record Feedback

Class 36: Real Project: EdTech App or SaaS Dashboard

Class 37: Exporting Assets, Design Specs & Dev Handoff via Figma Inspect

Class 38: Building a UI/UX Portfolio – Structure & Platforms (Behance, Notion, PDF)

Class 39: Case Study Writing – Goals, Process, Solutions, Outcomes

Class 40: Final Review – Portfolio Project Presentation & Client/Job Prep

Section 1: UI Design in Adobe XD – Tools & Visual System (Adobe XD) (Practical)

How To Download Adobe XD And Install

Class 1: Adobe XD Interface & Workspace Overview

Class 2: Artboards, Grids, Layout Columns, and Guides

Class 3: UI Elements – Buttons, Input Fields, Navbars

Class 4: Color Systems, Gradients, and Accessibility Contrast

Class 5: Typography Hierarchy – Mobile & Web Design

Class 6: Using Icons, Images & Plugins in Adobe XD

Class 7: Responsive Layouts Using Constraints & Grids

Class 8: UI Design for Landing Page, Form & Cards

Class 9: Creating Web Headers, Footers & Section Layouts

Class 10: Project 2 – Full Home Page UI Design (Web or App)

Section 2: Components, Prototyping & Design Systems (Adobe XD) (Practical)

Class 11: Creating & Managing Components in XD

Class 12: States, Hover Effects, Toggle Buttons

Class 13: Building a UI Kit – Colors, Text, Buttons

Class 14: Prototype Links – Click, Hover, Swipe

Class 15: Smart Animate, Auto-Animate & Micro Interactions

Class 16: Creating Scroll Effects, Overlays, Modals

Class 17: Interactive Navigation Menu + Tab Panels

Class 18: Mobile App Prototype – Login to Dashboard

Class 19: Sharing Prototype – Cloud Link, Class Feedback, Feedback

Class 20: Project 3 – E-Commerce App UI + Full Interactive Prototype

Section 3: Real Projects + Developer Handoff + Portfolio (Adobe XD) (Practical)

Class 21: UX Writing – CTA, Error Text, Microcopy

Class 22: Accessibility in UI – Contrast, Readability, Labels

Class 23: Design Systems – Style Guide, Tokens & UI Consistency

Class 24: Adobe XD to Dev Handoff – Specs, Assets & Inspect

Class 25: Team Collaboration with Adobe Cloud & Class Feedback

Class 26: Web Dashboard UI Project – Analytics / Admin

Class 27: SaaS Product UI Project – Signup Flow to Feature Page

Class 28: Case Study Writing – Problem, Process, Solution, Impact