UI Development Course


Instructor-Led Online Training

  • Quality Course Duration
  • Free Digital Library Access
  • Assignments
  • Certification
  • Real-life Case Studies
  • RealTime Project

Training Schedule
Start Date & Time Duration &Seats Btach Type  
Weekdays (Mon-Fri)

Course Overview

UI Developer Training makes you an expert in concepts like HTML, HTML5, CSS, CSS3, CSS3 3D Transforms, JavaScript, jQuery, Bootstrap3, AngularJS, and Angular Architecture…. etc. and Get Ready to start UI Developer Career.

Course Covered




java script programing

Jquery,Jquery UI ,Jquery Mobile And Ajax

Course Contents


What is HTML 5
  • Browser Support
  • W3C and Web Hypertext Application Technology
  • Working Group (WHATWG). Specifications
  • Power of HTML5 in web & mobile Domains
  • Overview of updated new features
  • HTML5 Syntax
Forms and Elements
  • color
  • date
  • datetime
  • datetime-local
  • email
  • month
  • number
  • range
  • search
  • tel
  • time
  • url
  • week
New attributes for input
  • autocomplete
  • autofocus
  • form
  • formaction
  • formenctype
  • formmethod
  • formnovalidate
  • formtarget
  • height and width
  • list
  • min and max
  • multiple
  • pattern (regexp)
  • placeholder
  • required
  • step
Video and Audio Elements
  • Media
  • audio Tag
  • video Tag
  • source Tag
  • embed Tag
  • plugins
  • youtube
Types of Elements
  • Semantic Elements Structural Elements
Migration from HTML4 to HTML5
  • HTML5 Browser Support
  • HTML5 Elements as Block Elements
  • Adding New Elements to HTML
  • Problem With Internet Explorer
  • Complete Shiv Solution
  • HTML5 Skeleton
App Cache or Offline Applications
  • Manifest File
  • Updating the Cache
  • Notes on Application Cache
Web Storage
  • Local Storage
  • Session Storage
Web Workers
  • Browser Support
  • What is webworker
  • Check Web Worker Support
  • Create a Web Worker File
  • Create a Web Worker Object
  • Terminate a Web Worker
  • Reuse the Web Worker
Server Sent Events - One Way Messaging
  • Browser Support
  • Receive Server-Sent Event Notifications
  • Check Server-Sent Events Support
  • Server-Side Code
Drag and Drop API
  • Browser Support
  • Make an Element Draggable
  • What to Drag - ondragstart and setData()
  • Where to Drop - ondragover
  • Do the Drop - ondrop
  • Drag image back and forth
File API
  • Accessing File Information
  • Reading File Content
  • Introduction
  • Browser Support
  • Core Methods
  • Opening Database
  • Executing queries
  • INSERT Operation
  • READ Operation
Canvas Overview
  • Lines
  • Curves
  • font
  • Image
  • Paths
  • Shapes
  • Color
  • gradients
  • What is SVG?
  • SVG Advantages
  • Differences Between SVG and Canvas
  • Rectangle
  • Circle
  • Ellipse
  • Line
  • Polygon


Introduction to css3
  • CSS 2.0 vs CSS 3.0
  • whats new in css3.0
  • box-shadow
  • border-image
  • border-radius
  • background-clip
  • background-origin
  • background-size
  • Multiple Background Images
  • Linear Gradients
  • repeating-linear-gradient
  • Radial Gradients
  • repeating-radial-gradient
text effects and @FONT Face
  • text-shadow
  • word-wrap
  • Font Formats
  • Browser Support for Font Formats
  • Using The Font
  • Working with third party plugins
2D Transforms
  • transform
  • transform-origin
  • translate(x
  • y)
  • translateX(n)
  • translateY(n)
  • scale(x
  • y)
  • scaleX(n)
  • scaleY(n)
  • rotate(angle)
  • skew(x-angle
  • y-angle)
  • skewX(angle)
  • skewY(angle)
3D Transforms
  • rotateX()
  • rotateY()
  • rotateZ()
