supermedium brand colors

2018-12-06 22:17:21 +01:00
parent 6d78a80525
commit 09685d7bd8
24 changed files with 2812 additions and 2674 deletions
--- a/assets/img/atlas.png
+++ b/assets/img/atlas.png
--- a/assets/img/logotex.png
+++ b/assets/img/logotex.png
--- a/assets/img/tutorial.png
+++ b/assets/img/tutorial.png
--- a/assets/models/audiocolumn.obj
+++ b/assets/models/audiocolumn.obj
@@ -1,26 +1,27 @@
 # Blender v2.79 (sub 0) OBJ File: 'stage.blend'
 # www.blender.org
-o audiocolumn
-v 0.300000 -0.500000 0.300000
-v 0.300000 0.500000 0.300000
-v -0.300000 -0.500000 0.300000
-v -0.300000 0.500000 0.300000
-v 0.300000 -0.500000 -0.300000
-v 0.300000 0.500000 -0.300000
-v -0.300000 -0.500000 -0.300000
-v -0.300000 0.500000 -0.300000
+v -0.429614 -0.429614 0.429614
+v -0.429614 0.429614 0.429614
+v -0.429614 -0.429614 -0.429614
+v -0.429614 0.429614 -0.429614
+v 0.429614 -0.429614 0.429614
+v 0.429614 0.429614 0.429614
+v 0.429614 -0.429614 -0.429614
+v 0.429614 0.429614 -0.429614
 vt 0.783339 0.005821
 vt 0.774810 0.013178
 vt 0.774810 0.005821
 vt 0.795098 0.008335
-vt 0.803673 0.003338
-vt 0.803673 0.008335
+vt 0.802444 0.003338
+vt 0.802444 0.008335
 vt 0.779471 0.013774
 vt 0.776653 0.016592
 vt 0.776653 0.013774
 vt 0.792235 0.011705
 vt 0.789417 0.014523
 vt 0.789417 0.011705
+vt 0.779380 0.012114
+vt 0.776020 0.008459
 vt 0.783339 0.013178
 vt 0.795098 0.003338
 vt 0.779471 0.016592
@@ -30,9 +31,9 @@ f 2/1 3/2 1/3
 f 4/4 7/5 3/6
 f 6/7 1/8 5/9
 f 4/10 6/11 8/12
-f 8/12 5/9 7/5
-f 2/1 4/13 3/2
-f 4/4 8/14 7/5
-f 6/7 2/15 1/8
-f 4/10 2/16 6/11
-f 8/12 6/7 5/9
+f 8/13 5/9 7/14
+f 2/1 4/15 3/2
+f 4/4 8/16 7/5
+f 6/7 2/17 1/8
+f 4/10 2/18 6/11
+f 8/13 6/7 5/9
--- a/assets/models/bluebeam.obj
+++ b/assets/models/bluebeam.obj
@@ -0,0 +1,13 @@
+# Blender v2.79 (sub 0) OBJ File: 'stage.blend'
+# www.blender.org
+v -0.200000 0.000000 0.000000
+v 0.200000 0.000000 0.000000
+v -0.200000 50.000000 -0.000000
+v 0.200000 50.000000 -0.000000
+vt 0.969190 0.000297
+vt 0.938294 0.374606
+vt 0.938294 0.000297
+vt 0.969190 0.374606
+s off
+f 2/1 3/2 1/3
+f 2/1 4/4 3/2
--- a/assets/models/logo.obj
+++ b/assets/models/logo.obj
--- a/assets/models/logogodrays.obj
+++ b/assets/models/logogodrays.obj
@@ -0,0 +1,101 @@
+# Blender v2.79 (sub 0) OBJ File: 'logo_ingame.blend'
+# www.blender.org
+v -0.000001 -0.422996 0.000000
+v -0.000001 -0.422996 -2.315545
+v 1.802403 -0.422996 -2.271053
+v 3.535542 -0.422996 -2.139285
+v 5.132811 -0.422996 -1.925305
+v 6.532830 -0.422996 -1.637337
+v 7.681795 -0.422996 -1.286448
+v 8.535552 -0.422996 -0.886121
+v 9.061294 -0.422996 -0.451740
+v 9.238815 -0.422996 0.000000
+v 9.061295 -0.422996 0.451741
+v 8.535553 -0.422996 0.886121
+v 7.681795 -0.422996 1.286449
+v 6.532830 -0.422996 1.637339
+v 5.132810 -0.422996 1.925306
+v 3.535540 -0.422996 2.139286
+v 1.802401 -0.422996 2.271054
+v -0.000004 -0.422996 2.315546
+v -1.802408 -0.422996 2.271054
+v -3.535547 -0.422996 2.139286
+v -5.132817 -0.422996 1.925306
+v -6.532836 -0.422996 1.637337
+v -7.681800 -0.422996 1.286447
+v -8.535559 -0.422996 0.886120
+v -9.061297 -0.422996 0.451739
+v -9.238819 -0.422996 -0.000002
+v -9.061295 -0.422996 -0.451743
+v -8.535551 -0.422996 -0.886123
+v -7.681790 -0.422996 -1.286450
+v -6.532823 -0.422996 -1.637340
+v -5.132802 -0.422996 -1.925307
+v -3.535531 -0.422996 -2.139286
+v -1.802391 -0.422996 -2.271053
+vt 0.031130 0.002497
+vt 0.029802 0.991732
+vt 0.026613 0.991732
+vt 0.032867 0.991732
+vt 0.035693 0.991732
+vt 0.038169 0.991732
+vt 0.040202 0.991732
+vt 0.041712 0.991732
+vt 0.042642 0.991732
+vt 0.042956 0.991732
+vt 0.042642 0.991732
+vt 0.041712 0.991732
+vt 0.040202 0.991732
+vt 0.038169 0.991732
+vt 0.035693 0.991732
+vt 0.032867 0.991732
+vt 0.029802 0.991732
+vt 0.026613 0.991732
+vt 0.023425 0.991732
+vt 0.020359 0.991732
+vt 0.017534 0.991732
+vt 0.015057 0.991732
+vt 0.013025 0.991732
+vt 0.011514 0.991732
+vt 0.010585 0.991732
+vt 0.010270 0.991732
+vt 0.010585 0.991732
+vt 0.011515 0.991732
+vt 0.013025 0.991732
+vt 0.015057 0.991732
+vt 0.017534 0.991732
+vt 0.020359 0.991732
+vt 0.023425 0.991732
+s off
+f 1/1 3/2 2/3
+f 1/1 4/4 3/2
+f 1/1 5/5 4/4
+f 1/1 6/6 5/5
+f 1/1 7/7 6/6
+f 1/1 8/8 7/7
+f 1/1 9/9 8/8
+f 1/1 10/10 9/9
+f 1/1 11/11 10/10
+f 1/1 12/12 11/11
+f 1/1 13/13 12/12
+f 1/1 14/14 13/13
+f 1/1 15/15 14/14
+f 1/1 16/16 15/15
+f 1/1 17/17 16/16
+f 1/1 18/18 17/17
+f 1/1 19/19 18/18
+f 1/1 20/20 19/19
+f 1/1 21/21 20/20
+f 1/1 22/22 21/21
+f 1/1 23/23 22/22
+f 1/1 24/24 23/23
+f 1/1 25/25 24/24
+f 1/1 26/26 25/25
+f 1/1 27/27 26/26
+f 1/1 28/28 27/27
+f 1/1 29/29 28/28
+f 1/1 30/30 29/29
+f 1/1 31/31 30/30
+f 1/1 32/32 31/31
+f 1/1 33/33 32/32
+f 1/1 2/3 33/33
--- a/assets/models/redbeam.obj
+++ b/assets/models/redbeam.obj
@@ -0,0 +1,13 @@
+# Blender v2.79 (sub 0) OBJ File: 'stage.blend'
+# www.blender.org
+v -0.200000 0.000000 0.000000
+v 0.200000 0.000000 0.000000
+v -0.200000 50.000000 -0.000000
+v 0.200000 50.000000 -0.000000
+vt 0.999681 0.000297
+vt 0.968955 0.374606
+vt 0.968955 0.000297
+vt 0.999681 0.374606
+s off
+f 2/1 3/2 1/3
+f 2/1 4/4 3/2
--- a/assets/models/stageadditive.obj
+++ b/assets/models/stageadditive.obj
@@ -169,36 +169,36 @@ f 62/60 63/61 61/62
 f 59/57 60/63 58/58
 f 62/60 64/64 63/61
 v 4.693238 0.813037 19.789230
