Course

Unit I

Introduction to UI/UX Design:
• Fundamentals of UI/UX Design: Definitions, differences, and key concepts
• Design Thinking and User-Centered Design: Processes and methodologies
• UI/UX Research Methods: User research, personas, and user journey mapping
• Introduction to Adobe XD and Figma: Interface, tools, and workspace customization
• Project: Conduct user research and create user personas
• Lab Work: Hands-on exercises to familiarize with Adobe XD and Figma interfaces and tools.

Unit II

Basic UI Design Principles:
• Visual Design Basics: Layout, color theory, typography, and iconography
• Wireframing and Prototyping: Low-fidelity wireframes and interactive prototypes
• Designing for Different Devices: Responsive design principles
• UI Components and Design Patterns: Buttons, forms, navigation, and grids
• Project: Create wireframes and a low-fidelity prototype for a web application
• Lab Work: Practical exercises on wireframing and prototyping in Adobe XD and Figma

Unit III

Advanced UI Design Techniques:
• High-Fidelity Prototyping: Creating detailed and interactive prototypes
• Advanced Visual Design: Use of animations, micro-interactions, and transitions
• Design Systems and Style Guides: Creating and maintaining design systems
• Usability Testing and Iteration: Conducting tests and iterating designs based on feedback
• Project: Develop a high-fidelity prototype with advanced interactions
• Lab Work: Practical sessions on high-fidelity prototyping and usability testing

Unit IV

UX Design and User Interaction:

• User Experience Fundamentals: Understanding user needs and behavior
• Information Architecture: Structuring content and navigation
• Interaction Design: Designing user flows and interactive elements
• Accessibility in UX Design: Ensuring designs are accessible to all users
• Project: Create a detailed user flow and interaction design for a mobile application
• Lab Work: Exercises on interaction design and accessibility in Adobe XD and Figma

Unit V

Advanced UX Design Strategies:
• Advanced UX Research Methods: A/B testing, card sorting, and heat maps
• Designing for Emerging Technologies: VR/AR, voice interfaces, and AI integration
• Collaborative Design and Handoff: Working with developers and other stakeholders
• Portfolio Development: Compiling and presenting a professional UI/UX design portfolio
• Final Project: Create a comprehensive UI/UX design project incorporating all learned techniques
• Lab Work: Final project development and peer review sessions

Course Objective:

This course provides an in-depth exploration of UI/UX design principles and practices using Adobe XD and Figma. Students will learn to design user interfaces and user experiences for web and mobile applications, covering both basic and advanced techniques. The course includes practical projects that enable students to apply their skills in real-world scenarios, preparing them for professional roles in UI/UX design.

Course Outcomes (COs):

After completing the course, learners should be able to:

• Understand the fundamental principles of UI/UX design and the differences between UI and
• Apply basic and advanced visual design principles to create responsive and user-friendly
• Conduct user research and usability testing to inform and refine design
• Develop interactive prototypes using Adobe XD and

CO – PO Mapping:

References:
1. “Don’t Make Me Think, Revisited: A Common Sense Approach to Web Usability” by Steve Krug
2. “Adobe XD Classroom in a Book (2020 Release)” by Brian Wood
3. “Figma: The Collaborative Interface Design Tool” by Kim Lennox
4. “The Design of Everyday Things” by Don Norman