RGBA, Box Resize, Box Sizing ,Outline Transitions
  • @keyframes. animation. animation-delay
  • animation-direction
  • animation-duration
  • animation-iteration-count
  • animation-name
Multiple Columns
  • column-count
  • column-fill
  • column-gap
  • column-rule
  • column-rule-color
  • column-rule-style
  • column-rule-width
User Interface
  • box-sizing
  • resize
  • outline-offset
Media Queries
Converting Layout to HTML 5 & CSS 3
Responsive Web Designing with CSS3


Get Started
  • What is Bootstrap?
  • Bootstrap History
  • Why Use Bootstrap?
  • What Does Bootstrap Include?
  • HTML File
  • Adding Bootstrap to Your Web Pages
  • Downloading Bootstrap
  • Bootstrap CDN
  • Put Your HTML Elements Inside Containers
  • Bootstrap Browser/Device Support
Grid System
  • What is a Grid?
  • Bootstrap Grid System
  • Mobile-First Strategy
  • Grid System Rules
  • Basic Structure of a Bootstrap Grid
  • Grid Options
  • Stacked-to-horizontal
  • Small Devices
  • Medium Devices
  • Large Devices
Inputs and Forms
Bootstrap-Helper Classess
Bootstrap-Responsive Utilities
Bootstrap Layout Components
  • Bootstrap - Glyphicons
  • Bootstrap - Drop downs
  • Bootstrap - Button Groups
  • Bootstrap - Button Drop downs
  • Bootstrap - Input Groups
  • Bootstrap - Navigation Elements
  • Bootstrap - Navbar
  • Bootstrap - Breadcrumb
  • Bootstrap - Pagination
  • Bootstrap - Labels
  • Bo
Bootstrap Plugins
  • Bootstrap - Plugins Overview
  • Bootstrap - Transition Plugin
  • Bootstrap - Modal Plugin
  • Bootstrap - Dropdown Plugin
  • Bootstrap - Scrollspy Plugin
  • Bootstrap - Tab Plugin
  • Bootstrap - Tooltip Plugin
  • Bootstrap - Popover Plugin
  • Bootstrap - Alert Plugin
  • Boo

java script programing

Javascript Introduction
Dialog Boxes
Conditional Statements
Error Handling
Form Validations
Javascript Debugging
Javascript HTML DOM
Javascript RegExp
Javascript Math
Javascript OOPS Concepts
  • Objects In Javascript
  • Keyword - This
  • Call And Apply and Bind
  • Callbacks
  • Function Scope
  • Closures
  • Object Prototypes
  • The Prototype Chain

Jquery,Jquery UI ,Jquery Mobile And Ajax

Introduction Jquery
  • What is jQuery
  • Downloading and Installing jQuery
  • Creating a Simple Page in jQuery
  • Overview of jQuery Features
  • The Document Ready Function
  • How to use Custom Scripts?
  • How to use Selectors?
  • Name
  • #ID
  • .Class
  • Universal (*)
  • Multiple Elements E
  • F
  • G
  • Attribute Selector
  • hide/show
  • fade
  • slide
  • animate
  • toggle
  • stop
  • Callback
  • Chaining
  • Ancestors
  • Descendants
  • Siblings
  • Filtering
Form Selectors
Jquery Methods
  • Get
  • Set
  • Add
  • Remove
  • CSS Classes
  • css()
  • Dimensions
jQuery Events and noConflict() Method
AJAX Methods
  • load( )
  • $.get( )
  • $.post( )
  • $.getScript( )
  • $.getJSON( )
  • $.ajax( )
AJAX Events
  • ajaxComplete( )
  • ajaxStart( )
  • ajaxError( )
  • Draggable
  • Droppable
  • Resizable
  • Selectable
  • Sortable
UI Widgets
  • Accordion
  • Autocomplete
  • Button
  • Datepicker
  • Dialog
  • Progressbar
  • Slider
  • Tabs
  • Effects Effect
  • Show
  • Hide
  • Toggle
  • Color animation
  • Add class
  • Remove class
  • Toggle class
  • Switch class
  • customizing Jquery theming
  • Jquery Theme Roller
