Add visualizations for denoising process

Author: cjxthecoder

project-5/index.html

@@ -326,48 +326,53 @@ <h2>Part 1.4 – Iterative Denoising</h2>
 pred_pi_nonoise = (term_1 * x_0 + term_2 * image) / (1 - alpha_cumprod)
 pred_prev_image = add_variance(predicted_variance, t, pred_pi_nonoise)</code></pre></div>
 
+Below are some visualizations for the iterative denoising process:
+
 <div class="subsection">
 <h3>Denoising Loop Visualizations (i_start = 10)</h3>
 
 <p>Noisy Campanile at t = timestep[10]:</p>
 <figure>
-<img src="images/part1_4_initial_noisy.png" alt="Initial noisy Campanile (i_start=10)" />
+<img src="images/ddpm/DDPM_0x5.png" alt="DDPM_0x5.png" />
 <figcaption>Initial noisy Campanile (i_start = 10)</figcaption>
 </figure>
 
 <h4>Every 5th loop of iterative denoising</h4>
 <div class="image-row">
 <figure>
-<img src="images/part1_4_step_0.png" alt="Iterative step 0" />
-<figcaption>Step 0</figcaption>
+<img src="images/ddpm/DDPM_0x5.png" alt="DDPM_0x5.png" />
+<figcaption>Step 0 (initial)</figcaption>
 </figure>
 <figure>
-<img src="images/part1_4_step_5.png" alt="Iterative step 5" />
+<img src="images/ddpm/DDPM_1x5.png" alt="DDPM_1x5.png" />
 <figcaption>Step 5</figcaption>
 </figure>
 <figure>
-<img src="images/part1_4_step_10.png" alt="Iterative step 10" />
+<img src="images/ddpm/DDPM_2x5.png" alt="DDPM_2x5.png" />
 <figcaption>Step 10</figcaption>
 </figure>
 <figure>
-<img src="images/part1_4_step_15.png" alt="Iterative step 15" />
+<img src="images/ddpm/DDPM_3x5.png" alt="DDPM_3x5.png" />
 <figcaption>Step 15</figcaption>
 </figure>
-<!-- Add more if needed -->
+<figure>
+<img src="images/ddpm/DDPM_4x5.png" alt="DDPM_4x5.png" />
+<figcaption>Step 20</figcaption>
+</figure>
 </div>
 
 <h4>Final predicted clean images</h4>
 <div class="image-row">
 <figure>
-<img src="images/part1_4_iterative_clean.png" alt="Iterative clean estimate" />
+<img src="images/ddpm/final_ddpm.png" alt="final_ddpm.png" />
 <figcaption>Iterative denoising clean image</figcaption>
 </figure>
 <figure>
-<img src="images/part1_4_onestep_clean.png" alt="One-step clean estimate" />
+<img src="images/ddpm/final_onestep.png" alt="final_onestep.png" />
 <figcaption>One-step denoising (from part 1.3)</figcaption>
 </figure>
 <figure>
-<img src="images/part1_4_gaussian_clean.png" alt="Gaussian-blurred estimate" />
+<img src="images/ddpm/final_gaussianblur.png" alt="final_gaussianblur.png" />
 <figcaption>Gaussian blur baseline (from part 1.2)</figcaption>
 </figure>
 </div>