• Vorstellung und Organisatorisches
• Setze eine Bookmark auf die aktuelle Seite! - Materialien zum Kurs werden hier bereitgestellt.
• Was ist Informatik?
• Personen auf den Postern im Informatik-Zimmer kurz vorgestellt
• Herbstsemester: Die Programmiersprache Python bzw. genauer deren Variante Tigerjython - Achtung, der Link hat sich verändert: Die ursprünglich verlinkte Seite ist nun hier.
• Spielerisch-chaotische Einführung in Python

• Variablen, Output und Input

• Werbung für Olympiade in Informatik und Olympiaden in anderen Fächern
• weiter mit Variablen, Output und Input

• Auf den Kurs-Seiten stehen Datumsangaben. Diese trage ich jeweils nach der Lektion ein - abhängig davon, wie weit die meisten gekommen sind. Ich erwarte, dass der Stoff bis dahin verstanden ist.
• Am Ende jeder Kurs-Seite stehen Lösungen ausgewählter Aufgaben. Ich bitte um Mitteilung, wenn ich dort weitere Lösungen ergänzen soll.
• eventuell letzte Sachen von Variablen, Output und Input
• for-Schleifen (englisch: for loops)

• Boolesche Werte
• if-Selektion

• Listen

am 27. Oktober: Biber-Training

• Alte Wettbewerbe zum Üben
• Zur Bewertung der Lösungen
• Alte Aufgaben samt Lösungen

• Schüleranleitung Biber

Je nach Lernstand:

• Listen
• Funktionen
• evtl.: Grafik

• Erste Lektion: Informatik-Biber
• Schüler-Umfrage zum Informatik-Unterricht
• Für 2aLM und 2dNP: Wichtiges zur Projektarbeit
• Grafik

Einige Beispiele, die vielleicht nützlich sind:

• Ein- und Ausgabe aus einer bzw. in eine Datei: eingabe-und-ausgabe-mit-windows-pfad.py (Könnte etwa beim Quiz oder beim Vokabeltrainer oder bei der To-do-Liste oder bei Hangman verwendet werden: Quizfragen samt Antworten (und welche richtig ist) bzw. Vokabelpaare bzw. Einträge bzw. Wortliste in einer Datei speichern und von dort holen.)
• Schneller Grafikaufbau (double buffering): bildaufbau-im-hintergrund.py (Falls es in einem Spiel zu sehr flackert oder der langsame Bildaufbau stört.)
• Bild laden, ausgeben, speichern: bild-laden-mehrfach-ausgeben-speichern.py
• Für die Labyrinth-Gestalter: fuer-die-labyrinth-gestalter.py
• Wer die aktuelle Zeit wissen will: aktuelle-zeit.py

Weiteres: Sollte ich besser integrieren… vielleicht auch weniger Sachen pro Programm

• Grafik (inklusive Maus- und Tastatursteuerung)
• Rekursion

Abgabefrist: Dienstag, 14. 12. 2021, um 23:59 Uhr

Zur Abgabe der Projekte

Zur Präsentation der Projekte

In diesem Kapitel wollen wir in Grundzügen verstehen, wie Computer Information speichern und verarbeiten.

Erklärungen per eTafel:

• Mein Aufschrieb als pdf in der 2aLM und fast identisch in der 2dNP

Einige Links dazu:

• Für Geschichtlich interessierte: Wikipedia: Geschichte des Dezimalsystems
• Das Kleines Einmaleins hexadezimal
• Bitte umrechnen zur St. Galler Bahnhofsuhr
• Zur St. Galler Bahnhofsuhr gibt es auch eine App
• Jemandem ein X für ein U vormachen

• Video im Abschnitt Zahlen und Zahlensysteme auf der Seite Bits und Bytes anschauen und Aufgaben lösen (Stand 05.01.2022: 2aLM hat dieses Video zur Hälfte angeschaut; 2dNP hat noch nicht mit den Videos begonnen)
• Video im Abschnitt Zahlen in Bits und Bytes auf der Seite Bits und Bytes anschauen und Aufgaben lösen

Erklärungen per eTafel:

• Mein Aufschrieb als pdf in der 2aLM und in der 2dNP

Einige Links dazu:

• Bis zur Zeit 7:40 angeschaut: Wie man Logische Gatter aus Transistoren baut YouTube: Making logic gates from transistors

Arbeitsblatt pdf und erste Schritte mit Logisim.

Mit der 2aLM ausgefülltes Blatt: pdf; 2dNP hat selbständig gearbeitet.

