Tuesday, 29 November 2016

UI Developer Online Training

UI DEVELOPER ONLINE TRAINING @ VIVANTA IT LABS
An online course designed to make you an expert in UI Developer Training and learn all that is required to create UI web solutions and develop GUIs in clean, structured and maintainable format.
User Interface is the field of human-machine interaction. The goal of user interface design is to make the user’s interaction as simple and efficient. It reduces the gap between requirements and iterative implementation, produces structured systems and associated with code generation method. UI Developer training will enhance the ability to create browser-based user interfaces and UI web solutions from the requirements stage to deployment onto the production web farm.

UI Developer Training Overview

Vivanta IT Labs is the pioneers in UI Developer training deliver the customized curriculum which explain the brief concepts of HTML, CSS, Java Script and also by the end of the course students would be capable of developing web pages, graphics, GUIs in clean, structured and maintainable format. The sessions are interactive with hands-on thought  by 10+ year real-time experienced Professionals.

UI Developer Training Curriculum

HTML

HTML Fundamentals Introduction

HTML documents
Demo: using doctype
The head element
Demo: using <head>
The body element
Using id and class attributes          

HTML Text

Headings
Demo: Headings
Block vs. Inline Elements
Demo: Block and Inline Elements
Whitespace
Demo: Whitespace
Additional Text Elements
Demo: Additional Elements

HTML Lists

List Types
Demo: Creating Lists
Demo: List Rendering

HTML Links  

Link concepts
Demo: Linking Documents
Understanding Targets
Demo: Linking to Targets
Additional Link Attributes

HTML Tables

Table Elements
Demo: Structuring a Table
Table Data
Spanning Columns and Rows
Formatting Tables
Demo: Table Formatting

HTML Form and Form Elements

Introduction
HTTP Get Request
HTTP POST Request
Form Input Elements

HTML forms fundamentals

Form Basics
Demo: Form Basics
Form Settings
Demo: Form Settings

HTML form inputs

Text inputs
Demo: Text inputs
Selections
Demo: Selections
Input attributes
Demo: Input attributes

HTML Images and Objects

Image and Object Concepts
Demo: Adding Images
Demo: Adding Objects

HTML5

Introduction to HTML5

Limitations of HTML4
Introduction and Advantages of HTML5
First HTML5 Document
Overview of New Features of HTML5

Page Layout Semantic Elements

Header
Navigation
Section & Articles
Footer
Aside and more

Form Elements and Attributes 

New Input Types
New Elements in Form
New Attributes in Form Tag
New Attributes in <input> Tag

Working with Canvas

Coordinates
Path and Curves
Drawing Lines, Rectangles and Circles
Text and Font
Color Gradiations
Drawing Images

Scalable Vector Graphics (SVG)

Understanding SVG
Benefits of SVG
Using SVG Tag
Comparing with Canvas

Media – Audio and Video

Audio and Source tags
Video and Source tags
Track tag
Mime types supported
Browser Compatibility
Programming using Javascript

Drag and Drop

Drag and Drop Events
Programming using JavaScript

Web Storage

Overview
Local Storage
Session Storage
Browser Compatibility

CSS

Working with CSS

Introduction to CSS
Understanding Document Object Model
Introduction to style sheets
CSS Syntax
CSS Comments

The CSS Rules

Ways to work with CSS
External style sheet
Internal style sheet
Inline style

CSS Selectors

The element Selector
The id Selector
The class Selector
Grouping Selectors

The CSS Cascade             

Background Color
Background Image
Background Image – Repeat Horizontally or Vertically
Background Image – Set position and no-repeat

CSS Fonts & Typography

CSS Font Families
Font Style
Font Size
Text Color
Text Alignment
Text Decoration
Text Transformation

Working with Links and List

Styling Links
Common Link Styles
List Item Markers
Image as The List Item Marker

Working with Table

Table Borders
Collapse Borders
Table Width and Height
Text Alignment
Table Padding
Table Color

CSS Color & Positioning

Web colors
hex colors
Color tools

CSS Box Model

Working with Content
Working with Padding
Working with Border
Working with Margin

CSS Display and Positioning

