diff --git a/Makefile b/Makefile
index 48df1ce..454f3fa 100644
--- a/Makefile
+++ b/Makefile
@@ -1,2 +1,10 @@
-build:
-	pandoc slides.md -o dist/slides.pdf -t beamer -V theme:DarkConsole
+build: slides website
+
+slides:
+	pandoc slides/slides.md -o dist/slides.pdf -t beamer -V theme:DarkConsole
+
+website:
+	pandoc website/site.md -o dist/website/index.html
+
+qrcode:
+	qrencode -t PNG -s 5 -o imgs/menti.png https://www.menti.com/9w1aj8bb8o
diff --git a/dist/slides.pdf b/dist/slides.pdf
index 1dc8f5d..78e4415 100644
Binary files a/dist/slides.pdf and b/dist/slides.pdf differ
diff --git a/dist/website/index.html b/dist/website/index.html
new file mode 100644
index 0000000..de0b60f
--- /dev/null
+++ b/dist/website/index.html
@@ -0,0 +1,26 @@
+<p>–</p>
+<hr />
+<h1 id="links">Links</h1>
+<ul>
+<li>Einstieg</li>
+<li>p5-Editor</li>
+<li>Code-Beispiele
+<ul>
+<li>Beispiel 1 (Shapes)</li>
+<li>Beispiel 2 (Color)</li>
+<li>Beispiel 3 (Interaktion)</li>
+</ul></li>
+</ul>
+<h2 id="weiterführende-links">Weiterführende Links</h2>
+<ul>
+<li>p5 Bibliotheksreferenz</li>
+<li>Interaktive Paramterübersicht</li>
+<li>Daniel Shiffman</li>
+<li>OpenProcessing</li>
+</ul>
+<h1 id="editor">Editor</h1>
+<iframe id="p5.js web editor embed" title="p5.js web editor embed" width="800" height="600" src="https://editor.p5js.org/">
+</iframe>
+<footer>
+<a href="ag-link.xyz/impressum">Impressum / Datenschutz</a>
+</footer>
diff --git a/imgs/menti.png b/imgs/menti.png
new file mode 100644
index 0000000..6f6009d
Binary files /dev/null and b/imgs/menti.png differ
diff --git a/slides.md b/slides.md
deleted file mode 100644
index 771d949..0000000
--- a/slides.md
+++ /dev/null
@@ -1,7 +0,0 @@
-% Coding Art
-% AG-Link: AG für kritische Informatik
-% DATUM
-
-# Slide 1
-
-- Lorem Ipsum
diff --git a/slides/slides.md b/slides/slides.md
new file mode 100644
index 0000000..a29a752
--- /dev/null
+++ b/slides/slides.md
@@ -0,0 +1,36 @@
+---
+title: Coding Art!
+subtitle: Workshop für die kritischen Einführungswochen 2022
+author: AG Link für kritische Informatik
+date: "11. Oktober 2022"
+classoption: "aspectratio=169"
+header-includes:
+    - \usepackage[labelformat=empty]{caption}
+---
+
+# Hallo Welt!
+
+## Wer sind wir?
+
+- Marie und Lukas 
+- AG Link für kritische Informatik
+
+## Was haben wir heute vor?
+
+- KUNST!
+- Erste Erfahrungen mit **p5.js** machen
+- Nicht: Programmierprofis werden
+
+## Und wer seid ihr? 
+
+![Menti](imgs/menti.png)
+
+## Wie wir heute vorgehen
+
+- Javascript
+- p5.js
+- Alle Links und Ressourcen findet ihr unter **art.ag-link.xyz**
+
+## P5.JS
+
+- **Livedemo!*
diff --git a/website/site.md b/website/site.md
new file mode 100644
index 0000000..f643fbc
--- /dev/null
+++ b/website/site.md
@@ -0,0 +1,32 @@
+--
+
+---
+
+# Links
+
+ - Einstieg
+ - p5-Editor 
+ - Code-Beispiele
+   - Beispiel 1 (Shapes)
+   - Beispiel 2 (Color)
+   - Beispiel 3 (Interaktion)
+
+## Weiterführende Links
+
+ - p5 Bibliotheksreferenz
+ - Interaktive Paramterübersicht
+ - Daniel Shiffman
+ - OpenProcessing
+
+# Editor
+
+<iframe id="p5.js web editor embed"
+    title="p5.js web editor embed"
+    width="800"
+    height="600"
+    src="https://editor.p5js.org/">
+</iframe>
+
+<footer>
+    <a href="ag-link.xyz/impressum">Impressum / Datenschutz</a>
+</footer>
diff --git a/website/style.css b/website/style.css
new file mode 100644
index 0000000..31ad7f7
--- /dev/null
+++ b/website/style.css
@@ -0,0 +1,8 @@
+html {
+    background-color: #fdf6e3 !important;
+}
+
+footer {
+    text-align: center;
+    margin-top: 3em;
+}