GNN Exploration tweaks & Projects' CSS

Author: ProcStack

docs/pages/aiDev/gnnExploration.js

@@ -30,14 +30,6 @@ export const pageListingData = {
       'caption' : ["A shortest path propagation in a Message Passing Neural Network (MPNN).",
       ]
     },
-    {
-      'type' : 'video',
-      'src' : '../pages/aiDev/images/mpnn_team_formation_singleMessage.webm',
-      'alt' : "MPNN Team Formation",
-      'style' : ['procPagesMediaStyle','setAspectRatio_2_1'],
-      'caption' : ["A single pass of a MPNN to form a team.",
-      ]
-    },
     {
       'type' : 'video',
       'src' : '../pages/aiDev/images/mpnn_team_formation_links.webm',
@@ -91,11 +83,19 @@ export const pageListingData = {
       <div class='procPagesAboutMeSpacer'></div>
       <br>
       <br>So I set up an 'online matchmaking' system,
-      <br>&nbsp;&nbsp; Showing a simple single pass of detecting connections between nodes.
+      <br>&nbsp;&nbsp; Showing neurons send multiple messages between connected nodes.
+
+      <br>
+      <br> Here the nodes have dashed orange lines to show the 'potential teammates' between nodes.
       
       <br>
-      <br>It asks all of the connected nodes for their 'player stats' for a new game,
+      <br>Multiple messages get sent between neighbors before the final 'prediction' is made.
+      <br>&nbsp;&nbsp; And the 'prediction' is the final team of 4 players that should help build a balanced team, connected in Red.
+
+      <br>
+      <br>It asks all of the connected nodes for their 'player affinity' for a new game,
       <br>&nbsp;&nbsp; Having individual stats 'shift' per game to mimic a player acting differently per game.
+      <br>&nbsp;&nbsp; Then to use those stats to find 'potential teammates' for a balanced team.
 
       <br>
       <br>Example Player Stats:
@@ -110,11 +110,12 @@ export const pageListingData = {
       <br>&nbsp;&nbsp; Helping to construct a team of players that can work together.
 
       <br>
-      <br> The third video is showing a better representation of a GNN,
-      <br>&nbsp;&nbsp; Here the nodes have dashed orange lines to show the 'potential teammates' between nodes.
+      <br>This becomes the core influence on the messages sent between nodes.
+      <br>&nbsp;&nbsp; Which contains 'Team Affinity', 'Role Balance', 'Skill Match' and 'Selection Confidence'.
 
-      <br>Multiple messages get sent between neighbors before the final 'prediction' is made.
-      <br>&nbsp;&nbsp; And the 'prediction' is the final team of 4 players that should help build a balanced team, connected in Red.
+      <br>
+      <br>These 4 values are what's sent between nodes to help determine if a player is 'willing' to change teams,
+      <br>&nbsp;&nbsp; Influenced by the neighbor-of-neighbor player's stats.
 
       <br>
       <br>It's pretty interesting to me,

docs/pages/aiDev/images/mpnn_team_formation_singleMessage.webm

@@ -73,11 +73,11 @@
 .aiDevPageScrollbarStyle::-webkit-scrollbar-thumb {
   border-radius: 2px;
 	cursor: grab;
-	background-color: rgba(33, 53, 117, 0.75);
+	background-color: rgba(52, 78, 161, 0.55);
 }
 .aiDevPageScrollbarStyle::-webkit-scrollbar-thumb:hover {
   border-radius: 2px;
-	background-color: rgba(34, 61, 151, 0.811);
+	background-color: rgba(34, 72, 196, 0.81);
 }
 
 /* -- -- -- */

docs/style/procPages/procPages_aiDevStyle.css

@@ -18,7 +18,7 @@
 /* -- -- -- */
 
 .gitProjectsPage-sectionNavButtonStyle{
-  color: rgba(186, 228, 255, 0.92);
+  color: rgba(194, 231, 255, 0.92);
   text-shadow: 1.5px 1.5px 4px #252525;
   background-color: rgba(33, 81, 116, 0.15);
   border-color: rgba(84, 203, 255, 0.45) rgba(57, 141, 177, 0.2);
@@ -144,9 +144,9 @@
   border-bottom: 1px solid rgba(17, 108, 191, 0.4);
 }
 .procPagesNav_projectsStyle a {
-  border: 1px solid rgb(119 178 223);
-  color: rgb(175 220 255);
-  background-color: rgba(32, 120, 188, 0.35);
+  border: 1px solid #54a9ea;
+  color: #b8dfff;
+  background-color: rgba(37, 131, 204, 0.31);
 }
 .procPagesNav_projectsStyle a:hover {
   text-shadow: 1px 1.5px 4px #5fb3f4;
@@ -160,7 +160,8 @@
 
 .procPagesNav_projectsActiveStyle {
   text-shadow: 1px 1.5px 4px #405e74 !important;
-  background-color: rgba(22, 134, 219, 0.85) !important;
+  background-color: #0085ea !important;
+  color: #b8e0ff !important;
 }