CSS Display and Visibility
How Elements Float
Turning off Float – Using Clear
Static Positioning
Fixed Positioning
Relative Positioning
Absolute Positioning

CSS3

Working with CSS3        

Introduction to CSS3
Selectors
Box Model

CSS3 Borders

Working with border-radius
Working with box-shadow
Working with border-image

CSS3 Backgrounds

background-size
background-origin

CSS3 Gradients

Linear Gradients
Radial Gradients

CSS3 Text Effects            

text-shadow
word-wrap

CSS3 Web Fonts

Creating custom fonts
Font Descriptors

CSS3 2D Transforms

Working with translate
Working with rotate
Working with scale
Working with skew
Working with matrix

CSS3 3D Transforms

Working with rotateX
Working with rotateY

CSS3 Transitions and Animations

Working with Animations
Working with Transitions

JavaScript

JavaScript

Variables
Arrays
Strings
Loops
If/else and equivalence
Object Literals
JSON
Functions
Scope and Hoisting

jQuery

jQuery – Introduction

JQuery Library
First JQuery Example
The Document Ready Function
How to escape a special character

jQuery – Selectors

Basic Selectors
Precise Selectors
Combination of Selectors
Hierarchy Selectors
Selection Index Filters
Visibility Filters
Forms Selectors
Forms Filters

Find Dropdown Selected Item

jQuery – Document Traversal

Getting a specific DOM element

jQuery – Event

Events Helpers
Attach Event
Detaching Events
Events Triggering
Live Events

jQuery – Effects

jQuery – HTML Manipulation

jQuery – UI

Working with UI frame work
Live examples

Bootstrap3

Working with Bootstrap 3

Introduction to Bootstrap 3
Bootstrap History
Why Bootstrap
Embedding Bootstrap in to page

Bootstrap Grid System

Importance of Grid System
Grid Classes
Bootstrap Stacked/Horizontal
Bootstrap Grid Small
Bootstrap Grid Medium
Bootstrap Grid Large
Bootstrap Grid Examples

Bootstrap Text/Typography

Working with Text
Working with Contextual Colors and Backgrounds

Bootstrap Images           

Rounded Corners
Circle
Thumbnail

Bootstrap Jumbotron

Inside Container
Outside Container

Bootstrap Buttons

Button Styles
btn-default
btn-primary
btn-success
btn-info
btn-warning
btn-danger
btn-link
Button Sizes
btn-lg
btn-md
btn-sm
btn-xs
Active/Disabled Buttons

BS Button Groups

Vertical Button Groups
Nesting Button Groups & Drop Down Menus

Bootstrap Glyphicons

Glyphicon Syntax
Badges
Progress Bars

Bootstrap Pagination

Basic Pagination
Active State
Disabled State
Pagination Sizing

Bootstrap Pager

Bootstrap List Groups

Bootstrap Forms

Bootstrap Inputs

Bootstrap Carousel

Bootstrap Plugins

Overview
Transition Plugin
Collapsible Plugin
Modal Dialog Plugin
Dropdown Plugin
Scrollspy Plugin
Tab Plugin
Tooltip Plugin
Popover Plugin
Alert Plugin
Button Plugin
Carousel Plugin
Affix Plugin

AngularJS

Introduction to Angular               

Angular Architecture
Working with Angular
Angular Version and Tools
Angular Seed

Controllers and Markup

Introduction to AngularJS Controllers
Controllers and Scope
Creating Controllers
Working with border-image

Working with colocations in AngularJS 

Displaying Repeating Information
Demo with ng-repeat

Working with events in AngularJS

Handling Events
Event Scope
Event Directives

Built-in Directives

Working with built in directives
Other Directives

Working with Expressions in AngularJS

Expressions

Working with Expressions in Filters

Understanding Filters
Built-in Filters

Two Way Binding in AngularJS

Impotence of two way binding
Two Way Binding Demo

Validation

Importance of validation
Working example

Creating and Using Services

Introduction of services in AngularJS
Understanding importance of Services
Working with and Example

FEEL FREE TO CONTACT US

Your feedback is valuable to us. Please send us your suggestions.

USA OFFICE

INDIA OFFICE

Posted by at No comments:
Subscribe to: Comments (Atom)