Wahlpflichtkurs Medien » Materialsammlung

Dieses ist eine Chronologie des Medienkurses für den Jahrgang 7 an der MBS. Hier können die Arbeitsblätter heruntergeladen oder einzelne Themen nachbereitet werden.

Scratch Labyrint

Programmiere in Scratch, dass die grüne Figur eigenständig seinen Weg durch das Labyrinth findet.

  1. Lade die beiden Grafiken auf deinen Computer (Rechtsklick -> ).
  2. Lege das Labyrinth als Bühne an und die Figur als Figur.
  3. Nutze den roten und den grünen Punkt als Sensor um zu fühlen, wann die weiße oder die schwarze Farbe des Labyrinths berührt werden. Nutze dieses Ereignis zur Richtungsänderung.
  4. Wenn du möchtest, kannst du dir auch eine eigene Figur erstellen.

 

Scratch

Bearbeite Lernkarten mit denen du die Grundlagen von Scratch lernst.

Das Programm Scratch findest du auf deinem Schreibtisch, im Ordner Programmieren.

  1. Bevor du anfängst, fülle bitte einen Fragebogen aus. Vergiss bitte nicht, am Ende des Fragebogens auf »Senden« zu klicken.
  2. Klicke bitte auf Geburtstagskarte um die Lernkarte als PDF-Datei zu öffnen. Die Lernkarten liegen auch ausgedruckt im Computerraum aus.
  3. Klicke bitte auf Unterwasserwelt um die Lernkarten als PDF-Datei zu öffnen.

 

Scratch

Bild, Ton und interaktiver Film: Lerne Programmieren mit Scratch.

Auf dem Desktop deines Computers ist ein Ordner mit dem Namen Programmieren. In diesem Ordner findet du das Programm Scratch. Starte es und öffne eines der folgenden Spiele, welches du dir vorher heruntergeladen haben solltest.

  1. Asteroid Blaster
  2. Pacman
  3. Space Invaders

 

Lernkarten zu HTML bearbeiten

Bearbeite Lernkarten mit denen du noch einmal die Grundlagen von HTML durchgehst.

Aufgabe:

  1. Bevor du anfängst, fülle bitte einen Fragebogen aus. Vergiss bitte nicht, am Ende des Fragebogens auf Senden zu klicken.
  2. Bearbeite die vier Lernkarten-Sets in dieser Reihenfolge. Klicke bitte auf Sitzung 1 um die Lernkarten als PDF-Datei zu öffnen.
  3. Klicke bitte auf Sitzung 2 um die Lernkarten als PDF-Datei zu öffnen.
  4. Klicke bitte auf Sitzung 3 um die Lernkarten als PDF-Datei zu öffnen.
  5. Wenn du fertig bist, fülle bitte einen Fragebogen aus. Vergiss bitte nicht, am Ende des Fragebogens auf Senden zu klicken.

 

Ein Bild in HTML beschreiben

In deinem public_html Verzeichnis findest du eine Vorlage-Datei mit dem Namen mondrian.html und einen Ordner mit dem Namen css, in dem sich eine Datei mit dem Namen mondrian.css befindet.

Öffne diese beiden Dateien in dem Programm notepad++.

Sieh dir an, was die div-Tags mit den bunten Flächen machen.

Nimm das Arbeitsblatt und bearbeite die Aufgabe.

Speichere die Dateien und überprüfe das Ergebnis in Google Chrome.

Verlinke die Datei mondrian.html von deiner Startseite index.html aus.

Text formatieren

Erstelle bitte eine Kopie der Vorlage-Datei, welche sich in deinem public_html Verzeichnis befindet.

Benenne diese Kopie um in text.html

Öffne die Datei text.html in dem Programm notepad++. Lösche alles, was sich zwischen den beiden Body-Tags <body>…</body> befindet.

