web中的动画

Animation for the Web

在这个按你自己的节奏进行的课程中,SuperHi 设计并制作了一系列关于手动编码、样式和动画 SVG 的项目,以在浏览器中为生活带来可扩展、性能友好的插图。

该课程包括 12 小时的视频课程,将教您如何使用 CSS、SVG、Javascript 和GreenSock手工制作动画。

您将学习如何使用 Figma 中的代码制作绘图,然后使用 CSS 动画和行业标准 GreenSock Animation API (GSAP)为其运动和样式设置动画。

对于已经了解 HTML 和 CSS 或已完成我们的基础 HTML、CSS + Javascript + Javascript For Designers课程的学生来说,这是一个很好的下一步。

你会学到什么

如何手工制作 SVG 和 SVG 动画。

如何使用 CSS 和 GreenSock 为形状和路径设置动画。

创建和应用特殊效果,例如图案和剪辑路径。

如何设置时间线、序列和点击事件。

如何通过缓动和延迟使我们的动画感觉更自然。

如何开始使用插图和 UI 动画的自创项目。

本课程适用于谁

从希望为他们的创作带来动感的平面设计师到旨在为其网站交互添加一点活力的开发人员,本课程适合任何想要学习如何使用动画技术来完全控制网络上的图形的人。

这是一门关于页面转换的初学者课程,但我们建议在开始之前了解 HTML、CSS 和一些 Javascript 的基本知识。如果你还没有这个,试试我们的 Learn To Code Now 这本书,或者参加我们的基础 HTML、CSS + JS 课程和我们的 Javascript For Designers 课程将帮助你尽可能地做好准备。

你需要什么

安装了最新版本的 Chrome 和宽带互联网连接的计算机(Windows、Mac 或 Linux)。您还需要设置一个Figma帐户。而已!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。