• 2aLM: Logisim (Bedienung dabei erklärt): XOR-Gatter gebaut; Wahrheitstabelle anzeigen lassen; zum neuen “Bauteil” gemacht; Halbaddierer selbst bauen lassen; Volladdierer bauen lassen (habe logische Ausdrücke an Tafel geschrieben)
• 2dNP (letztes Mal bereits XOR-Gatter gebaut, wohl mit deswegen sind einige bis zum 4-Bit-Addierer samt Hex-Display gekommen)

• 2aLM: Volladdierer zu Ende gebaut. Dann 4-Bit-Addierer gebaut, gleich mit 4-Bit-Pins und 4-kabeligen Eingängen und 4-kabeligem Ausgang (und Übertrag); Hex(adezimal)-Displays zum Anzeigen verwendet.

• 2dNP: Erklärungen per E-Tafel zu “Clock arithmetic und negative Zahlen auf dem Computer”: pdf.

Hier ist die Logisim-Datei für XOR, HA, VA, 4-Bit-Addierer: xor-ha-va-4-bit-addierer-etc.txt

• Leider konnte ich die Datei hier nur als txt-Datei abspeichern. Sie lässt sich aber trotzdem mit Logisim öffnen. Wer will, kann die Endung in “circ” ändern.
• In der Datei befindet sich zusätzlich ein “Wandler”, der eine vierstellige Binärzahl “in ihren Betrag” verwandelt, um sie auf dem Hex-Display anzeigen zu können. Dabei werden wie erklärt Folgen von 4 Bits auf der 16-Stunden-Uhr, die mit einer 1 beginnen, als negative Zahlen interpretiert. Damit kann man dann den 4-Bit-Addierer auch mit Zahlen/Uhrzeiten von -8 bis 7 rechnen lassen.

• 2aLM: Erklärungen per E-Tafel zu “Clock arithmetic und negative Zahlen auf dem Computer”: pdf
• 2aLM (nur das C-Programm) und 2dNP: Überraschende Rechnungen
• 2dNP Videos von Ivo Blöchliger, siehe Codierung nicht-nummerischer Daten: zu Text und Bild ganz angeschaut, zu Ton bzw. Video bis 5:21.

• 2aLM: Warnung Rundungsfehler, beim Rechnen mit Kommazahlen auf dem Computer muss man immer mit Rundungsfehlern rechnen! Dann abwechselnd Arbeitsblatt pdf und Videos von Ivo Blöchliger, siehe Codierung nicht-nummerischer Daten bis 13:50 in Bildcodierungsvideo, Aufgaben dazu noch nicht.
• 2dNP: Audio/Video-Codierungs-Video zu Ende geschaut, dann Arbeitsblatt pdf; die meisten sind mit der ppm-Aufgabe fertig, manche haben die svg-Datei angeschaut, aber wohl noch nicht manipuliert.

ppm-Datei leider als .txt

SVG-Datei leider als .txt

Unter Windows Datei in .ppm umbenennen, dann mit Photoshop (ppm-Datei) bzw. Adobe Illustrator (SVG-Datei) öffnen.

Wenn man die Dateien von unten mit Copy+Paste kopieren will, dann bitte via “Editor” (oder Tigerjython).

P3
# "P3" means this is a RGB color image in ASCII
5 6
255
# "255" is the maximum value for each color
# end of header, data below
255 255 255    255 255 255    255 0 0      255 255 255    255 255 255
255 255 255    255 0 0        255 0 0      255 0 0        255 255 255
255 0 0        255 0 0        255 0 0      255 0 0        255 0 0
0 0 255        0 0 255        0 0 255      0 0 255        0 0 255
0 0 255        255 255 255    0 0 255      255 255 255    0 0 255
0 0 255        255 255 255    0 0 255      0 0 255        0 0 255

<svg height="200" width="200">
<polyline points="100,100 100,80 120,80 120,120 80,120 80,60 140,60 140,140 60,140"
          style="fill:green;stroke:black;stroke-width:2"/>
<circle cx="80" cy="50" r="20" stroke="blue" stroke-width="5" fill="yellow"/>
<text x="30" y="130" fill="red" transform="rotate(-45 30,110)">SVG is great</text>
</svg>

• 2aLM: weiter mit Arbeitsblatt und Videos von Vorwoche (ppm klappte nich bei allen; alle Videos zu Ende geschaut, also noch Rest vom Bild-Video und das ganze Audio/Video-Video)
• 2dNP: RGB-Würfel (als ppm) erzeugt

