Shader Works全部课程

Runtime check · 不计入课程题数

让第一段 Shader 跑起来。

这张渐变卡片来自独立的顶点与片元 Shader 文件。拖动速度、暂停动画，再调整窗口宽度，检查本地运行环境。

ShaderMaterial · WebGL2_starter/00-runtime-check

照着确认

  1. 看到左青右珊瑚色的平面，说明顶点与片元 Shader 已完成编译和绘制。
  2. 拖动速度并暂停，确认 JavaScript 的 uTime uniform 控制颜色变化。
  3. 缩窄浏览器窗口，确认画布不会变形；控制台不应出现脚本、Shader 或 404 错误。

源码分在 main.js、shader.vert 和 shader.frag。后续练习沿用同样的相对路径。