Bonus Jquery Plugins
  • Multiscroll.js
  • Slidebar.js
  • Rowgrid.js
  • Alertify.js
  • Progressbar.js
  • Slideshow.js
  • Tagsort.js
Introduction to Jquery Mobile
  • JQuery mobile introduction
  • What does jQuery mobile do
  • Pages and Dialogs
  • JQuery mobile page structure
  • Page transitions
  • Page linking
  • Dialogs and pop-ups
  • Toolbars
  • Toolbar basics
  • Header bar
  • Footer bars
  • Navbars
  • Positioning-Fixed
  • persistent
  • T
jquery Mobile-List views
  • List basic and API Basic linked list
  • Nested list Numbered list Split button list
  • List dividers
  • Thump nails Icons List formatting
  • Search filter barCollapsible list Theming etc..
jquery Mobile-Elements
  • Buttons
  • Button basics
  • Button icons
  • Inline buttons
  • Grouped buttons
  • Theming of buttons
  • Content formatting
  • Basic HTML styles
  • Layout grids Columns
  • Collapsible content blocks
  • Collapsible sets
  • Theming of contents For
jquery Mobile-Events
  • Touch events-Tap Taphold swipe swipe right left
  • Virtual mouse events- vMouseover and vMouseout
  • Pageload events
  • Scroll events

Course Features

  • Quality Course Duration
  • Free Digital Library Access
  • Assignments
  • Certification
  • Real-life Case Studies
  • RealTime Project


After completing the UI Development Course - Associate Level online training, trainees receive a training certificate from Skillsuggest.

Target Audience

This Course is best suited for the Working professionals and Job Seekers:

Trainers Details


Image Alternative text

Raj Varma

Raj Varma has already spent more than 8 years of his life in the Digital
Marketing,Web and Mobile App Development in IT industry.
His life is driven by the motto: work, learn and teach.
He is a flawless speaker who can confidently host
presentations on a wide variety of topics.
Raj 's past work experience include in fortune Organizations
Like Hitachi,Accenture,Tech Mahindra..etc..
He has delivered overwhelming results to clients over the world.


What If i Miss a Class?
We record each LIVE class session you undergo through and we will share the recordings of each session/class.
Who Are The Trainers?
Our trainers have relevant experience in implementing real-time solutions on different queries related to different topics. Skillsuggest verifies their technical background and expertise.
How Will I Execute The Practical?
Trainer will provide the Environment/Server Access to the students and we ensure practical real-time experience and training by providing all the utilities required for the in-depth understanding of the course.
If I Cancel My Enrollment, Will I Get The Refund?
If you are enrolled in classes and/or have paid fees, but want to cancel the registration for certain reason, it can be attained within 48 hours of initial registration. Please make a note that refunds will be processed within 30 days of prior request.
Will I Be Working On A Project?
The Training itself is Real-time Project Oriented.
Are These Classes Conducted Via Live Online Streaming?
Yes. All the training sessions are LIVE Online Streaming using either through WebEx or GoToMeeting, thus promoting one-on-one trainer student Interaction.
Is There Any Offer / Discount I Can Avail?
There are some Group discounts available if the participants are more than 2.
Who Are Our Customers?
As we are one of the leading providers of Live Instructor LED training, We have customers of Students and Job Seekers,working Professionals,Corporate Clients from India,USA, UK and other parts of the world.
How do I clarify my doubts during the class?
Once registered, you will be assigned a trainer who will give you live guidance throughout the duration of program.
Can I take a free class before I join the course?
Yes. We provide a demo class and one class that will help you in deciding for the course.
What are the system requirements?
All you require is a desktop PC which has a web browser installed with a high speed internet connection and microphone to get started. A broadband bandwidth of minimum 256Kbps works best for viewing our training. However, it will also work with lower bandwidth but it will take longer for the lessons to download/stream.
Do you offer job placement assistance?
Yes. This is one of the main differentiating factors from those of our competitors.Your resume will be sent to all the jobs sent to us. We have large network of companies, which are looking for candidates for job placement.
I have no idea which course to register in, what should I do?
Contact us to assist you in choosing a course that is best suited for your profile.

Download Curriculum

Thank you! your Download starts Now