From 9db1479cc07b9d14f7586ff37748ca97b2b7d658 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rapha=C3=ABl=20Forment?= <raphael.forment@gmail.com>
Date: Tue, 15 Jul 2025 01:20:24 +0200
Subject: [PATCH] update the welcome popup

---
 src/components/WelcomePopup.tsx | 27 ++++++++++++++++++---------
 1 file changed, 18 insertions(+), 9 deletions(-)

diff --git a/src/components/WelcomePopup.tsx b/src/components/WelcomePopup.tsx
index ffdf6ff..caa5c9b 100644
--- a/src/components/WelcomePopup.tsx
+++ b/src/components/WelcomePopup.tsx
@@ -32,33 +32,42 @@ export const WelcomePopup: React.FC = () => {
         <h2 className="welcome-title">Welcome to BitFielder</h2>
 
         <div className="welcome-content">
-          <p>
-            BitFielder is an experimental lofi bitfield shader editor made by{' '}
-            <a href="https://raphaelforment.fr">BuboBubo</a>. Use it to create
-            visual compositions through code. I use it for fun :){' '}
+          <p style={{ textAlign: 'justify' }}>
+            BitFielder is a bitfield shader editor made by{' '}
+            <a href="https://raphaelforment.fr">BuboBubo</a>. Use it to live code weird reactive visuals.
+            I built this tool to have fun and explore. It is quite easy to learn and quite rewarding if you
+            put time into it! This tool can eat a lot of CPU, beware!{' '}
           </p>
 
           <h3>Getting Started</h3>
           <ul>
-            <li>
-              Edit the shader code and press <i>Eval</i> or <i>Ctrl+Enter</i>
+            <li>Edit the shader code and press <i>Eval</i> or <i>Ctrl+Enter</i>
+              <ul style={{ marginTop: '8px' }}>
+                <li><b>Lazy mode:</b> press <i>R</i>, <i>G</i> and <i>M</i> randomly!</li>
+              </ul>
             </li>
             <li>Use special variables to create reactive effects</li>
-            <li>Explore/store shaders in the library (left pane)</li>
+            <li>Learn more variables / operators / functions</li>
+            <li>Store shaders in the library (left pane)</li>
             <li>Export your creations as images or sharable links</li>
           </ul>
 
           <h3>Key Features</h3>
           <ul>
             <li>
-              <strong>Real-time editing:</strong> See your changes instantly
+              <strong>Realtime editing:</strong> See your changes instantly
             </li>
             <li>
               <strong>Motion and touch:</strong> Mouse, touchscreen support
             </li>
             <li>
-              <strong>Audio reactive:</strong> Synchronize with a sound signal
+              <strong>Audio reactive:</strong> Synchronize with a sound source
             </li>
+            <li>
+              <strong>Randomly cool:</strong> Pretty much any formula works!
+              <ul style={{ marginTop: '8px' }}><li>Extra keybindings for fun.</li></ul>
+            </li>
+
             <li>
               <strong>Export capabilities:</strong> Save and share your work
             </li>