[udemy] 代码艺术：学习创意编码以使用 JS 生成视觉效果 | Code Art: Learn Creative Coding to Generate Visuals with JS

代码艺术：学习创意编码以使用 JS 生成视觉效果

Code Art: Learn Creative Coding to Generate Visuals with JS

学习生成艺术的基础知识，并了解如何使用 HTML 和 Javascript 开发、绘制和动画视觉效果

您将学到什么

代码艺术
创意编码
生成艺术
使用编码创建视觉效果
代码动画
Javascript 动画
Html5 画布
Html5 CTX
画布草图库
ThreeJS
制作音频可视化器
粒子效果
要求
基本数学技能
代码编辑
器 浏览器
编程经验是一个优势

描述

为什么要编码艺术？因为一旦你学会了用编码创造艺术，实际上就没有限制。

你没有视觉效果程序的界限！创意算法是数据驱动的，可以实时和交互工作。它是技术方面和设计的结合。

创意编码有多种语言和方式。我们将使用html和javascript这门课程，因为现在 javascript 无处不在。您将有机会使用 JS 使您的项目与其他技术交互。

我们将创建可以听音乐并表现不同的粒子。学习此技术后，您可以使用音频输入任何你想要的效果！当你看到制作这些动画是多么容易时，你会感到震惊。

如果你已经知道一种编程语言，这是一个很大的优势。我在哪里可以使用这些视觉效果？这取决于你！您可以创建自己的 NFT 集合。

将效果上传到您的网站，将它们放在您的作品集中，或者只是为了让它们变得有趣！为什么要开设这门课程？作为 Yeti 团队，我们正在努力创建专业的在线教育讲座。

我们正在努力使其尽可能简单。您将找到创造性编码的最佳实践。本课程由 Windows 和 Mac 用户共同创建，这意味着无论您是 Windows 用户还是 Mac 用户，您都可以充分受益。

所有学生都可以访问我们的讲师、教学的问答论坛助理和社区随时准备帮助回答您的问题并为您的成功欢呼。

本课程适用于：程序员 – 开发人员设计师自由职业者动画师图形设计师谁对另一种编程语言感到满意并想学习创意编码每个对动画、视觉效果感兴趣的人，

概述

第 1 节：Javascript 粒子

第 1 讲 开始前

第 2 讲 入门

第 3 讲 JS 中的事件监听器

第4讲画弧（圆）

第 5 讲生成原子

第6讲 破坏与模糊

第 7 讲 创造一个漂亮的星空效果

第 8 讲粒子的自定义运动（抛物线）

第 2 节：图像的像素效果

第 9 讲 什么是像素雨效果？

第 10 讲 设置项目

第11讲 JS中获取图片数据

第十二讲 创建粒子类

第13讲从2维到1维的映射

第14讲应用映射公式

第15讲绘制函数

第16讲 完成效果

第 17 讲 添加 RGB 颜色

第 3 节：Canvas-sketch 库

第 18 讲 Node 和 NPM

第19讲安装canvas-sketch

第20讲 什么是画布草图？

第21讲练习矩形

第22讲 帆布翻译

第23讲 画布旋转

第24讲 保存与恢复

第25讲随机性

第26讲 弹跳动画

第27讲 圆班

第28课 生成圆圈

第29课 动画圆

第30讲弹跳圈

第31课 欧几里得距离

第32讲画线

第33课 获取两个点之间的距离

第34讲 响应线宽

第 4 节：如何制作音频可视化器？

第35讲 简介

第 36 课 设置音频可视化器

第37讲HTML模板

第38课完整的HTML

第39讲mic.js

第40讲 获取麦克风数据

第41讲 球类

第42课 生成球

第43课 落球

第44讲 跳球

第45讲 音频输入

第 5 部分：圆形音频可视化器

第46讲 入门

第 47 课 设置

第48课 创建人物

第49讲 圆周运动

第 50 讲 用麦克风输入改变大小

第51课 播放音乐

第52课 瞬移

第 6 节：three.js 简介

第53讲 什么是three.js？

第54讲three.js的用例

第55讲 安装three.js

第56讲 打开项目

第57讲 导入three.js

第58课 创建场景和相机

第59课 创建渲染器

第60讲 创建一个立方体

第61课 渲染场景

第 62 课

第 7 节：3D 空间效果

第63课介绍

第64讲 设置

第65课 Init()函数

第66课 创造星星

第67课使用几何和材料

第68课 动画函数

第69课 完成项目

第70讲 一些three.js的例子

本课程适用于想要使用代码进行绘图的开发人员和设计人员。