UI/UX Design - Brijesh Jaiswal

Duration: 12 Weeks (3 Months)
Primary Tool: Figma (Industry Standard)
Format: 100% Online (Video Lessons + Practical UI Challenges + Portfolio Reviews)
Final Output: Two polished, high-fidelity case studies (Mobile App & Web Dashboard).

Focus: Mastering the tools and the “Laws of Sight”

Week 1: UI vs. UX & The Figma Workspace
- Topics: Defining UI/UX; Figma interface (Frames, Layers, Boolean operations); Auto Layout fundamentals.
- Activity: Designing a “Single Button” to master states (Hover, Active, Disabled).
Week 2: Visual Hierarchy & Gestalt Principles
- Topics: Scale, Contrast, Proximity, and White Space; How the human eye scans a screen (F-pattern and Z-pattern).
- Activity: Redesigning a “cluttered” landing page section using only black and white.
Week 3: Typography for Screens
- Topics: Choosing typefaces; Kerning/Leading; Creating a 1.250 (Major Third) Type Scale; Accessibility (WCAG 2.1).
- Activity: Designing a text-heavy mobile article screen with perfect readability.
Week 4: Color Theory & Modern UI Styles
- Topics: Color Psychology; The 60-30-10 rule; Neumorphism vs. Glassmorphism vs. Flat Design; Creating a semantic color palette.
- Activity: Applying a high-conversion color palette to a Fintech app mockup.

Focus: Building scalable, professional-grade interfaces

Week 5: UI Elements & Iconography
- Topics: Input fields, dropdowns, toggles, and sliders; Icon grids and pixel-perfect strokes; Using SVG libraries.
- Activity: Creating a custom 12-icon set in Figma from scratch.
Week 6: Advanced Auto Layout & Responsive Design
- Topics: Constraints; Resizing rules (Fill vs. Hug); Mastering the 8pt Grid System; Mobile-first vs. Desktop-first design.
- Activity: Turning a static desktop hero section into a fully responsive mobile component.
Week 7: Design Systems & Components
- Topics: Creating Reusable Components; Variants vs. Component Properties; The “Atomic Design” methodology.
- Activity: Building a “Mini Design System” for a fictional Travel App (Buttons, Inputs, Cards).
Week 8: Prototyping & Motion UI
- Topics: Smart Animate; Micro-interactions (Heart likes, pull-to-refresh); Designing for “delight”; User flows.
- Activity: Creating a high-fidelity “Onboarding Flow” with smooth transitions.

Focus: Putting it all together and going professional

Week 9: Lean UX for UI Designers
- Topics: User personas; Information Architecture (IA); Wireframing (Low-fi to Hi-fi); Accessibility audits.
- Activity: Creating a sitemap and wireframe for a “Sustainable Shopping” e-commerce app.
Week 10: Capstone Project Part 1 (The Mobile Experience)
- Topics: Deep dive into iOS/Android Human Interface Guidelines; One-handed navigation; Gestural UI.
- Activity: Designing three core screens of a mobile app with full interactivity.
Week 11: Capstone Project Part 2 (The Web Dashboard)
- Topics: Data Visualization (Charts and Tables); Complexity management; Dark Mode vs. Light Mode toggles.
- Activity: Designing a complex “SaaS Dashboard” with a focus on data clarity.
Week 12: The Portfolio & Developer Handoff
- Topics: Case study storytelling; Using Dribbble/Behance/Loom; Exporting assets for developers (Inspect tool).
- Activity: Finalizing your Figma file for handoff and launching your online portfolio.

Premium UI Kit: A base set of components to speed up initial learning.
Cheat Sheets: Shortcuts for Figma, WCAG Contrast ratios, and Grid templates.
E-Book: “The UI Designer’s Guide to Typography.”

Technical Expertise: Mastery of Figma’s advanced features (Auto Layout, Variants).
Visual Maturity: Ability to create “Dribbble-worthy” designs that are actually functional and accessible.
Process Mastery: Understanding how to take a project from a rough sketch to a developer-ready prototype.

Spread the love