Expired2D Animation with CSS3 Animations Live Example + Projects

CSS3, and along with it, CSS Animations were released a few years ago, and they’ve have made your learning process MUCH easier.If you know the very basics of HTML and CSS, which anyone who has anything to do with coding/web design does, you’re all set.Spend a few hours learning a bunch of CSS3 Animation syntaxes, and you’ll be creating awesome web effects and keyframe animations in no time at all!Anyone can become a web animator now.How is this course designed? Our course has 4 Section, where each module will thoroughly explain the intricacies of one of the concepts in CSS Animations with a wealth of over-the-shoulder examples.Section 1 – TransformationsSection 2. Transition Animations in CSS3Section 3. Keyframe animations in CSS3 + 1 mini projectSection 4. ProjectsExamples and projects:-Animated button  Animated colored box  Moving ball animation mini projectThis Course Is Apply in –

1. Freelance web developer/designer
2. web apps and web pages
3. Animated scenes  – Moving balls, Bouncing balls
4. web games more interactive

What will you learn in our course? Course ContentSection 1. Transforming your website’s elements using CSS1. Section Introduction2. Translating elements using CSS33. Translating elements using CSS3 Part 2 CSS3 Prefixes4. Translating elements using CSS3 Part 35. Rotating elements using CSS36. Rotating elements using CSS3 – part 27. Scaling elements using CSS38. Skewing elements using CSS39. Matrix property10. Adding multiple transformations effects to a single elementSection 2. Transition Animations in CSS31. Section Introduction2. Creating basic transitions3. Change more than one property or style during a transition4. Using transformations with transitions5. Delaying a transition6. Apply speed curves to your transition7. Transition shorthandSection 3. Keyframe animations in CSS3 + 1 mini project1. Section Introduction2. Creating a keyframe3. Keyframes with percentages -multiple intermediate states4. Multiple animationstyle changes with one keyframe5. Delaying the keyframe animation6. Specifying the number of times the animation should repeat7. Speed curve of the keyframe animation8. Speed curve – Cubic Bezier funtion9. Mini project – Moving ball animation part 110. Mini project – Moving ball animation – part 211. Direction of the animation12. Pausing or running the animation13. Animation fill mode property14. Animation shorthand property15. Applying multiple animationskeyframes on one elementSection 4. Projects1. HTML5 building blocks of the fish tank animation2. Finish designing the fish tank animation web page3. Animate the fishes using keyframes4. Animate the bubbles using keyframes5. Project #2 – Card Flipping ProjectSo, what are you waiting for? Enroll now and embark into the wonderful world of CSS aimations.