UI:
1. HTML 4 and HTML 5:
- Introduction of HTML
- Tag, Elements and Attributes
- Basics syntax
- Table
- List
- Forms
- Structure of HTML4 and HTML5
- Semantic and non-semantic tags
- HTML 5 Features
- New Input type Forms Attribute
- SVG
- Canvas
- Audio, Video Tag
2. CSS:
- Attributes (ID, Class, Style, Title )
- CSS Types (Inline, Internal, External)
- Box-model
- Display Property (Block, Inline, None)
- Visibility-Hidden
- Position Property(Static, Relative, Absolute, Fixed )
- Z-index Property
- Combinators ( Child Selector,Adjacent Sibling Selector
- Descendant Selector, General Sibling Selector)
- CSS Pseudo-classes ( Visited, Hover,Link,,Active)
- CSS Pseudo-elements ( Selection,First Letter,First Line, Before After)
- K. Static Web Page
- Viewport Meta tag
3. CSS 3:
- Background, Multiple Backgrounds
- Font Related Features (online fonts)
- Text-Effect and Box-Effect
- Gradients-Line a and Radial
- Transition
- Transformation
- Animation
- Media Queries
4. Bootstrap:
- What is Components of Bootstrap ? Need of Bootstrap Components? Benifits of Bootstrap Components
- Types of Bootstrap Components Glyphicons Component
- Process to use Glyphicons Component?
- Bootstrap Dropdown Menu Component?
- What is Button Toolbar and Button Groups ?
- Way to use Button Toolbar and Button Groups ?
- Different Input Groups Components
- What si Tabs Components & Navigation Pills?
- How to use Tabs Components and Navigation Pils
- Navbar Component
- Process to build a Responsive Navbar?
- How to controls to Navbar and other Add Forms
- How to Fix the position of navbar?
- What si Breadcrumb Component?
- What si Pagination Component?
- How to apply Pagination in Application?
- What is Labels / Badge Components?
- What is Jumbotron / Page Header Components?
- What is Thumbnail Component?
- What is Alerts & Dismissible Alerts?
- How to Create Progress Bar?
- What is Media Objects Component?
- Why Media Objects Component?
- How to use Media Objects Component? What is
- Bootstrap List Group Component? What is
- Bootstrap Panel Component
5. Bootstrap Plug-Ins:
- What is Bootstrap Plug-Ins
- Why Bootstrap Plug-Ins?
- How to use Bootstrap Plug-Ins
- What is Transition Plug-in?
- What Modal Dialog Box?
- What are the different Properties,
- Methods and Events of Modal Dialog Box?
- What is Scrollspy Plug-In?
- What is Tab Plug-in? How to use Tab Plug-in?
- What is Dropdown Plug-in?
- What is Tooltip Plug-in?
- How to use Button Plug-in?
- What are the different methods and events
- of Tooltip Plug-in? What is Popover Plug-in?
- What is alert and Button Plug-ins?
- What is Collapse Plug-in?
- Types of Methods Properties and Events of
- Colapse Plug-in? What is Carousel Plug-in?
UX (Graphics)
Introduction :
- Overview of Figma Features
- What is User Experience Design? Overview of
- the Design Process
- Getting Started with Figma
- Navigating the Figma User Interface Designing a
- Web Application
- Working with UI Elements and Content Making a
- Design Responsive
- Exporting the Design
- Reusing Design Elements
- Creating a Portfolio Project
- Managing Requirements
- Best Practices for Delivering a Polished Design
Photoshop:
- Black & White to Colour
- Day To Night
- Restoration
- Image Manipulsion
- Double Exposure
- Gradient Effect
- Digital Painting
- Poster Design
- Social Media Post
- Typography
- Matte Painting
- GIF
- Logo
Illustrator:
- Workspace overview of Adobe
- Illustrator
- Illustrations
- Masking and wraping
- Working with text (Typography)
- Understanding Effects & Filters (Logo)
- Create layouts with using perspectives
- Color the illustrations by using flat
- color and gradients Logo Designing
- Design – Magazine cover
- Design – Advertisement -1 ( News Paper, Branding) Design – Flyer ( Product Launch)
- Printing techniques