Compare commits

...

2 Commits

Author SHA1 Message Date
Lukas Z a3a4e35599 tiny changes to slides 2022-10-07 13:55:13 +02:00
Lukas Z 246caf7392 tiny changes to website 2022-10-07 13:54:45 +02:00
4 changed files with 44 additions and 13 deletions

BIN
imgs/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

View File

@ -4,8 +4,9 @@ subtitle: Workshop für die kritischen Einführungswochen 2022
author: AG Link für kritische Informatik, Marie und Lukas
date: "11. Oktober 2022"
classoption: "aspectratio=169"
graphics: yes
header-includes:
- \usepackage[labelformat=empty]{caption}
- \usepackage[labelformat=empty, textformat=empty]{caption}
---
# Hallo Welt!
@ -13,17 +14,21 @@ header-includes:
## Wer sind wir?
- Marie und Lukas
- AG Link für kritische Informatik
- AG Link für kritische Informatik
- seit 2018
- **[ag-link.xyz](https://ag-link.xyz)**
- **ag-link@riseup.net**
- **offenes Plenum**: XX.XX.2022, 19:00 Uhr, Raum XXX
![AG Link](imgs/logo.png){ width=100px }
## Ablauf
1. -> Einstieg <-
2. Einführung p5js
3. Interaktives Tutorial in Kleingruppe
4. Beispiele generativer Kunst
5. Eigene Kunst in Kleingruppen
6. Abschluss
2. Interaktives Tutorial in Kleingruppe
3. Beispiele generativer Kunst
4. Eigene Kunst in Kleingruppen
5. Abschluss
## Was haben wir heute vor?
@ -31,10 +36,14 @@ header-includes:
- keine AI / Neuronale Netze / ...
- Erste Erfahrungen mit **p5.js** machen
- Nicht: Programmierprofis werden
- Gerade wenn ihr noch nie programmiert habt: Nicht jede Zeile der Beispiele wird verständlich für euch sein.
- Falls ihr schon etwas Erfahrung habt: Nicht wundern, wenn streckenweise von Konventionen abgewichen wird.
## Und wer seid ihr?
![Menti](imgs/menti.png)
![Menti (Code: 4532 6343)](imgs/menti.png){ height=200px }
- Menti.com (Code: 4532 6343)
## Wie wir heute vorgehen

View File

@ -1,11 +1,17 @@
---
title: Coding Art - Workshop für die KEW 2022
include-in-header: <link rel="icon" type="image/x-icon" href="https://ag-link.xyz/assets/img/connection.png" />
---
## Ergebnisse des Workshops
*Hier ist noch nichts... wenn ihr mögt, können wir im Anschluss an den Workshop eure Ergebnisse hier "ausstellen"!*
## Links
- [Interaktives Tutorial](https://openprocessing.org/sketch/1642700)
- [p5-Editor](https://editor.p5js.org)
- [p5-Cheatsheet mit vielen wichtigen Kommandos auf einen Blick](https://bmoren.github.io/p5js-cheat-sheet/)
- Code-Beispiele
- Beispiel 1 (Shapes)
- Beispiel 2 (Color)
@ -18,7 +24,7 @@ title: Coding Art - Workshop für die KEW 2022
<iframe id="p5.js web editor embed"
title="p5.js web editor embed"
width="100%"
height="800"
height="700"
src="https://editor.p5js.org/">
</iframe>
@ -27,10 +33,13 @@ title: Coding Art - Workshop für die KEW 2022
## Weiterführende Links
- [p5 Bibliotheksreferenz](https://p5js.org/reference/)
- [p5 Bibliotheksreferenz](https://p5js.org/reference/)
Eine Übersicht und Erklärungen zu wirklich allen Kommandos die p5js bereitstellt.
- [Interaktive Paramterübersicht](TODO)
- [Daniel Shiffman - The Coding Train](https://thecodingtrain.com)
- [OpenProcessing](openprocessing.org)
- [Daniel Shiffman - The Coding Train](https://thecodingtrain.com)
Viele Tutorials und Beispielvideos zu p5js die auf eine sehr sympathische Art und Weise vorgestellt werden.
- [OpenProcessing](openprocessing.org)
Erkundet Tausende Beispiele von p5js-Sketches
<footer>
[Impressum / Datenschutz](https://ag-link.xyz/impressum/)

View File

@ -17,7 +17,8 @@ body {
footer {
text-align: center;
margin-top: 3em;
margin-top: 4em;
padding-bottom: 1em;
}
@ -27,6 +28,10 @@ a {
color: var(--link-color);
}
h2 {
margin-top: 1.5em;
}
h2:after {
content: "";
background-image: url("https://ag-link.xyz/assets/img/connection.png");
@ -36,3 +41,11 @@ h2:after {
display: inline-block;
margin-left: .3em;
}
li {
padding: 0.5em 0 0 0;
}
li li {
padding: 0;
}