The Book of Shaders 是一部讲解片元着色器(Fragment Shader)的在线入门书,副标题自称是"穿过抽象而复杂的着色器宇宙的一部温和循序渐进的指南"。它最大的特点:书中每个着色器示例都是活的——代码框可以直接编辑,右侧画布实时重新渲染,读者改一行 vec3 就能立刻看到颜色或形状的变化。作者为艺术家兼开发者 Patricio Gonzalez Vivo 与数据科学家 Jen Lowe。

The Book of Shaders 颜色章节截图:页面顶部列出 14 种语言切换,正文配保罗·克利的色轮手稿插图,下方是 GLSL 代码示例

站点速览

项目 内容(截至 2026-09-30)
网址 thebookofshaders.com
类型 交互式在线教程(GLSL 片元着色器)
费用 免费
注册要求 无需注册
界面语言 14 种语言,含中文版、日本語、한국어、Español 等
开放协作 GitHub 仓库(2015-03 创建,截至 2026-09-30 约 7.0k stars,仍在维护)

内容结构

全书按难度递进,主线章节包括:

  • 入门:什么是着色器、"Hello world"、uniform、在不同环境运行着色器;
  • 算法绘图:整形函数、颜色、形状、矩阵、图案;
  • 生成式设计:随机、噪声、细胞噪声、分形布朗运动、分形;
  • 图像处理:纹理、图像运算、卷积核、滤镜及其他效果;
  • 模拟:pingpong 缓冲、康威生命游戏、涟漪、水彩、反应扩散;
  • 3D 图形:光照、法线贴图、凹凸贴图、光线步进(ray marching)、环境贴图、反射与折射。

附录提供了离线阅读、在树莓派上运行示例、打印成书等替代用法。对从 JavaScript 转来的读者,书中还有 Nicolas Barradeau 撰写的专门导引。

站点背景

两位作者的背景解释了这本书的气质:Vivo 是常驻纽约的艺术家与开发者,帕森斯设计学院 MFA 并在那里任教;Jen Lowe 是独立数据科学家,联合创办了诗意计算学校(School for Poetic Computation)。翻译由社区贡献者完成——中文版由 Tong Li 与 Yi Zhang 翻译,日文、韩文、西班牙文等版本也各有署名贡献者。

适用场景

  • 创意编程与生成艺术初学者系统入门 shader;
  • 前端/图形开发者快速查阅噪声、fBm、光线步进等常用技法;
  • 教师在创意编程课堂上作为配套教材(支持中文界面)。

局限

  • 聚焦片元着色器与 GLSL 入门,不涉及顶点管线、计算着色器或 WebGPU 等现代主题。
  • 示例基于 WebGL 1 时代的 GLSL 语法;移植到 WebGL2/WGSL 需要自行转换。
  • 部分章节末尾标有"待续"性质的内容缺口,个别语言版本的翻译进度不一致。
  • 页面内编辑器适合学习,但没有错误调试、性能分析等工程化功能。

参考资料