内容 隐藏
1 从头开始学习 Three.JS 和着色器
2 Learn Three.Js and Shaders from scratch
2.1 你将学到什么
2.2 要求
2.3 描述
2.4 本课程适合谁：

从头开始学习 Three.JS 和着色器

Learn Three.Js and Shaders from scratch

学习掌握Three.Js和着色器所需的一切，以构建沉浸式创意网站

你将学到什么

  • 如何安装 ThreeJs 库并将其导入到您的项目中
  • 通过大量演示和示例代码了解 ThreeJs 的基础知识
  • 了解 ThreeJs 场景、相机和渲染器
  • 在 ThreeJs 中创建我们的第一个场景
  • 如何移动对象并为其设置动画
  • 了解 Webpack、NodeJs 以及向浏览器客户端提供 ES6 模块。
  • 我们将讨论 Gsap 包以及如何使用它
  • 如何缩放 3D 场景并根据显示屏做出响应
  • 了解长方体、球体、平面、环面、环面结等几何形状
  • 了解长方体、球体、平面、环面、环面结等几何形状
  • 了解一些项目的制作秘密
  • 了解Basic、Normal、Lambert、Phong、Standard、Matcap等材质
  • 了解凹凸贴图和位移贴图
  • 学习 Data GUI 面板
  • 与光和影相关的一切都将被涵盖
  • 我们将深入研究 OrbitControls
  • 我们还将学习如何使用粒子创建令人惊叹的场景
  • 了解模型加载器，例如 OBJ、GLTF、DRACO、FBX 等
  • 如何使用 Raycaster 以及如何使用它来鼠标拾取场景中的 3D 对象
  • 创建自定义动画并从 Blender 导出
  • 学习着色器 (GLSL) 创建沉浸式创意网站
  • 如何详细创建顶点和片段着色器
  • 我们还将讨论 GLSL 内置功能、噪声以及如何将纹理导入到您的阴影中
  • 还将解释后处理
  • 还有更多。。。

要求

  • 可以安装 VSCode 或任何代码编辑器的设备
  • 基本的 JavaScript 知识，你应该熟悉 let、const、循环、数组、函数
  • 最重要的两件事是要有耐心（请耐心等待），以及有构建 3D Web 应用程序的愿望

描述

欢迎来到我的 ThreeJs 和 Shaders 课程，您将在其中学习如何构建沉浸式创意 3D 网站

在本课程中，我们将学习有关 Three.js 和 Shaders 的所有知识，我们还将很快分享该项目的一些秘密

该课程分为 3 个主要部分，

  1. 简介部分：我们将在其中学习与该库相关的所有内容，从如何在场景内创建立方体开始，然后如何为该立方体设置动画，如何添加灯光、阴影、粒子等等。
  2. 着色器部分：我们将从头开始学习着色器，当您掌握着色器时，您将会惊讶于您将能够做的事情，您所要做的就是在学习时保持耐心
  3. 项目部分：在本部分中，我们将分享该项目的一些秘密

所有代码都在资源文件夹中提供，您可以在其中找到 Startup 文件夹，这是课程开始时的代码，以及 Last Code 文件夹，这是我们完成课程后编写的代码。

如果您遇到有关特定课程的任何问题，我希望您在问题部分提出问题，我会回答所有问题，所以不要害怕提出任何问题

感谢您参加我的课程，我们将在那里见。

艾哈迈德

本课程适合谁：

  • 想要了解 ThreeJs 的初级 Web 开发人员
  • 想要了解 ThreeJs 概念的前端开发人员
  • 想要创建沉浸式创意 3D 网站的 Web 开发人员
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。