{"id":2784,"date":"2022-08-21T10:26:59","date_gmt":"2022-08-21T10:26:59","guid":{"rendered":"https:\/\/ebizcourses.com\/?p=2784"},"modified":"2023-09-13T11:56:21","modified_gmt":"2023-09-13T11:56:21","slug":"superhi-animation-for-the-web","status":"publish","type":"post","link":"https:\/\/ebizcourses.com\/superhi-animation-for-the-web\/","title":{"rendered":"SuperHi &#8211; Animation For The Web"},"content":{"rendered":"<p>Animation For The Web by SuperHi &#8211; Take full control of web graphics and give your site interactions a bit of flourish with movement and animation.<\/p>\n<p>In this go-at-your-own-pace course, SuperHi has designed and produced a series of projects all about hand-coding, styling, and animating SVGs to bring scalable, performance-friendly illustrations to life in the browser.<\/p>\n<p>The course includes 12 hours of video lessons that will teach you how to handcraft animations with CSS, SVG, Javascript and GreenSock.<\/p>\n<p>You&#8217;ll learn how to craft drawings with code in Figma and then animate their motion and styling with both CSS animations and the industry standard GreenSock Animation API (GSAP).<\/p>\n<p>This is a great next step for students who already have some knowledge of HTML and CSS, or have completed our Foundation HTML, CSS + Javascript + Javascript For Designers courses.<\/p>\n<h4>What you\u2019ll learn Animation For The Web:<\/h4>\n<ul>\n<li>How to craft SVGs and SVG animations by hand.<\/li>\n<li>How to use CSS and GreenSock to animate shapes and paths.<\/li>\n<li>Create and apply special effects such as patterns and clip paths.<\/li>\n<li>How to set up timelines, sequences, and click events.<\/li>\n<li>How to make our animations feel more natural with easings and delays.<\/li>\n<li>How to start self-initiated projects working with illustrations and UI animation.<\/li>\n<\/ul>\n<p><strong>WHO THIS COURSE IS FOR<\/strong><\/p>\n<p>From graphic designers looking to bring movement to their creations to developers aiming to add a bit of pizzazz to their site interactions, this course is for anyone who wants to learn how to use animation techniques for full control of graphics on the web.<\/p>\n<p>This is a beginner course when it comes to page transitions, though we would recommend basic knowledge of HTML, CSS, and a bit of Javascript before starting. If you don\u2019t have this just yet, trying our Learn To Code Now book, or taking our Foundation HTML, CSS + JS course and our Javascript For Designers course will help you feel as prepared as possible.<\/p>\n<p><strong>WHAT YOU\u2019LL NEED<\/strong><\/p>\n<p>A computer (Windows, Mac or Linux) with the latest version of Chrome installed and a broadband internet connection. You\u2019ll also want to set up a Figma account. That\u2019s it!<\/p>\n<p class=\"has-text-align-center\" style=\"text-align: center;\"><strong>Name of Course: <\/strong>SuperHi \u2013 Animation For The Web\u00a0|\u00a0<strong>Release Date:<\/strong> 2021<\/p>\n<p class=\"has-text-align-center\" style=\"text-align: center;\"><strong>Sale Page:\u00a0<\/strong>https:\/\/www.superhi.com\/courses\/animation-for-the-web-svg-css-and-javascript<\/p>\n<p class=\"has-text-align-center\" style=\"text-align: center;\"><strong>Author Price:<\/strong> $149 |<strong>\u00a0Our Price:\u00a0<span style=\"color: #ff0000;\">Free For VIP Members<\/span><\/strong><\/p>\n<p class=\"has-text-align-center\" style=\"text-align: center;\"><strong>Delivery Method:<\/strong>\u00a0Free Download (<strong>Mega<\/strong>)<\/p>\n<p style=\"text-align: center;\"><div class=\"mepr_error\"><p style=\"text-align: center\">Download link hidden, please <a href=\"https:\/\/ebizcourses.com\/member-login\">LOGIN<\/a> or <a href=\"https:\/\/ebizcourses.com\/membership-price\/\">PURCHASE A MEMBERSHIP<\/a> to view.<\/p>\n<\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Animation For The Web by SuperHi &#8211; Take full control of web graphics and give your site interactions a bit of flourish with movement and animation. In this go-at-your-own-pace course, SuperHi has designed and produced a series of projects all about hand-coding, styling, and animating SVGs to bring scalable, performance-friendly illustrations to life in the [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":2785,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[81],"tags":[1183,1182,3014],"class_list":["post-2784","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design-courses","tag-animation-for-the-web","tag-superhi","tag-web-design","post-wrapper","thrv_wrapper"],"_links":{"self":[{"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/posts\/2784","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/comments?post=2784"}],"version-history":[{"count":4,"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/posts\/2784\/revisions"}],"predecessor-version":[{"id":8197,"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/posts\/2784\/revisions\/8197"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/media\/2785"}],"wp:attachment":[{"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/media?parent=2784"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/categories?post=2784"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ebizcourses.com\/wp-json\/wp\/v2\/tags?post=2784"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}