• Courses
  • UI/UX Designing

UI/UX Designing

About This Course

The UI/UX Design Specialization brings a design-centric approach to user interface and user experience design, offers practical, skill-based instruction centered around a visual communications perspective.

  • 4 Months Course
  • 2 Months Internship
  • Certificate

Tools and Programs You Will Learn

240px-Bootstrap_Studio_Logo

Key Points

  • Expert Instructors to Learn from industry leading professionals.
  • Flexible Learning to Study anytime anywhere at your pace
  • Interactive Courses to Engaging materials for the best experience
  • Affordable Excellence and High-quality education at a reasonable cost

Scope

UX researcher | Information architect | UI/UX developer | Full stack UI Developer | Usability analyst | UX writer | Product Designer | Product Manager

Curriculum

The Rootsys International has been exclusively founded to groom young leaders in the art of savoir-vivre or social etiquette, Our curriculum and programmes for complete personality enhancement are designed to be a life changing experience.

PART 1 : Adobe Illustrator

Introduction to Illustrator and Vector Graphics

  • Overview of Illustrator workspace and vector drawing tools.
  • Creating basic shapes, paths, and objects.
  • Practice exercises on vector drawing fundamentals.
  • Project : Design a simple vector illustration.

Exporting and Saving in Illustrator

  • Exporting vector graphics in various formats (e.g., SVG, AI, EPS, PDF).
  • Saving Illustrator projects for compatibility and future editing.
  • Organizing artwork and assets for efficient file management.

Creating Vector Illustrations and Icons

  • Illustration techniques using Illustrator.
  • Designing icons and graphics.
  • Practice exercises on creating vector illustrations and icons.
  • Project : Design a set of icons for a specific theme or application.

Customizing Vector Art

  • Recoloring Art Work for a specific theme.
  • Project : Customize a vector art to different color theme.

Introduction to Figma and Interface Overview

  • Understanding Figma interface and tools.
  • Basic UI design principles.
  • Using Layers and Groups.
  • Project : Design a simple landing page using Figma’s basic features.

UI Design Fundamentals in Figma

  • Design Principles for User Interface Design.
  • Typography and Text Styles in Figma.
  • Color Theory and Palette Creation.
  • Project : Make the Designed Landing page more attractive

Design Systems and Component Libraries

  • Creating and managing design systems in Figma.
  • Using component libraries for scalable designs.
  • Design consistency and brand guidelines enforcement.
  • Project : Add some hovering and other action button to the landing page.

Advanced UI Techniques and Components

  • Creating Custom Components and Libraries.
  • Using Auto Layouts for Responsive Design.
  • Designing Interactive UI Elements.
  • Project : Make the landing page Responsive to different screens

Advanced Prototyping and Interaction Design

  • Advanced prototyping techniques in Figma.
  • Micro-interactions and animated transitions.
  • Designing for responsive and adaptive layouts.
  • Project : Design a advanced dashboard and a mobile application.

Collaboration and File Sharing

  • Collaborative design in Figma: Teams and sharing settings.
  • Version control and design history management.
  • Integrating feedback and comments from team members.
  • Project : Create a project and add team members and design file to it.

Design Handoff and Developer Collaboration

  • Exporting assets and design specifications for developers.
  • Handoff tools and plugins integration.
  • Collaborating with developers for design implementation.
  • Project : Export assets from the project in different formats like png, svg etc.

Introduction to Adobe XD and Prototyping Basics

  • Overview of Adobe XD interface and prototyping tools.
  • Creating wireframes and interactive prototypes.
  • Practice exercises on basic prototyping techniques.
  • Project : Design a simple website wireframe in Adobe XDFrames and Masking
  • Understanding frames in adobe xd
  • Make clipping mask.
  • Giving prototype to frames.
  • Project : Design an slide in overlay menu.

Components and Variables

  • Understanding Components in xd.
  • Making different varients in a components.
  • Adding a component to a frame.
  • Project : Design an accordion menu.

Designing User Interfaces and Interactive Prototypes

  • Creating UI designs for web and mobile applications.
  • Adding interactive elements and transitions.
  • Project : Design a simple website and mobile app prototype in Adobe XD.

Introduction to Bootstrap Studio

  • Overview of Bootstrap Studio interface and tools.
  • Understanding Bootstrap framework and components.
  • Creating basic layouts and responsive designs.
  • Project : Design a simple webpage using Bootstrap components. Bootstrap Components and Plugins
  • Utilizing Bootstrap components such as navbars, carousels, and modals.
  • Integrating Bootstrap plugins for enhanced functionality.
  • Customizing components and plugins to match design requirements.
  • Project : Design a portfolio website showcasing various Bootstrap components and plugins.

Advanced Layout Design

  • Utilizing Bootstrap components such as navbars, carousels, and modals.
  • Integrating Bootstrap plugins for enhanced functionality.
  • Customizing components and plugins to match design requirements.
  • Project : Develop a multi-page website with custom layouts.

Advanced Layout Design

  • Utilizing Bootstrap components such as navbars, carousels, and modals.
  • Integrating Bootstrap plugins for enhanced functionality.
  • Customizing components and plugins to match design requirements.
  • Project : Develop a multi-page website with custom layouts.

Version Control and Collaboration

  • Using version control tools within Bootstrap Studio.
  • Collaborating with team members on projects.
  • Managing project assets and updates efficiently.
  • Project : Collaborate with team members on a complex web project using  version control and collaboration features.

Optimization and Deployment

  • Optimizing web assets for performance and speed.
  • Testing and debugging web applications in Bootstrap Studio.
  • Deploying web projects to hosting platforms.
  • Project : Optimize and deploy a fully functional web application developed in Bootstrap Studio.
Scroll to Top