1 files changed, 77 insertions, 12 deletions
diff --git a/_site/projects/matrix-digital-rain/index.html b/_site/projects/matrix-digital-rain/index.html
index 666456b..2893c92 100644
--- a/_site/projects/matrix-digital-rain/index.html
+++ b/_site/projects/matrix-digital-rain/index.html
@@ -44,23 +44,88 @@
           <h2 class="center" id="title">THE MATRIX DIGITAL RAIN</h2>
           <h6 class="center">12 JANUARY 2024</h5>
           <br>
-          <div class="twocol justify"><p>The famous digital rain from The Matrix, implemented in C.</p>
+          <div class="twocol justify"><p>“All I see is blonde, brunette, red head.” The iconic digital rain from The
+Matrix in C, with zero dependencies - not even ncurses.</p>
 
 <video style="max-width:100%;" controls="" poster="thumb.png">
   <source src="matrix.mp4" type="video/mp4" />
 </video>
 
-<p>This project is a fork of Domsson’s beautiful <a href="https://github.com/domsson/fakesteak" class="external" target="_blank" rel="noopener noreferrer">Fakesteak</a>.</p>
-
-<p>There are three color settings: head, tail, and background. They are configured
-by setting the 24-bit RGB channels using <code class="language-plaintext highlighter-rouge">COLOR_*_RED</code>, <code class="language-plaintext highlighter-rouge">COLOR_*_GRN</code>, and
-<code class="language-plaintext highlighter-rouge">COLOR_*_BLU</code> definitions. The ghosting effect of old monochrome screens is
-achieved by scaling the RGB channels. This results in a rain effect that
-closely resembles the original from the first Matrix movie.</p>
-
-<p>In addition, this implementation supports UTF-32 character sets. The
-<code class="language-plaintext highlighter-rouge">UNICODE_MIN</code> and <code class="language-plaintext highlighter-rouge">UNICODE_MAX</code> controls the Unicode block used. For
-instance, setting them to <code class="language-plaintext highlighter-rouge">0x30A1</code> and <code class="language-plaintext highlighter-rouge">0x30F6</code> rains Katakana:</p>
+<h2 id="overview">Overview</h2>
+
+<p>This is my fork of Domsson’s beautiful <a href="https://github.com/domsson/fakesteak" class="external" target="_blank" rel="noopener noreferrer">Fakesteak</a>. While studying the code, I wondered
+what it would take to faithfully recreate the original Matrix from the first
+movie without sacrificing the program’s minimalism and elegance.</p>
+
+<p>My version adds:</p>
+
+<ul>
+  <li>Unicode character support.</li>
+  <li>Fully customizable 24-bit RGB (truecolor) colors.</li>
+  <li>Glitches in the matrix.</li>
+  <li>Ghosting effect of old monochrome CRT displays.</li>
+  <li>Closely resembles the Matrix seen in the background during Neo and Cypher’s
+conversation.</li>
+</ul>
+
+<p>With no dependencies, compilation is trivial:</p>
+
+<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>$ cc -O3 main.c -o matrix
+$ ./matrix
+</code></pre></div></div>
+
+<h2 id="how-does-it-work">How does it work?</h2>
+
+<p>The program tracks the state of the terminal - characters, background and
+foreground colors, shading levels, cursor position - using multiple internal
+data buffers. On each frame, it updates these buffers and repaints the screen
+using ANSI escape codes:</p>
+
+<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>static void term_print(const matrix *mat, size_t row, size_t col)
+{
+    size_t idx;
+    idx = mat_idx(mat, row, col);
+    wprintf(L"\x1b[%d;%dH\x1b[38;2;%d;%d;%dm%lc",
+        row, col,
+        mat-&gt;rgb[idx].color[R],
+        mat-&gt;rgb[idx].color[G],
+        mat-&gt;rgb[idx].color[B],
+        mat-&gt;code[idx]);
+}
+</code></pre></div></div>
+
+<p>The ghosting effect, the signature feature of this implementation, works by
+scaling and mixing the RGB channels:</p>
+
+<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>static void mat_shade(matrix *mat, size_t row, size_t col) 
+{
+    unsigned char *color;
+    color = mat-&gt;rgb[mat_idx(mat, row, col)].color;
+    color[R] = color[R] - (color[R] - COLOR_BG_RED) / 2;
+    color[G] = color[G] - (color[G] - COLOR_BG_GRN) / 2;
+    color[B] = color[B] - (color[B] - COLOR_BG_BLU) / 2;
+}
+</code></pre></div></div>
+
+<p>The ghosting function emulates the screen decay by gradually transitioning each
+raindrop’s color towards the background color. This approach provides two key
+benefits: straightforward color configuration that integrates naturally with
+Unix ricing (desktop customization) and high-fidelity recreation of the Matrix
+aesthetic.</p>
+
+<h2 id="customization">Customization</h2>
+
+<p>While you can adjust almost every aspect, including its speed, glitch
+frequency, and rain density, the most useful settings for customization are the
+color scheme and character set.</p>
+
+<p>There are three color settings: head, tail, and background. You can configure
+them by setting the <code class="language-plaintext highlighter-rouge">COLOR_*_RED</code>, <code class="language-plaintext highlighter-rouge">COLOR_*_GRN</code>, and <code class="language-plaintext highlighter-rouge">COLOR_*_BLU</code> definitions
+in main.c.</p>
+
+<p>The <code class="language-plaintext highlighter-rouge">UNICODE_MIN</code> and <code class="language-plaintext highlighter-rouge">UNICODE_MAX</code> values control the Unicode block used. For
+example, setting them to <code class="language-plaintext highlighter-rouge">0x30A1</code> and <code class="language-plaintext highlighter-rouge">0x30F6</code> rains Katakana (if a font that
+supports Katakana is present on the system):</p>
 
 <p><img style="width: 100%;" src="katakana.png" /></p>