Schreibe oder kopiere mindestens drei Absätze Text, füge ein Bild ein und formatiere den Text. Verwende für die Formatierung mindestens die in dieser Liste aufgeführten Tags.

  • Überschrift <h1>…</h1>
  • Absatz <p>…</p>
  • Liste <ul><li>…</li></ul>
  • Nummerierte Liste <ol><li>…</li></ol>
  • Bild <img src="…" />
  • Fetter Text <b>…</b> oder <strong>…</strong>
  • Schräggestellter Text (kursiv) <i>…</i> oder <em>…</em>

Speichere die Datei und überprüfe das Ergebnis in Google Chrome.

Verlinke die Datei text.html von deiner Startseite index.html aus.

Ein Navigationsmenü mit Formatvorlagen umsetzen

Hast im Internet eine schöne Website gefunden, kannst du dir einfach den HTML-Code und die Formatvorlage dazu kopieren.

Aufgabe:

Hinter diesem Link ist eine Datei zu finden, in der ein Navigationsmenü zu finden ist. Dieses kannst du einfach kopieren und auf deiner Startseite einfügen.

Klicke auf den Link, sieh dir mit Rechtsklick auf das Browserfenster den Quelltext der Datei an, kopiere den markierten Bereich und füge ihn direkt hinter <body> in deine index.html Datei ein.

Außerdem findest du in der Datei einen Link zu einer CSS-Datei. Klicke in der Quelltextansicht auf den Link und kopiere den Inhalt der angezeigten Datei. Füge die Formatvorlage im <style>-Tag im <head> deiner index.html-Datei ein.

hour of code

Programmiere einen kleinen LEGO® Roboter.

Die Struktur deiner Website

Deine index.html Datei ist deine Startseite. Von dieser Seite sollen alle anderen Dateien von deiner Website aufzurufen sein.

Du hast jetzt schon einige Dateien in deinem public_html Verzeichnis angelegt. Mache sie für alle zugänglich die deine Startseite besuchen indem du dort einen Link zu der Datei erstellst.

Aufgabe:

Räume deine Website auf und mache alle Dateien zugänglich.

Verlinke alle html-Dateien in deinem public_html Verzeichnis von der index.html Datei aus. Für die Dateinamen benutze bitte keine deutschen Sonderzeichen wie Umlaute (äöü), das ß oder Leerzeichen. Statt einem Leerzeichen kannst du gerne den Unterstrich _ benutzen.

Der Tag für einen Link (anchor) sieht so aus:
<a href="Dateiname.html">Linktext</a>

Lege eine neue Datei flaggen.html an, von der Links zu jeder Flaggendatei in deinem public_html Verzeichnis führen.

Eine Flagge in HTML

Der Code für die Polnische Flagge (zip) kann hier heruntergeladen werden.

Polnische Flagge, Seitenverhältnis 5:8

  • Grundgerüst einer HTML Datei – was sind Tags? <html> <head> <body>
  • eine Tabelle, Tabellenspalten und Tabellenzellen: <table> <tbody> <th> <tr> <td>
  • Attribute für Tabellen in HTML: style, bgcolor, align, valign, colspan
  • Kommentare in HTML <!-- dies hier ist ein Kommentar -->
  • Bildpunkte (pixel) als Maßeinheit
  • die Verwendung von Seitenverhältnissen (aspect ratio) als Gestaltungsansatz
  • Hexadezimale Darstellung von Farben aus dem RGB Farbraum (Rot/Grün/Blau)

    #000000 #ff0000 #ffff00 #00ff00 #00ffff #0000ff #ffffff

Unter diesem Link findest du eine nützliche Dokumentation zu HTML: http://de.selfhtml.org/.

Die Bilder für die Flaggen können hier mit Rechtsklick heruntergeladen werden:

weißer Adler Albanien Aserbaidschan Barbados
Brasilien Chile Hamburg Indien
Japan Kanada Lübeck Afghanistan
Saudi Arabien Türkei China (VR) Tunesien

Links zu deinen Inhalten

Hour of Code

Nimm an einer Programmierstunde teil. Wähle zwischen dem Star Wars Game und einer Programmierstunde mit Mine Craft.