-v 4.693230 0.813042 -82.453156
+v 4.693230 0.813042 -34.869328
 v 4.350243 0.470041 19.789230
-v 4.350235 0.470047 -82.453156
+v 4.350235 0.470047 -34.869328
 v -4.693238 0.813037 19.789230
-v -4.693230 0.813042 -82.453156
+v -4.693230 0.813042 -34.869328
 v -4.350243 0.470041 19.789230
-v -4.350235 0.470047 -82.453156
+v -4.350235 0.470047 -34.869328
+vt 0.986741 0.500428
 vt 0.999332 0.500428
 vt 0.999332 0.749582
-vt 0.986741 0.749582
+vt 0.999332 0.749582
 vt 0.999332 0.500428
 vt 0.986741 0.500428
 vt 0.986741 0.749582
-vt 0.986741 0.500428
-vt 0.999332 0.749582
+vt 0.986741 0.749582
 s off
-f 65/65 66/66 68/67
-f 69/68 71/69 72/70
-f 65/65 68/67 67/71
-f 69/68 72/70 70/72
+f 67/65 65/66 66/67
+f 70/68 69/69 71/70
+f 67/65 66/67 68/71
+f 70/68 71/70 72/72
 v 3.762471 0.875742 -7.080121
-v 3.762460 0.875749 -58.498669
+v 3.762460 0.875749 -34.902813
 v 3.277436 0.390707 -7.080121
-v 3.277424 0.390714 -58.498669
+v 3.277424 0.390714 -34.902813
 v 3.762470 0.875742 -7.385828
 v 3.277435 0.390707 -7.385828
 v -3.762471 0.875742 -7.080121
-v -3.762460 0.875749 -58.498669
+v -3.762460 0.875749 -34.902813
 v -3.277436 0.390707 -7.080121
-v -3.277424 0.390714 -58.498669
+v -3.277424 0.390714 -34.902813
 v -3.762470 0.875742 -7.385828
 v -3.277435 0.390707 -7.385828
 vt 0.986050 0.517649
--- a/assets/models/stagenormal.obj
+++ b/assets/models/stagenormal.obj
@@ -1449,10 +1449,10 @@ f 357/461 359/467 360/462
 f 357/461 358/463 362/464
 v 4.475000 0.625000 18.000004
 v 4.475000 0.675000 18.000004
-v 4.475000 0.625000 -81.999992
-v 4.475000 0.675000 -81.999992
+v 4.475000 0.625000 -33.209454
+v 4.475000 0.675000 -33.209454
 v 4.525000 0.675000 18.000004
