diff --git "a/_posts/shader_book/2023-04-20-\346\270\270\346\210\217\345\222\214\345\261\217\345\271\225\346\225\210\346\236\234.md" "b/_posts/shader_book/2023-04-20-\346\270\270\346\210\217\345\222\214\345\261\217\345\271\225\346\225\210\346\236\234.md"
index 4fb69a67b67..9f397811cd7 100644
--- "a/_posts/shader_book/2023-04-20-\346\270\270\346\210\217\345\222\214\345\261\217\345\271\225\346\225\210\346\236\234.md"
+++ "b/_posts/shader_book/2023-04-20-\346\270\270\346\210\217\345\222\214\345\261\217\345\271\225\346\225\210\346\236\234.md"
@@ -31,4 +31,29 @@ tags: [U3D, Shader,Cookbook,中文版]
 很多游戏背景设定在不同的时期。有些发生在幻想世界或者科幻世界，更有甚者发生在旧西部，那个时候电影摄像机才刚刚发明并且人们看到的都是一些黑白电影或者棕褐色效果色调的电影。它们看起来格外不同，我们将在Unity中用屏幕效果来复制这种看起来的样子。   
 <br>
 获得这种效果需要一些步骤，如果要将整个屏幕变成黑或白或灰，我们需要将这个效果分解成不同的组成部分。如果我们分析一些相关的老电影的镜头，我们就可以开始做这个了。让我们来看看下面这张图片并且分解其中的元素，看看是那些构成了这个老电影的样子：   
-![diagram](https://linkliu.github.io/game-tech-post/assets/img/shader_book/diagram98.png){:  .shadow width = "90%" }   
\ No newline at end of file
+![diagram](https://linkliu.github.io/game-tech-post/assets/img/shader_book/diagram98.png){:  .shadow width = "90%" }   
+<br>
+我们用一些在网上找到的图片构建了这个图片。像这样尝试利用Photoshop来构建图片总是一个很好的主意，它能为你的新的屏幕特效打好一个计划。在这个过程中它不仅能将我们需要用代码编写的元素告诉我们，还提供了一个快捷的方式让我们了解我们的屏幕效果需要使用哪一种混合模式和我们将要构建那些层级。本书这个知识点中我们为Photoshop创建的这些文件的支持网站在[http://www.packtpub.com/support](http://www.packtpub.com/support)[**已经失效(译者注)**]。它是一个名为 **OldFilmEffect_Research_Layout.psd** 的文件。    
+
+
+***
+<br>
+
+
+- **始前准备**   
+  我们现在目的明确，让我们看看最终效果的每一层都包含了什么然后为我们的着色器和C#脚本收集一些资源。   
+  - **复古色调（Sepia tone）：** 这是一个相对容易获得的效果，我们只需把原始渲染纹理的所有像素颜色变为一个单一的颜色范围。使用原始图像的亮度然后加上一个常量颜色就可以很容易获得。我们的第一层将会看起来跟下面的图片一样：   
+  ![diagram](https://linkliu.github.io/game-tech-post/assets/img/shader_book/diagram99.png){:  .shadow width = "90%" }   
+  - **渐晕效果（Vignette effect）：** 当一些古老的电影放映机放映老电影的时候，我们经常看到某种软边界[ **我个人觉得翻译的不够准确** ]围绕在老电影的四周。这是因为这种电影放映机使用的球形灯泡发出的光中间部位比周围要亮造成的。这种效果通常叫做渐晕效果并且是我们屏幕效果的第二层。我们可以通过在整个屏幕上覆盖一张纹理来获得这个效果。下面的图片演示了这一层看起来的样子，就是一张纹理：   
+  ![diagram](https://linkliu.github.io/game-tech-post/assets/img/shader_book/diagram100.png){:  .shadow width = "90%" }   
+  - **灰尘和划痕（Dust and scratches）：** 第三层也是最后一层就是我们的老电影屏幕效果中的灰尘和划痕。这一层将使用两种不同的平铺纹理，一种作为划痕然后另一种作为灰尘。原因就是我们将根据时间以不同的速度对这两种纹理做动画。这将会产生一种效果，就是当电影在播放的时候同时在老电影的每一帧中都会有一些细小的划痕和灰尘。下图演示了它们的纹理看起来效果：   
+  ![diagram](https://linkliu.github.io/game-tech-post/assets/img/shader_book/diagram101.png){:  .shadow width = "90%" }   
+
+  <br>
+  我们用前面的那些纹理来准备好我们的 **屏幕效果系统（screen effect system）**。按照下面的步骤来：   
+  - 1.将 **渐晕纹理（vignette texture）** 和 **灰尘划痕纹理（dust and scratches texture）** 收集起来，就像我们前面看到的那几张。
+  - 2.创建一个名为 **OldFilmEffect.cs** 的新脚本和一个名为 **OldFilmEffectShader.shader** 的新着色器。
+  - 3.创建好这些新的文件后，给它们编写需要的代码来完成我们的屏幕效果系统并且顺利的跑起来。想知道具体如何做，可以参考 **[第八章](第八章)** ***通过Unity渲染纹理实现屏幕效果*** 来了解。   
+  
+  <br>
+  最后，随着我们的屏幕效果系统完成并且顺利跑起来，以及收集好了我们的纹理，我们就可以开始复现老电影效果的制作过程了。
\ No newline at end of file
diff --git a/assets/img/shader_book/diagram100.png b/assets/img/shader_book/diagram100.png
new file mode 100644
index 00000000000..6e496f506c4
Binary files /dev/null and b/assets/img/shader_book/diagram100.png differ
diff --git a/assets/img/shader_book/diagram101.png b/assets/img/shader_book/diagram101.png
new file mode 100644
index 00000000000..d9750bc07ec
Binary files /dev/null and b/assets/img/shader_book/diagram101.png differ
diff --git a/assets/img/shader_book/diagram99.png b/assets/img/shader_book/diagram99.png
new file mode 100644
index 00000000000..4579f686e47
Binary files /dev/null and b/assets/img/shader_book/diagram99.png differ