Create 2D Animation with CSS animations (CSS3 methods), interactive examples & projects .
Instructed by: Faizan ali zafar | Subject: Development, Web Development
Instructed by: Faizan ali zafar | Subject: Development, Web Development
Description
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 - Transformations Section 2. Transition Animations in CSS3 Section 3. Keyframe animations in CSS3 + 1 mini project Section 4. Projects Examples and projects:- Animated button Animated colored box Moving ball animation mini project This Course Is Apply in - Freelance web developer/designer web apps and web pages Animated scenes - Moving balls, Bouncing balls web games more interactive What will you learn in our course? Course Content Section 1. Transforming your website's elements using CSS 1. Section Introduction 2. Translating elements using CSS3 3. Translating elements using CSS3 Part 2 CSS3 Prefixes 4. Translating elements using CSS3 Part 3 5. Rotating elements using CSS3 6. Rotating elements using CSS3 - part 2 7. Scaling elements using CSS3 8. Skewing elements using CSS3 9. Matrix property 10. Adding multiple transformations effects to a single element Section 2. Transition Animations in CSS3 1. Section Introduction 2. Creating basic transitions 3. Change more than one property or style during a transition 4. Using transformations with transitions 5. Delaying a transition 6. Apply speed curves to your transition 7. Transition shorthand Section 3. Keyframe animations in CSS3 + 1 mini project 1. Section Introduction 2. Creating a keyframe 3. Keyframes with percentages -multiple intermediate states 4. Multiple animationstyle changes with one keyframe 5. Delaying the keyframe animation 6. Specifying the number of times the animation should repeat 7. Speed curve of the keyframe animation 8. Speed curve - Cubic Bezier funtion 9. Mini project - Moving ball animation part 1 10. Mini project - Moving ball animation - part 2 11. Direction of the animation 12. Pausing or running the animation 13. Animation fill mode property 14. Animation shorthand property 15. Applying multiple animations keyframes on one element Section 4. Projects 1. HTML5 building blocks of the fish tank animation 2. Finish designing the fish tank animation web page 3. Animate the fishes using keyframes 4. Animate the bubbles using keyframes 5. Project #2 - Card Flipping Project So, what are you waiting for? Enroll now and embark into the wonderful world of CSS aimations. Who this course is for: If you want to learn how to create web animations if you want to learn 2D Animation If you want to learn an easy shortcut to creating awesome website and web game animations If you want to learn how to create transforms, transitions and keyframes like the pros do
@https%3A%2F%2Fwww.udemy.com%2F2danimationwithcss3%2F%3Futm_medium=linkshare%26couponCode%3DFAZIES22
Course Info
- 39 Lectures
- 3 Hours
- Language: Urdu
- Subject: Development, Web Development
- Instructed by: Faizan ali zafar
- Platform: Udemy
