Advance Website Development Course for Teenagers - Javascript Animation
Add sophisticated, interactive animations to your websites to take your front-end web design to the next level.
- How to add polish and professionalism to a webpage using JavaScript animations
- How to use easing to add character to your animations
- How to put what you learn into practice on an actual website
- The basics of the Matter.js, How to add control to objects
- How to design composites and structures
- The basics of the GreenSock Animation Platform (GSAP) and its components
- Objects, Selectors and Timeline Manipulation
- Embed animations on a web page and organize elements for web animation
Course Description
If you’re a front-end developer, UI/UX designer or just a general web animation enthusiast you’ll benefit from the techniques taught in this module.
In this module, we will be creating awesome real-world projects that will be an inspiration for the imagination. We are going to begin with the basics of the Canvas and learn how to create shapes using an HTML/css file and how to use SVG properties. And then we will see how easy to create incredible vectors by learning Matter js. After that, we will dive into GSAP animations and learn how to animate elements, how to use transform, transitions, and keyframes. And finally, we will create our own projects and learn about advanced techniques of GSAP animations.
Mode
Online / Offline
Levels
2 levels
Level Duration
48 hours
This Course Includes:
- Suggested Age: 12+ Years
- Prerequisites: WebDevelopment Program Module
- Location: Online and Classroom
- Mode of Delivery: Group Session and 1:1
- Batch Size: Maximum batch size upto 5 students per faculty for online classes
- Language: English
- Credits: End of term module completion certificate & Awards based on performance
Looking For Start Date?
1:1 starts on demand
Group batches starts several times during the years, please reach out for start dates.
Bonus Features
Completion Certificate
Performance Awards
Feedback From Instructors
1:1 Parents Teacher Meeting
Special One-Off Workshops
Entrepreneurial Skills
Detailed Curriculum
Pathway 1 : Animation FrontEnd JavaScript
Level 1
- HTML 5 Canvas Animation
- Introduction to Matter.js
- Adding Physics into objects
- Friction - Air, Ground and against bodies
- Wireframes
- Event listeners - Controls
- Adding controls to Objects
- Constraints
- Softbody, Custom composite bodies
- Designing Complex Composites and Structures
- Game Development
Level 2
- GSAP Introduction
- Objects & Selectors
- Tweens & Custom Tweens
- Timeline Manipulation
- GSAP Ease - Visualiser and Custom Ease
- GSAP - SVG
- GSAP - Scroll Trigger
- Projects Rollout
Projects You Will Work On
Matter JS
Pixie JS
GSAP
Learning Pathways Post This Module
Post completion of the module, Students can opt for these following related modules to further their learning.
Web Development : MERN STACK Development
Learn MERN Stack Development with React + Redux as Front End and Node + Express as Backend By doing Hands-On Projects
Python
Beginner friendly Python! Learn the Python basics then build inspiring Python projects
Students Portfolio
Our students have always enjoyed learning with us, as much as we have enjoyed teaching them. Check out the amazing projects created by them! Some amazing Projects created by our amazing students.
