UI and Audio Processing Update

README.md

@@ -1 +1,67 @@
 # AudioImage
+
+AudioImage is a powerful web-based tool for Audio Spectrogram Art and Digital Steganography, powered by a Flask backend and Svelte 5 frontend. It transforms audio into visual art and allows for secure, invisible file embedding.
+
+## Features
+
+*   **Process Visualizer**: A real-time, interactive visualization page that lets you watch and hear the transformation process. 
+    *   **Live Waveform**: See the audio signal rendered as a glowing, real-time oscilloscope.
+    *   **Step-by-Step Reveal**: Watch the spectrogram and steganographic image being constructed layer by layer.
+*   **Audio Art Generation**: Convert MP3/AAC audio files into high-resolution visual spectrograms using Python's `librosa` and `matplotlib`.
+    *   **GPU Acceleration**: Automatically uses `torchaudio` and CUDA if available for lightning-fast processing.
+*   **Steganography Hider**: Hide secret audio or image files inside a "host" PNG image effectively using LSB (Least Significant Bit) encoding.
+*   **Universal Decoder**: Decode any image created with AudioImage to retrieve the original hidden files.
+*   **Secure & Private**: All processing happens locally on your server; files are cleaned up automatically.
+
+## Requirements
+
+*   Python 3.12+
+*   Node.js & npm (or Bun)
+*   CUDA-enabled GPU (optional, for faster spectrogram generation)
+
+## Installation
+
+1.  **Backend Setup**:
+    ```bash
+    cd server
+    python3 -m venv venv
+    source venv/bin/activate
+    pip install -r requirements.txt
+    ```
+
+    *Optional for GPU support:*
+    ```bash
+    pip install torch torchaudio --index-url https://download.pytorch.org/whl/cu118
+    ```
+    *(Adjust CUDA version as needed)*
+
+2.  **Frontend Setup**:
+    ```bash
+    # Root directory
+    npm install
+    npm run build
+    ```
+
+## Running the Application
+
+1.  Start the Flask server (which serves the frontend):
+    ```bash
+    cd server
+    source venv/bin/activate
+    python app.py
+    ```
+2.  Open your browser to `http://127.0.0.1:5000`.
+
+## Architecture
+
+*   **Frontend**: SvelteKit (SPA mode), Svelte 5 Runes, TailwindCSS.
+    *   Uses **Server-Sent Events (SSE)** for real-time progress streaming.
+    *   **Canvas API** & **Web Audio API** for the visualizer.
+*   **Backend**: Flask, NumPy, PIL, Librosa, PyTorch (optional).
+*   **Integration**: Flask serves the static Svelte build for a unified deployment experience.
+
+## Usage Notes
+
+*   **Supported Audio**: MP3, AAC, WAV, FLAC.
+*   **Supported Images**: PNG (host/stego).
+*   **Visualizer**: Visit the `/visualizer` page or click the link in the header to see the magic happen in real-time.