Fand ich interessant: W3 Schools: Colors Tutorial

• 2aLM: RGB-Würfel (als ppm) erzeugen (Würfel erzeugt, abspeichern als ppm-Datei war vermutlich deutlich zu schnell)
• 2dNP: farbiges Sierpinski-Dreieck (als SVG) erzeugen (farbiges Dreieck erzeugt, aber noch nicht als SVG-Datei gespeichert)

• 2aLM: RGB-Würfel Ende nochmal erklären. Beginnen mit Netzwerke mit Filius.
• 2dNP: SVG-Ausgabe Sierpinski-Dreieck (brauchte relativ lange: “Windows-Probleme” (File extension anzeigen/ändern bei einfachem Demo-SVG-File), wo liegt das File? Öffnen mit Illustrator oder (wenn .html) per Browser, “kleine Schreibfehler” in Python-Programmen finden, dann war ein Rundungsfehler drin …)

• Prüfungstermin und Stoff ansagen
• Netzwerke mit Filius

• 2aLM: 17. Mai 2022 26. April 2022
• 2dNP: 4. Mai 2022

Lernziele: lernziele-bits-and-bytes-farben.pdf

Bei Fragen bitte melden, ich habe es recht schnell zusammengetippt…

HTML: Erste Schritte

Wir schauen zwei Seiten von https://oinf.ch/ an - die Videos sind von 2012, 2013 und 2014:

• https://oinf.ch/kurs/informationsgesellschaft/privatsphaere/, Video von https://de.wikipedia.org/wiki/Glenn_Greenwald gemeinsam anschauen (ca. 20 Minuten)
• https://oinf.ch/kurs/informationsgesellschaft/metadaten/, von den drei Videos dort das letzte von Gary Kovacs anschauen gemeinsam (laut https://de.wikipedia.org/wiki/Lightbeam war er CEO von Mozilla) (ca. 6 Minuten)

• Websites der 2aLM: https://ofi.tech-lab.ch/2022/2aLM/
• Websites der 2dNP: https://ofi.tech-lab.ch/2022/2dNP/

Vermutlich spart es dir in Zukunft viel Zeit, wenn du dir eine HTML-Seite wie

https://ofi.tech-lab.ch/2022/teach/0cc6ccab/meine-startseite.html

anlegst. Speichere diese auf deinem eigenen Rechner (damit du nicht von irgendeiner cloud abhängig bist). Stelle sie als Startseite und als Home-Seite in deinem bevorzugten Browser ein (meist über die drei horizontalen Striche rechts und dann Settings/Einstellungen).

Bisher haben wir nur gelernt, wie man statische Webseiten erstellt. Die meisten Webseiten, die euch im täglichen Leben begegnen, sind dynamisch: Sie reagieren auf Eingaben des Benutzers (über Tastatur oder Maus).

Die übliche Sprache, um Webseiten dynamisch zu machen, ist JavaScript. Es geht jedoch auch mit Python, genauer mit Brython; der Name ist eine Verschmelzung von Browser und Python. Ich habe selbst gerade die Anfänge von Brython gelernt - wenn du das auch lernen willst, helfen dir vielleicht meine ersten beiden ernsthafteren Versuche:

• Nachvollziehen des Brython-Tutorials führt zu https://ofi.tech-lab.ch/2022/teach/0cc6ccab/taschenrechner/taschenrechner.html
• Steuerung per Tastatur: https://ofi.tech-lab.ch/2022/teach/0cc6ccab/bewege-kasten/bewege-kasten.html

Quellcodes als Zip-Dateien: taschenrechner.zip, bewege-kasten.zip

• Auf dem Weg in die Unendlichkeit
• Auf https://www.arte.tv/de/videos/RC-021426/mathewelten/ findet man mehr solche Videos.

Es gibt viele Seiten dazu, etwa https://typing-speed.net/de/.

• https://skribbl.io
• https://setwithfriends.com/
• https://www.boggle.online/

• Cheat Sheet für Tigerjython von Tobias Kohn

Auf den Schulcomputern ist der Task-Manager für Schüler leider gesperrt. Hier ist der Work-Around:

• Öffne PowerShell und gib die folgende Zeile ein (gefolgt von Return):

  endtigerjython.ps1

   stop-process -name javaw 

• Alternative: Speichere diese Zeile in einer Datei und führe diese mit PowerShell aus: Rechtsklick → Ausführen mit PowerShell