-v 4.525000 0.675000 -81.999992
+v 4.525000 0.675000 -33.209454
 v -4.475000 0.625000 18.000004
 v -4.475000 0.675000 18.000004
 v -4.475000 0.625000 -81.999992
@@ -1494,10 +1494,10 @@ f 373/477 374/486 376/478
 f 374/480 370/487 372/481
 v 3.475000 0.625000 -6.999996
 v 3.475000 0.675000 -6.999996
-v 3.475000 0.625000 -56.999996
-v 3.475000 0.675000 -56.999996
+v 3.475000 0.625000 -33.915211
+v 3.475000 0.675000 -33.915211
 v 3.525000 0.675000 -6.999996
-v 3.525000 0.675000 -56.999996
+v 3.525000 0.675000 -33.915211
 v -3.475000 0.625000 -6.999996
 v -3.475000 0.675000 -6.999996
 v -3.475000 0.625000 -56.999996
--- a/assets/shaders/stageNormal.js
+++ b/assets/shaders/stageNormal.js
@@ -12,19 +12,30 @@ module.exports = {

  fragmentShader: `
    #define FOG_RADIUS  55.0
-    #define FOG_FALLOFF 50.0
-    #define FOG_COLOR_MULT 0.85
+    #define FOG_FALLOFF 48.0
+    #define FOG_COLOR_MULT 0.8
    varying vec2 uvs;
    varying vec3 worldPos;
-    uniform vec3 color;
+    uniform vec3 skyColor;
+    uniform vec3 backglowColor;
    uniform sampler2D src;

    void main() {
      vec4 col = texture2D(src, uvs);
-      float mask = step(0.5, uvs.x);
-      mask = min(mask, max(step(0.75, uvs.x), 1.0 - step(0.5, uvs.y)));
-      col = mix(col * vec4(color, 1.0), col, mask);
-      col.xyz = mix(color * FOG_COLOR_MULT, col.xyz, clamp(distance(worldPos, vec3(0., 0., -FOG_RADIUS)) / FOG_FALLOFF, 0., 1.));
+      float mask;
+
+      // bg
+      mask = step(0.5, uvs.x);
+      col.xyz = mix(col.xyz * skyColor, col.xyz, mask);
+
+      // backglow
+      mask = step(0.5, uvs.x) * step(0.5, uvs.y) * (1.0 - step(0.75, uvs.x));
+      col.xyz = mix(col.xyz, col.xyz * backglowColor, mask);
+
+      float fogDensity = 1.0 - pow(clamp(distance(worldPos, vec3(0., 0., -FOG_RADIUS)) / FOG_FALLOFF, 0.0, 1.0), 1.5);
+      fogDensity += clamp(0.2 - pow(distance(worldPos, vec3(0.0, 0.0, worldPos.z)) / 10.0, 2.0), 0.0, 1.0);
+      col.xyz = mix(col.xyz, backglowColor * FOG_COLOR_MULT, fogDensity);
+
      gl_FragColor = col;
    }
  `
--- a/src/assets.html
+++ b/src/assets.html
@@ -34,8 +34,10 @@
 <a-asset-item id="logoObj" src="assets/models/logo.obj"></a-asset-item>
 <a-asset-item id="logofrontUObj" src="assets/models/logofront-u.obj"></a-asset-item>
 <a-asset-item id="logoGlowObj" src="assets/models/logoglow.obj"></a-asset-item>
+<a-asset-item id="logoGodraysObj" src="assets/models/logogodrays.obj"></a-asset-item>
 <a-asset-item id="saberGlowObj" src="assets/models/saberglow.obj"></a-asset-item>
-
+<a-asset-item id="redbeamObj" src="assets/models/redbeam.obj"></a-asset-item>
+<a-asset-item id="bluebeamObj" src="assets/models/bluebeam.obj"></a-asset-item>


 <!--<a-asset-item id="wallglowObj" src="assets/models/wallglow.obj"></a-asset-item>-->
@@ -44,7 +46,6 @@
 <a-asset-item id="tutorial2Obj" src="assets/models/tutorial2.obj"></a-asset-item>
 <a-asset-item id="tutorial3Obj" src="assets/models/tutorial3.obj"></a-asset-item>

-<audio id="beatMissSound" src="assets/sounds/miss.ogg"></audio>
 <audio id="confirmSound" src="assets/sounds/beatHit.ogg"></audio>
 <audio id="hoverSound" src="assets/sounds/hover.ogg"></audio>
 <audio id="victorySound" src="assets/sounds/victory.ogg"></audio>
@@ -68,7 +69,7 @@
 <img id="playImg" src="assets/img/play.png">
 <img id="sliceImg" src="assets/img/slice.png">
 <img id="slicebtnImg" src="assets/img/slicebtn.png">
-<img id="beamImg" src="assets/img/beam.png">
+<!--<img id="beamImg" src="assets/img/beam.png">-->
 <img id="wrongImg" src="assets/img/wrong.png">
 <img id="missImg" src="assets/img/miss.png">
 <img id="noiseTexture" src="assets/img/noise.png">
@@ -117,10 +118,10 @@
  mixin="beatScore"
  text="value: GOOD; color: #A8E3FF"></a-mixin>
 <a-mixin
-  id="beatScoreGreat"
-  score-beat="type: great"
+  id="beatScoreExcellent"
+  score-beat="type: excellent"
  mixin="beatScore"
-  text="value: GREAT; wrapCount: 16; color: #60CCFF"></a-mixin>
+  text="value: EXCELLENT; wrapCount: 16; color: #60CCFF"></a-mixin>
 <a-mixin
  id="beatScoreSuper"
  score-beat="type: super"
@@ -135,10 +136,11 @@

 <a-mixin
  id="wall"
-  data-saber-particles
  geometry
  material="shader: wallShader; transparent: true; side: double;"
-  wall></a-mixin>
+  wall
+  saber-intersection
+  ></a-mixin>

 <a-mixin
  id="beatWrong"
@@ -168,11 +170,16 @@
 <!-- stage, neons, etc animations launched from beat-loader events -->

 <a-mixin id="bgColorAnimation"
-  animation__bgcoloroff="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; to: {{ COLORS.BG_OFF }}; dur: 500; easing: linear; startEvents: bgcoloroff"
-  animation__bgcolorblue="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; to: {{ COLORS.BG_BLUE }}; dur: 5; easing: linear; startEvents: bgcolorblue"
-  animation__bgcolorbluefade="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; from: {{ COLORS.BG_BRIGHTBLUE }}; to: {{ COLORS.BG_BLUE }}; dur: 500; easing: linear; startEvents: bgcolorbluefade"
-  animation__bgcolorred="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; to: {{ COLORS.BG_RED }}; dur: 5; easing: linear; startEvents: bgcolorred"
-  animation__bgcolorredfade="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; from: {{ COLORS.BG_BRIGHTBLUE }}; to: {{ COLORS.BG_RED }}; dur: 500; easing: linear; startEvents: bgcolorredfade"
+  animation__bgcoloroff="isRawProperty: true; property: systems.materials.stageNormal.uniforms.backglowColor.value; type: color; to: {{ COLORS.BG_OFF }}; dur: 500; easing: linear; startEvents: bgcoloroff"
+  animation__bgcolorblue="isRawProperty: true; property: systems.materials.stageNormal.uniforms.backglowColor.value; type: color; to: {{ COLORS.BG_BLUE }}; dur: 5; easing: linear; startEvents: bgcolorblue"
+  animation__bgcolorbluefade="isRawProperty: true; property: systems.materials.stageNormal.uniforms.backglowColor.value; type: color; from: {{ COLORS.BG_BRIGHTBLUE }}; to: {{ COLORS.BG_BLUE }}; dur: 500; easing: linear; startEvents: bgcolorbluefade"
+  animation__bgcolorred="isRawProperty: true; property: systems.materials.stageNormal.uniforms.backglowColor.value; type: color; to: {{ COLORS.BG_RED }}; dur: 5; easing: linear; startEvents: bgcolorred"
+  animation__bgcolorredfade="isRawProperty: true; property: systems.materials.stageNormal.uniforms.backglowColor.value; type: color; from: {{ COLORS.BG_BRIGHTRED }}; to: {{ COLORS.BG_RED }}; dur: 500; easing: linear; startEvents: bgcolorredfade"
+
+
+  animation__skycoloroff="isRawProperty: true; property: systems.materials.stageNormal.uniforms.skyColor.value; type: color; to: {{ COLORS.SKY_OFF }}; dur: 500; easing: linear; startEvents: bgcoloroff"
+  animation__skycolorblue="isRawProperty: true; property: systems.materials.stageNormal.uniforms.skyColor.value; type: color; to: {{ COLORS.SKY_BLUE }}; dur: 5; easing: linear; startEvents: bgcolorblue"
+  animation__skycolorred="isRawProperty: true; property: systems.materials.stageNormal.uniforms.skyColor.value; type: color; to: {{ COLORS.SKY_RED }}; dur: 5; easing: linear; startEvents: bgcolorred"
  ></a-mixin>

 <a-mixin id="tunnelColorAnimation"
@@ -183,6 +190,14 @@
  animation__tunnelcolorredfade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.tunnelNeon.value; type: color; from: {{ COLORS.NEON_BRIGHTRED }}; to: {{ COLORS.NEON_RED }}; dur: 500; easing: linear; startEvents: tunnelcolorredfade"
  ></a-mixin>

+<a-mixin id="floorColorAnimation"
+  animation__floorcoloroff="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.floorNeon.value; type: color; to: {{ COLORS.NEON_OFF }}; dur: 500; easing: linear; startEvents: floorcoloroff"
+  animation__floorcolorblue="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.floorNeon.value; type: color; to: {{ COLORS.NEON_BLUE }}; dur: 5; easing: linear; startEvents: floorcolorblue"
+  animation__floorcolorbluefade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.floorNeon.value; type: color; from: {{ COLORS.NEON_BRIGHTBLUE }}; to: {{ COLORS.NEON_BLUE }}; dur: 500; easing: linear; startEvents: floorcolorbluefade"
+  animation__floorcolorred="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.floorNeon.value; type: color; to: {{ COLORS.NEON_RED }}; dur: 5; easing: linear; startEvents: floorcolorred"
+  animation__floorcolorredfade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.floorNeon.value; type: color; from: {{ COLORS.NEON_BRIGHTRED }}; to: {{ COLORS.NEON_RED }}; dur: 500; easing: linear; startEvents: floorcolorredfade"
+  ></a-mixin>
+
 <a-mixin id="leftLaserColorAnimation"
  animation__leftlasercoloroff="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.leftLaser.value; type: color; to: {{ COLORS.NEON_OFF }}; dur: 500; easing: linear; startEvents: leftlasercoloroff"
  animation__leftlasercolorblue="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.leftLaser.value; type: color; to: {{ COLORS.NEON_BLUE }}; dur: 5; easing: linear; startEvents: leftlasercolorblue"
--- a/src/components/beams.js
+++ b/src/components/beams.js
@@ -23,22 +23,22 @@ AFRAME.registerComponent('beams', {
  },

  play: function () {
-    // Material.
-    const materialOptions = {
-      color: 0xaa3333,
-      map: new THREE.TextureLoader().load('assets/img/beam.png'),
-      transparent: true,
-      blending: THREE.AdditiveBlending
-    };
-    const redMaterial = new THREE.MeshBasicMaterial(materialOptions);
-    materialOptions.color = 0x4444cc;
-    const blueMaterial = new THREE.MeshBasicMaterial(materialOptions);
-    this.texture = materialOptions.map;
-
    // Beam pools.
-    const geometry = new THREE.PlaneBufferGeometry(0.4, 50).translate(0, 25, 0);
-    this.redBeams = this.createBeamPool(geometry, redMaterial);
-    this.blueBeams = this.createBeamPool(geometry, blueMaterial);
+    //const geometry = new THREE.PlaneBufferGeometry(0.4, 50).translate(0, 25, 0);
+
+    var objData;
+    var loader;
+    var redGeometry, blueGeometry;
+
+    var loader = new THREE.OBJLoader();
+    objData = document.getElementById('redbeamObj').data;
+    redGeometry = loader.parse(objData).children[0].geometry;
+
+    objData = document.getElementById('bluebeamObj').data;
+    blueGeometry = loader.parse(objData).children[0].geometry;
+
+    this.redBeams = this.createBeamPool(redGeometry, this.el.sceneEl.systems.materials.stageAdditive);
+    this.blueBeams = this.createBeamPool(blueGeometry, this.el.sceneEl.systems.materials.stageAdditive);
  },

  /**
--- a/src/components/beat-loader.js
+++ b/src/components/beat-loader.js
@@ -292,9 +292,8 @@ AFRAME.registerComponent('beat-loader', {
      case 3:
        this.stageColors.setColor('rightlaser', event._value);
        break;
-      case 400:
+      case 4:
        this.stageColors.setColor('floor', event._value);
-        this.stageColors.setColor('stageNeon', event._value);
        break;
      case 8:
        this.twister.components.twister.pulse(event._value);
--- a/src/components/beat.js
+++ b/src/components/beat.js
@@ -258,7 +258,7 @@ AFRAME.registerComponent('beat', {
      roughness: 0.10,
      sphericalEnvMap: '#envmapTexture',
      emissive: this.materialColor[this.data.color],
-      emissiveIntensity: 0.27,
+      emissiveIntensity: 0.17,
      color: this.materialColor[this.data.color]
    });
    this.setObjModelFromTemplate(blockEl, this.models[this.data.type]);
@@ -372,7 +372,7 @@ AFRAME.registerComponent('beat', {
      roughness: 0.12,
      sphericalEnvMap: '#envmapTexture',
      emissive: this.materialColor[this.data.color],
-      emissiveIntensity: 0.27,
+      emissiveIntensity: 0.17,
      color: this.materialColor[this.data.color],
      side: 'double'
    });
@@ -391,7 +391,7 @@ AFRAME.registerComponent('beat', {
      roughness: 0.12,
      sphericalEnvMap: '#envmapTexture',
      emissive: this.materialColor[this.data.color],
-      emissiveIntensity: 0.27,
+      emissiveIntensity: 0.17,
      color: this.materialColor[this.data.color],
      side: 'double'
    });
--- a/src/components/materials.js
+++ b/src/components/materials.js
@@ -7,7 +7,8 @@ AFRAME.registerSystem('materials', {
  init: function () {
    this.stageNormal = new THREE.ShaderMaterial({
      uniforms: {
-        color: {value: new THREE.Color(COLORS.BG_BLUE)},
+        skyColor: {value: new THREE.Color(COLORS.SKY_BLUE)},
+        backglowColor: {value: new THREE.Color(COLORS.BG_BLUE)},
        src: {value: new THREE.TextureLoader().load(document.getElementById('atlasImg').src)},
      },
      vertexShader: stageNormalShaders.vertexShader,
@@ -18,8 +19,8 @@ AFRAME.registerSystem('materials', {

    this.stageAdditive = new THREE.ShaderMaterial({
      uniforms: {
-        tunnelNeon: {value: new THREE.Color(COLORS.NEON_BLUE)},
-        floorNeon: {value: new THREE.Color(COLORS.NEON_BLUE)},
+        tunnelNeon: {value: new THREE.Color(COLORS.NEON_RED)},
+        floorNeon: {value: new THREE.Color(COLORS.NEON_RED)},
        leftLaser: {value: new THREE.Color(COLORS.NEON_BLUE)},
        rightLaser: {value: new THREE.Color(COLORS.NEON_BLUE)},
        textGlow: {value: new THREE.Color(COLORS.TEXT_OFF)},
--- a/src/components/stage-colors.js
+++ b/src/components/stage-colors.js
@@ -23,6 +23,10 @@ AFRAME.registerComponent('stage-colors', {
  resetColors: function () {
    this.updateColors('blue');
    this.el.emit('bgcolorblue', null, false);
+    this.el.emit('tunnelcolorred', null, false);
+    this.el.emit('floorcolorred', null, false);
+    this.el.emit('leftlasercolorblue', null, false);
+    this.el.emit('rightlasercolorblue', null, false);
  },

  updateColors: function (color) {
--- a/src/components/wall-shader.js
+++ b/src/components/wall-shader.js
@@ -1,3 +1,8 @@
+const COLORS = require('../constants/colors.js');
+
+const WALL_COLOR = new THREE.Color(COLORS.NEON_RED);
+const WALL_BG = new THREE.Color(COLORS.SKY_RED);
+

 AFRAME.registerShader('wallShader', {
  schema: {
@@ -63,7 +68,8 @@ AFRAME.registerShader('wallShader', {
      return mix(c, f, luvw.z);
    }

-
+    #define WALL_COLOR vec3(${WALL_COLOR.r}, ${WALL_COLOR.g}, ${WALL_COLOR.b})
+    #define WALL_BG vec3(${WALL_BG.r}, ${WALL_BG.g}, ${WALL_BG.b})

    void main() {
      vec2 uv1 = uvs.xy-0.5;
@@ -93,7 +99,10 @@ AFRAME.registerShader('wallShader', {
      w *= 0.9;
      bg *= 0.5;

-      vec3 col = vec3(r * 0.8 + w, w + 0.05, w + 0.08);
+      vec3 COL = WALL_COLOR;
+      vec3 BG = WALL_BG * 0.1;
+
+      vec3 col = vec3(r * COL.r + w + BG.r, r * COL.g + w + BG.g, r * COL.b + w + BG.b);

      vec3 hit;
      hit = drawCircle(worldPos, hitRight, 0.04, 0.05, vec3(1.0, 0.4, 0.4));
--- a/src/constants/colors-brand.js
+++ b/src/constants/colors-brand.js
@@ -0,0 +1,35 @@
+module.exports = {
+  OFF: '#111',
+  RED: '#ff3a7b',
+  BLUE: '#08bfa2',
+
+  UI_ACCENT: '#08bfa2',
+
+  SKY_OFF: '#297547',
+  SKY_BLUE: '#840d42',
+  SKY_RED: '#154136',
+
+  BG_OFF: '#081a0f',
+  BG_BLUE: '#379f5e',
+  BG_BRIGHTBLUE: '#4fd983',
+  BG_RED: '#ff1f81',
+  BG_BRIGHTRED: '#ff6bb0',
+
+  NEON_OFF: '#000',
+  NEON_BLUE: '#008a70',
+  NEON_BRIGHTBLUE: '#87c2ff',
+  NEON_RED: '#f01978',
+  NEON_BRIGHTRED: '#ff70b5',
+
+  TEXT_OFF: '#000',
+  TEXT_NORMAL: '#444',
+  TEXT_BOLD: '#888',
+
+  BEAT_RED: '#46021c',
+  BEAT_BLUE: '#01261a',
+
+  MINE_RED: '#1c060e',
+  MINE_RED_EMISSION: '#2a0d1b',
+  MINE_BLUE: '#011114',
+  MINE_BLUE_EMISSION: '#072020',
+};
--- a/src/constants/colors-orig.js
+++ b/src/constants/colors-orig.js
@@ -0,0 +1,35 @@
+module.exports = {
+  OFF: '#111',
+  RED: '#f00',
+  BLUE: '#00f',
+
+  UI_ACCENT: '#067197',
+
+  SKY_OFF: '#222',
+  SKY_BLUE: '#007AB8',
+  SKY_RED: '#B80000',
+
+  BG_OFF: '#222',
+  BG_BLUE: '#007AB8',
+  BG_BRIGHTBLUE: '#5FCCFF',
+  BG_RED: '#B80000',
+  BG_BRIGHTRED: '#FF4343',
+
+  NEON_OFF: '#000',
+  NEON_BLUE: '#00f',
+  NEON_BRIGHTBLUE: '#aaf',
+  NEON_RED: '#f00',
+  NEON_BRIGHTRED: '#faa',
+
+  TEXT_OFF: '#000',
+  TEXT_NORMAL: '#444',
+  TEXT_BOLD: '#888',
+
+  BEAT_RED: '#290404',
+  BEAT_BLUE: '#08083E',
+
+  MINE_RED: '#070304',
+  MINE_RED_EMISSION: '#090707',
+  MINE_BLUE: '#030407',
+  MINE_BLUE_EMISSION: '#070709',
+};
--- a/src/constants/colors.js
+++ b/src/constants/colors.js
@@ -1,29 +1,35 @@
 module.exports = {
  OFF: '#111',
-  RED: '#f00',
-  BLUE: '#00f',
+  RED: '#ff3a7b',
+  BLUE: '#08bfa2',

-  BG_OFF: '#222',
-  BG_BLUE: '#007AB8',
-  BG_BRIGHTBLUE: '#5FCCFF',
-  BG_RED: '#B80000',
-  BG_BRIGHTRED: '#FF4343',
+  UI_ACCENT: '#08bfa2',
+
+  SKY_OFF: '#297547',
+  SKY_BLUE: '#840d42',
+  SKY_RED: '#154136',
+
+  BG_OFF: '#081a0f',
+  BG_BLUE: '#379f5e',
+  BG_BRIGHTBLUE: '#4fd983',
+  BG_RED: '#ff1f81',
+  BG_BRIGHTRED: '#ff6bb0',

  NEON_OFF: '#000',
-  NEON_BLUE: '#00f',
-  NEON_BRIGHTBLUE: '#aaf',
-  NEON_RED: '#f00',
-  NEON_BRIGHTRED: '#faa',
+  NEON_BLUE: '#008a70',
+  NEON_BRIGHTBLUE: '#87c2ff',
+  NEON_RED: '#f01978',
+  NEON_BRIGHTRED: '#ff70b5',

  TEXT_OFF: '#000',
  TEXT_NORMAL: '#444',
  TEXT_BOLD: '#888',

-  BEAT_RED: '#570808',
-  BEAT_BLUE: '#10106A',
+  BEAT_RED: '#46021c',
+  BEAT_BLUE: '#01261a',

-  MINE_RED: '#070304',
-  MINE_RED_EMISSION: '#090707',
-  MINE_BLUE: '#030407',
-  MINE_BLUE_EMISSION: '#070709',
+  MINE_RED: '#1c060e',
+  MINE_RED_EMISSION: '#2a0d1b',
+  MINE_BLUE: '#011114',
+  MINE_BLUE_EMISSION: '#072020',
 };
--- a/src/index.html
+++ b/src/index.html
@@ -18,7 +18,7 @@

    <a-scene
    stats
-      mixin="gameoverAnimation bgColorAnimation tunnelColorAnimation leftLaserColorAnimation rightLaserColorAnimation textGlowColorAnimation"
+      mixin="gameoverAnimation bgColorAnimation tunnelColorAnimation leftLaserColorAnimation rightLaserColorAnimation textGlowColorAnimation floorColorAnimation"
      bind__beat-loader="challengeId: challenge.id; difficulty: menuSelectedChallenge.difficulty; isPlaying: isPlaying; menuSelectedChallengeId: menuSelectedChallenge.id"
      bind__gameover="isGameOver: isGameOver"
      bind__intro-song="isPlaying: menuActive && !menuSelectedChallenge.id; isSearching: isSearching"
@@ -41,18 +41,16 @@
      pool__beat-mine="mixin: mine; size: 12; container: #beatContainer"
      pool__beatscoreok="mixin: beatScoreOk; size: 2; container: #beatContainer"
      pool__beatscoregood="mixin: beatScoreGood; size: 2; container: #beatContainer"
-      pool__beatscoregreat="mixin: beatScoreGreat; size: 2; container: #beatContainer"
+      pool__beatscoreexcellent="mixin: beatScoreExcellent; size: 2; container: #beatContainer"
      pool__beatscoresuper="mixin: beatScoreSuper; size: 2; container: #beatContainer"
      pool__wall="mixin: wall; size: 10; container: #beatContainer"
      proxy-event__cleargame1="event: gamemenuexit; as: cleargame; to: a-scene"
      proxy-event__cleargame2="event: gamemenurestart; as: cleargame; to: a-scene"
      play-sound__beatwrong="sound: #beatMissSound; event: beatwrong; volume: 0.4"
-      play-sound__beatwrong="sound: #beatMissSound; event: beatwrong; volume: 0.75"
      proxy-event__pausegame="event: pausegame; as: textglowoff; to: a-scene"
      proxy-event__resumegame="event: gamemenuresume; as: textglownormal; to: a-scene"
      play-sound__victory="sound: #victorySong; event: victory"
      play-sound__crescendo="sound: #crescendo; event: victory; volume: 0.75"
-      play-sound__victory="sound: #victorySong; event: victory"
      search
      stage-colors="color: blue"
      vr-mode-ui="enterVRButton: #vrButton"
@@ -113,7 +111,7 @@
        particleplayer="src: #mineParticlesJSON; pscale: 0.5; scale: 1.4; loop: false; on: explode; img: #sparkImg; count: 20%; animateScale: true; initialScale: 3 1 1; finalScale: 0.2 0.2 1"></a-entity>
      <a-entity
        id="sparkParticles"
-        particleplayer="src: #sparksJSON; color: #fcc; pscale: 0.7; on: explode; scale: 0.1; loop: false; img: #spark2Img; dur: 700; count: 50%; animateScale: true; initialScale: 3 0.5 1; finalScale: 0.1 0.5 1"></a-entity>
+        particleplayer="src: #sparksJSON; color: #fcc; pscale: 0.7; on: explode; scale: 0.3; loop: false; img: #spark2Img; dur: 700; count: 50%; animateScale: true; initialScale: 3 0.5 1; finalScale: 0.1 0.5 1"></a-entity>

      <a-mixin
        id="cursorMesh"
@@ -149,31 +147,27 @@
        {% macro saber (hand, otherHand, bladeColor, beamColor) %}
          <a-entity id="{{ hand }}Hand"
            class="saber"
+            mixin="raycaster"
            bind__hand-swapper="enabled: {{ otherHand }}RaycasterActive"
            bind__menu-controls="page: search.page; selectedChallengeId: menuSelectedChallenge.id"
            bind__pauser="enabled: isPlaying"
            bind__raycaster="enabled: {{ hand }}RaycasterActive"
            bind__raycaster-game="enabled: isPlaying"
            bind__saber-controls="bladeEnabled: isPlaying; isPaused: isPaused"
-            bind__saber-particles="enabled: isPlaying"
            bind__trail="enabled: isPlaying"
            haptics="events: mouseenter; dur: 35; force: 0.075"
-            haptics__beat="eventsFrom: #beatContainer; events: beatcollide{{ hand }}; dur: 80; force: 0.3"
+            haptics__beat="eventsFrom: #beatContainer; events: beatcollide{{ hand }}; dur: 80; force: 0.2"
            haptics__draw="events: drawblade; dur: 750; force: 0.025"
            haptics-saber
            haptics-wall
            raycaster="objects: [raycastable]; far: 5"
            raycaster__game="objects: [raycastable-game]:not(.blade{{ hand }}); far: 1; interval: 50"
-            saber-particles="hand: {{ hand }}"
            saber-controls="hand: {{ hand }}"
            thumb-controls
            thumb-controls-debug="enabled: false; hand: {{ hand }}; controllerType: vive-controls"
            trail="color: {{ bladeColor }}; hand: {{ hand }}">
            <a-entity
-              id="saberLengthOffset"
-              bind__position="controllerType === 'oculus-touch-controls' && '0 0 0.025' || '0 0 0.06'">
-
-            <a-entity id="{{ hand }}Laser"
+              id="{{ hand }}Laser"
              bind__cursor-laser="enabled: menuActive && activeHand === '{{ hand }}'"
              geometry="primitive: cylinder; height: 1; radius: 0.005"
              material="color: {{ beamColor }}; shader: flat"
@@ -213,6 +207,7 @@
                  position="0 0 -0.0125"></a-entity>
              </a-entity>
            </a-entity>
+
            <a-entity
              class="fakeGlow"
              fake-glow="color: {{ beamColor }}"
@@ -221,7 +216,6 @@
              bind__visible="!isPlaying">
            </a-entity>
          </a-entity>
-          </a-entity>

          <a-entity
            id="{{ hand }}CursorMesh"
@@ -233,8 +227,8 @@
            scale="1.3 1.3 1.3"></a-entity>
        {% endmacro %}

-        {{ saber('left', 'right', '#f00', 'pink') }}
-        {{ saber('right', 'left', '#00f', 'cyan') }}
+        {{ saber('left', 'right', '#850e3e', 'pink') }}
+        {{ saber('right', 'left', '#256c43', 'cyan') }}
      </a-entity>

      <a-entity
@@ -248,6 +242,7 @@
        <a-entity
          id="mouseCursor"
          bind__raycaster="enabled: !inVR"
+          mixin="raycaster"
          cursor="rayOrigin: mouse"
          raycaster="objects: [raycastable]"></a-entity>
        <a-entity
--- a/src/templates/menu.html
+++ b/src/templates/menu.html
@@ -46,7 +46,7 @@
    animation__mouseleave="property: components.slice9.material.opacity; from: 0.3; to: 0; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
    mixin="slice"
    raycaster-target="width: 1; height: 0.32"
-    slice9="width: 0.8; color: #067197; height: 0.130; padding: 0.03; opacity: 0"></a-mixin>
+    slice9="width: 0.8; color: {{ COLORS.UI_ACCENT }}; height: 0.130; padding: 0.03; opacity: 0"></a-mixin>

  <a-entity
    id="searchPrevPage"
@@ -86,7 +86,7 @@
        bind-item__animation__mouseleavevisible="enabled: menuSelectedChallenge.id !== item.id"
        bind-toggle__raycastable="menuActive"
        geometry="primitive: plane; width: 1.1; height: 0.2"
-        material="shader: flat; color: #067197; transparent: true; opacity: 0.0"
+        material="shader: flat; color: {{ COLORS.UI_ACCENT }}; transparent: true; opacity: 0.0"
        position="0 -0.13 -0.002"
        play-sound="event: mouseenter; sound: #hoverSound; volume: 0.03"
        animation__mouseenter="property: components.material.material.opacity; from: 0.0; to: 1.0; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150; delay: 1"
@@ -178,7 +178,7 @@
                bind-item__animation__mouseleavevisible="enabled: menuSelectedChallenge.difficulty !== item"
                bind-toggle__raycastable="menuActive && !!menuSelectedChallenge.id && menuSelectedChallenge.difficulty !== item"
                geometry="primitive: plane; width: 0.4; height: 0.2"
-                material="shader: flat; color: #067197; transparent: true; opacity: 0.0"
+                material="shader: flat; color:  {{ COLORS.UI_ACCENT }}; transparent: true; opacity: 0.0"
                position="0 -0.005 0"
                play-sound="event: mouseenter; sound: #hoverSound; volume: 0.03"
                animation__mouseenter="property: components.material.material.opacity; to: 1.0; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
--- a/src/templates/stage.html
+++ b/src/templates/stage.html
@@ -91,7 +91,6 @@
    <a-entity obj-model="obj: #rightLaserObj" materials="name: stageAdditive" position="14 -1.5 -36"></a-entity>
  </a-entity>

-  <a-entity id="beams" bind__beams="isPlaying: isPlaying"></a-entity>
  <a-entity id="twister" position="0 0 -35" rotation="90 0 0" bind__twister="enabled: isPlaying"></a-entity>

  <a-entity
@@ -109,9 +108,12 @@
  <a-entity id="smoke1" mixin="smoke" position="0 1.4 0" animation__rotate="dur: 200000"></a-entity>
 <!-- <a-entity id="smoke2" mixin="smoke" position="0 1.8 0" scale="1.09 0.8 1.09" animation__rotate="dur: 243000"></a-entity>-->

+  <a-entity id="beams" bind__beams="isPlaying: isPlaying"></a-entity>
+
  <a-entity light="type: directional; intensity: 3" position="0 10 10"></a-entity>

  <a-entity id="logo" bind__visible="menuActive || isVictory" position="0 6 -7.5" rotation="90 0 0">
+    <a-entity id="logoGodraysObj" obj-model="obj: #logoGodraysObj" materials="name: logoadditive"></a-entity>
    <a-entity id="logoObj" obj-model="obj: #logoObj" materials="name: logo"></a-entity>
    <a-entity id="logoFrontU" obj-model="obj: #logofrontUObj" materials="name: logo" logoflicker="delay: 1200" bind__logoflicker="active: menuActive || isVictory"></a-entity>
    <a-entity id="logoGlowObj" obj-model="obj: #logoGlowObj" materials="name: logoadditive"></a-entity>
@@ -121,12 +123,10 @@
    <!-- material="color: #030303" -->
  <a-entity
    id="floor"
-    data-saber-particles
    geometry="primitive: plane; width: 3; height: 3"
    rotation="-90 0 0"
-    raycastable-game
-    rotation="-90 0 0"
    material="shader: floorShader; color: #f33; normalMap: #floorNormalsImg; envMap: #floorEnvImg"
+    bind__saber-intersection="active: isPlaying"
    stepback></a-entity>

  <a-entity
@@ -139,4 +139,3 @@
    rotation="-45 0 0">
  </a-entity>
 </a-entity>
-f