WIP.

src/main.rs

 pub mod image;
 pub mod slide;
 
+use crate::slide::introduction::Introduction;
 use crate::slide::title::Title;
 use crate::slide::Slide;
-use eframe::egui::style::Widgets;
+use eframe::egui::style::{Margin, Widgets};
 use eframe::egui::{
-    Align, Direction, FontFamily, Layout, Pos2, Rect, Style, TextStyle, Vec2, Visuals,
+    Align, Direction, FontFamily, Key, Layout, Pos2, Rect, Style, TextStyle, Vec2, Visuals,
 };
 use eframe::epi::{Frame, Storage};
 use eframe::{egui, epi};
@@ -34,13 +35,18 @@ fn main() {
 }
 
 pub struct Cartoon {
-    slides: VecDeque<Box<dyn Slide>>,
+    slides: Vec<Box<dyn Slide>>,
+    slide_index: usize,
 }
 
 impl Default for Cartoon {
     fn default() -> Self {
         Self {
-            slides: vec![Box::new(Title::default()) as Box<dyn Slide>].into(),
+            slides: vec![
+                Box::new(Title::default()) as Box<dyn Slide>,
+                Box::new(Introduction::default()),
+            ],
+            slide_index: 0,
         }
     }
 }
@@ -54,6 +60,7 @@ impl epi::App for Cartoon {
         let mut style = Style::default();
         style.animation_time = 0.5;
         style.visuals = Visuals::light();
+        style.spacing.window_margin = Margin::same(24.0);
         {
             let header_style = style.text_styles.get_mut(&TextStyle::Heading).unwrap();
             header_style.size = 48.0;
@@ -62,6 +69,10 @@ impl epi::App for Cartoon {
             let body_style = style.text_styles.get_mut(&TextStyle::Body).unwrap();
             body_style.size = 30.0;
         }
+        {
+            let small_style = style.text_styles.get_mut(&TextStyle::Small).unwrap();
+            small_style.size = 22.0;
+        }
         ctx.set_style(style);
     }
 
@@ -81,6 +92,12 @@ impl epi::App for Cartoon {
         });
          */
 
-        self.slides[0].update(ctx, frame);
+        if ctx.input().key_pressed(Key::Space) {
+            self.slide_index = (self.slide_index + 1) % self.slides.len();
+        }
+
+        egui::CentralPanel::default().show(ctx, |ui| {
+            self.slides[self.slide_index].show(ui, ctx);
+        });
     }
 }

src/slide.rs

+use eframe::egui::{Context, Ui};
 use eframe::{egui, epi};
 
+pub mod introduction;
 pub mod title;
 
 pub trait Slide {
-    fn update(&mut self, ctx: &egui::Context, frame: &epi::Frame);
+    fn show(&mut self, ui: &mut Ui, ctx: &Context);
 }

src/slide/introduction.rs

+use crate::{Margin, Slide};
+use eframe::egui::{Context, Frame, Ui};
+use eframe::{egui, epi};
+
+#[derive(Default)]
+pub struct Introduction {}
+
+impl Slide for Introduction {
+    fn show(&mut self, ui: &mut Ui, _ctx: &Context) {
+        Frame::none().margin(Margin::same(20.0)).show(ui, |ui| {
+            ui.heading("Introduction");
+            ui.add_space(8.0);
+            ui.label("Weaknesses");
+            ui.small(" ✖ Blah");
+            ui.small(" ✖ Blah");
+            ui.add_space(10.0);
+            ui.label("Strengths");
+            ui.small(" ✔ Blah");
+        });
+    }
+}

src/slide/title.rs

 use crate::egui::{Align2, Context};
-use crate::epi::Frame;
-use crate::{ctx_img, img, Slide};
+use crate::{ctx_img, img, Margin, Slide};
 use eframe::egui;
-use eframe::egui::{Align, Layout, ScrollArea, Vec2, Window};
+use eframe::egui::{Align, Color32, Frame, Layout, ScrollArea, Style, Ui, Vec2, Window};
 use rand::Rng;
 
 #[derive(Default)]
@@ -11,37 +10,40 @@ pub struct Title {
 }
 
 impl Slide for Title {
-    fn update(&mut self, ctx: &Context, _frame: &Frame) {
+    fn show(&mut self, ui: &mut Ui, ctx: &Context) {
         if self.examples.is_empty() {
             self.examples = vec![
-                ctx_img!(ctx, "raymarching0.png"),
-                ctx_img!(ctx, "raymarching1.png"),
-                ctx_img!(ctx, "atom0.png"),
-                ctx_img!(ctx, "atom1.png"),
-                ctx_img!(ctx, "atom2.png"),
+                ctx_img!(ui.ctx(), "raymarching0.png"),
+                ctx_img!(ui.ctx(), "raymarching1.png"),
+                ctx_img!(ui.ctx(), "atom0.png"),
+                ctx_img!(ui.ctx(), "atom1.png"),
+                ctx_img!(ui.ctx(), "atom2.png"),
             ];
         }
 
-        egui::CentralPanel::default().show(ctx, |ui| {
+        ui.scope(|ui| {
+            ui.style_mut().spacing.window_margin = Margin::same(4.0);
+
             for example in &self.examples {
                 Window::new(example.name())
                     .title_bar(false)
                     .resizable(false)
+                    .frame(Frame::window(&ui.style()).margin(Margin::same(5.0)))
                     .show(ctx, |ui| {
                         ui.image(example, Vec2::splat(128.0));
                     });
             }
+        });
 
-            Window::new("title")
-                .title_bar(false)
-                .resizable(false)
-                .anchor(Align2::CENTER_CENTER, Vec2::ZERO)
-                .show(ctx, |ui| {
-                    ui.vertical_centered(|ui| {
-                        ui.heading("Generative Art");
-                        ui.label("By: TODO");
-                    });
+        Window::new("title")
+            .title_bar(false)
+            .resizable(false)
+            .anchor(Align2::CENTER_CENTER, Vec2::ZERO)
+            .show(ctx, |ui| {
+                ui.vertical_centered(|ui| {
+                    ui.heading("Generative Art");
+                    ui.label("By: TODO");
                 });
-        });
+            });
     }
 }