💄 Baked > Improve light blending

package.json

@@ -3,7 +3,8 @@
   "license": "UNLICENSED",
   "scripts": {
     "build": "webpack --config ./bundler/webpack.prod.js",
-    "dev": "webpack serve --config ./bundler/webpack.dev.js"
+    "dev": "webpack serve --config ./bundler/webpack.dev.js",
+    "prod": "git switch prod; git merge main; git push; git switch main"
   },
   "dependencies": {
     "@babel/core": "^7.14.6",
@@ -13,6 +14,7 @@
     "copy-webpack-plugin": "^9.0.1",
     "css-loader": "^5.2.6",
     "file-loader": "^6.2.0",
+    "glsl-blend": "^1.0.3",
     "glslify-loader": "^2.0.0",
     "gsap": "^3.7.1",
     "html-loader": "^2.1.2",

src/Experience/Baked.js

@@ -40,9 +40,9 @@ export default class CoffeeSteam
         this.model.lightMapTexture.flipY = false
 
         this.colors = {}
-        this.colors.tv = '#de11ff'
-        this.colors.desk = '#ff7c00'
-        this.colors.pc = '#4cbdff'
+        this.colors.tv = '#ff115e'
+        this.colors.desk = '#ff9b00'
+        this.colors.pc = '#0082ff'
 
         this.model.material = new THREE.ShaderMaterial({
             uniforms:
@@ -54,10 +54,10 @@ export default class CoffeeSteam
                 uLightTvStrength: { value: 1.47 },
 
                 uLightDeskColor: { value: new THREE.Color(this.colors.desk) },
-                uLightDeskStrength: { value: 1.86 },
+                uLightDeskStrength: { value: 1.36 },
 
                 uLightPcColor: { value: new THREE.Color(this.colors.pc) },
-                uLightPcStrength: { value: 1.27 }
+                uLightPcStrength: { value: 1.4 }
             },
             vertexShader: vertexShader,
             fragmentShader: fragmentShader

src/Experience/shaders/baked/fragment.glsl

@@ -12,19 +12,24 @@ uniform float uLightPcStrength;
 
 varying vec2 vUv;
 
+// #pragma glslify: blend = require(glsl-blend/add)
+#pragma glslify: blend = require(glsl-blend/lighten)
+// #pragma glslify: blend = require(glsl-blend/normal)
+// #pragma glslify: blend = require(glsl-blend/screen)
+
 void main()
 {
     vec3 bakedColor = texture2D(uBakedTexture, vUv).rgb;
     vec3 lightMapColor = texture2D(uLightMapTexture, vUv).rgb;
 
     float lightTvStrength = lightMapColor.r * uLightTvStrength;
-    bakedColor = mix(bakedColor, uLightTvColor, lightTvStrength);
-
-    float lightDeskStrength = lightMapColor.g * uLightDeskStrength;
-    bakedColor = mix(bakedColor, uLightDeskColor, lightDeskStrength);
+    bakedColor = blend(bakedColor, uLightTvColor, lightTvStrength);
 
     float lightPcStrength = lightMapColor.b * uLightPcStrength;
-    bakedColor = mix(bakedColor, uLightPcColor, lightPcStrength);
+    bakedColor = blend(bakedColor, uLightPcColor, lightPcStrength);
+
+    float lightDeskStrength = lightMapColor.g * uLightDeskStrength;
+    bakedColor = blend(bakedColor, uLightDeskColor, lightDeskStrength);
 
     gl_FragColor = vec4(bakedColor, 1.0);
 }