Diesen aiMOOC als Battle spielen: Informatik, Klasse 5-6, E-Niveau

BK5 - Pixel Art entdecken

Einleitung

Willkommen bei BK5 - Pixel Art entdecken! In diesem aiMOOC lernst Du, wie aus einzelnen Bildpunkten Bilder entstehen. Du untersuchst Raster, entdeckst typische Merkmale von Pixel Art, vereinfachst Gegenstände zu klaren Formen und entwickelst schließlich eigene Pixelbilder. Wenn Du möchtest, kannst Du Dein Motiv sogar als kleine Animation zum Leben erwecken.

Pixel Art gehört zur digitalen Kunst. Statt möglichst glatte Linien zu verstecken, werden die einzelnen Bildpunkte bewusst gestaltet. Dadurch entstehen klare, kantige Formen, die an frühe Computer- und Videospielgrafiken erinnern, aber heute auch als eigenständiger Kunststil genutzt werden.

Beobachtungsauftrag: Sieh Dir besonders die vergrößerte Stelle an. Welche Farbflächen erkennst Du? Wo kannst Du einzelne Bildpunkte unterscheiden?

Für diesen Kurs kannst Du digital oder analog arbeiten. Digital eignen sich ein Computer oder Tablet und ein Pixel-Editor. Analog reichen kariertes Papier und Buntstifte. Für eine Unterrichtseinheit kannst Du ungefähr zwei bis drei Schulstunden einplanen.

Lernziele und Niveaustufen

Am Ende kannst Du erklären, was ein Pixel und ein Raster sind, einfache Motive in reduzierte Formen zerlegen und ein eigenes Pixelbild gestalten. Die Aufgaben sind in drei Niveaustufen differenziert:

Niveau	Dein Ziel	Typische Herausforderung
G – Grundniveau	Du erkennst Pixel, Raster und einfache Formen und gestaltest ein gut lesbares Motiv.	Arbeite mit einem kleinen Raster und wenigen Farben.
M – Mittleres Niveau	Du entwickelst ein eigenes Motiv und setzt Form, Farbe und Kontrast gezielt ein.	Begründe Deine Farbwahl und verbessere Details.
E – Erweitertes Niveau	Du entwickelst eine eigene Bildidee mit differenzierter Farbpalette oder Animation.	Plane mehrere Frames, Schatten oder eine kleine Spielgrafik.

Was ist Pixel Art?

Ein digitales Rasterbild besteht aus vielen kleinen Bildpunkten. Ein solcher Bildpunkt heißt Pixel. Jeder Pixel erhält einen bestimmten Farbwert. Werden viele Pixel in Zeilen und Spalten angeordnet, entsteht ein Bild.

Bei Pixel Art werden die einzelnen Pixel nicht nur technisch erzeugt, sondern bewusst gesetzt. Die Künstlerin oder der Künstler entscheidet also genau, welcher Bildpunkt welche Farbe bekommen soll. Dadurch ist Pixel Art eng mit Rastergrafiken verbunden.

In der Landschaft oben kannst Du erkennen, dass Berge, Sonne, Wolken und Wiese mit deutlich sichtbaren kleinen Farbflächen aufgebaut sind. Trotz der Reduktion bleiben die Motive gut erkennbar.

Merksatz: Pixel Art bedeutet nicht einfach „ein unscharfes Bild mit großen Kästchen“. Entscheidend ist die bewusste Gestaltung auf der Ebene einzelner Bildpunkte.

Das Video zeigt, wie die Pixelästhetik sogar mit Bügelperlen in die reale Welt übertragen werden kann. Jede Perle kann dabei ähnlich wie ein Bildpunkt gedacht werden.

Bildpunkte: Das kleinste Bauteil im Rasterbild

Das Wort Pixel ist eine Kurzform von „picture element“, also Bildelement. In einer Rastergrafik ist ein Pixel ein einzelner Bildpunkt mit einer bestimmten Farbe. Stell Dir eine riesige Wand aus kleinen farbigen Fliesen vor: Aus der Nähe siehst Du einzelne Fliesen, aus größerer Entfernung erkennst Du ein Gesamtbild.

Auf einem Bildschirm können einzelne Bildschirmpixel wiederum aus kleineren farbigen Bereichen bestehen. Häufig kommen dabei Rot, Grün und Blau vor. Diese Teilbereiche nennt man Subpixel. Für Deine eigene Pixel Art musst Du Subpixel aber nicht einzeln bearbeiten.

G-Niveau: Merke Dir vor allem: Ein Pixel ist ein Bildpunkt.

M-Niveau: Erkläre zusätzlich, warum viele einzelne Pixel gemeinsam eine Form ergeben.

E-Niveau: Unterscheide zwischen dem Pixel in einer Bilddatei und den physischen Bildpunkten beziehungsweise Subpixeln eines Bildschirms.

Raster und Auflösung

Ein Raster ordnet Bildpunkte in Zeilen und Spalten. Ein Raster kann zum Beispiel aus 8 × 8, 16 × 16 oder 32 × 32 Feldern bestehen. Je mehr Felder zur Verfügung stehen, desto mehr kleine Details können dargestellt werden. Eine höhere Zahl von Pixeln macht ein Bild aber nicht automatisch künstlerisch besser. Pixel Art lebt oft gerade davon, mit wenig Platz gute Entscheidungen zu treffen.

Wenn Du auf kariertem Papier arbeitest, kann jedes Kästchen genau einen Pixel darstellen. Male ein Kästchen immer vollständig aus. Halbe Pixel gibt es in Deinem Raster nicht.

Raster-Experiment: Zeichne zuerst einen Kreis frei auf Papier. Übertrage ihn danach in ein 8 × 8-Raster. Vergleiche beide Formen. Welche Treppenstufen entstehen an der runden Kante?

Reduzierte Formen: Weniger Details, klare Wirkung

Pixel Art zwingt Dich zu einer wichtigen gestalterischen Entscheidung: Was ist wirklich nötig, damit ein Motiv erkennbar bleibt? Ein Auge kann manchmal aus nur zwei oder drei Pixeln bestehen. Ein Baum braucht vielleicht nur Stamm, Krone und eine dunklere Schattenseite. Ein Gesicht kann schon durch wenige Punkte und Linien einen Ausdruck bekommen.

Eine hilfreiche Reihenfolge ist:

Silhouette prüfen: Ist die Außenform des Motivs schon ohne Details erkennbar?
Große Flächen setzen: Teile das Motiv in wenige wichtige Formen.
Details reduzieren: Lass kleine Einzelheiten weg, wenn sie das Bild unruhig machen.
Kontraste nutzen: Helle und dunkle Bereiche helfen beim Erkennen.
Pixel kontrollieren: Entferne zufällige Einzelpixel, die nicht zur Form beitragen.

Tipp für Klasse 5: Beginne nicht mit einem realistischen Porträt. Ein Apfel, Pilz, Haus, Tierkopf, Roboter, Fahrzeug, Baum oder Fantasiesymbol eignet sich besser.

Farbe, Palette und Kontrast

Eine Farbpalette ist die Auswahl der Farben, die Du in einem Bild verwendest. Eine kleine Palette zwingt Dich dazu, gezielt auszuwählen. Für ein erstes Pixelbild reichen oft drei bis sechs Farben.

Du kannst zum Beispiel mit einer Grundfarbe, einer helleren Farbe für Licht und einer dunkleren Farbe für Schatten arbeiten. Auch ein heller Hintergrund und eine dunkle Figur können für guten Kontrast sorgen.

Klassische Pixel Art verwendet häufig klar gesetzte Kanten. Automatische Weichzeichnung kann die bewusst sichtbare Pixelstruktur verändern. Im E-Niveau kannst Du untersuchen, wann eine leichte Kantenglättung sinnvoll wirkt und wann sie den Pixelcharakter schwächt.

Mini-Aufgabe: Gestalte dasselbe 8 × 8-Symbol einmal mit acht Farben und einmal nur mit drei Farben. Welche Version wirkt klarer?

Pixel Art und Spielgrafik

Viele Menschen kennen Pixel Art aus Videospielen. Kleine Figuren oder Objekte in Spielen werden häufig Sprites genannt. Ein Sprite kann eine Spielfigur, ein Schlüssel, ein Baum, ein Gegner oder ein anderes Objekt sein.

In einer Spielszene müssen Formen schnell erkennbar sein. Deshalb sind Silhouette, Farbe und Kontrast besonders wichtig.

Auch ältere Spiele zeigen, wie stark Formen reduziert werden können:

Frühe Computer- und Videospielgrafiken waren technisch oft durch geringe Auflösungen und begrenzten Speicher eingeschränkt. Heute können Künstlerinnen und Künstler diese sichtbare Pixelästhetik bewusst als Stilmittel wählen.

Sprites und Sprite-Sheets

Ein Sprite-Sheet sammelt mehrere kleine Grafiken in einer Bilddatei. In Spielen können daraus unterschiedliche Zustände oder Bewegungsphasen ausgewählt werden.

Wenn eine Spielfigur läuft, können zum Beispiel mehrere leicht unterschiedliche Bilder nacheinander gezeigt werden. Jedes einzelne Bild einer solchen Folge heißt Frame.

Beobachtungsauftrag: Suche in einem Sprite-Sheet nach Bildern, die fast gleich aussehen. Welche kleinen Veränderungen könnten eine Bewegung erzeugen?

Animation: Pixelbilder in Bewegung

Eine Animation entsteht, wenn mehrere Einzelbilder schnell nacheinander gezeigt werden. Schon zwei bis vier Frames können für eine einfache Bewegung reichen: Ein Stern blinkt, ein Auge zwinkert oder eine Figur hebt einen Arm.

Beim Animieren gilt: Verändere zwischen zwei Frames nur so viel wie nötig. Dann bleibt die Bewegung nachvollziehbar.

Das Video zeigt am Beispiel von Piskel, wie Sprites und einfache Frame-für-Frame-Animationen aufgebaut werden können. Für Klasse 5 kannst Du Dich auf wenige Frames und einfache Bewegungen beschränken.

Interaktive Pixel-Editoren

Für das digitale Arbeiten kannst Du unterschiedliche Werkzeuge ausprobieren. Öffne externe Webseiten im Unterricht nur nach Absprache mit Deiner Lehrkraft und veröffentliche keine persönlichen Daten.

G: Piskel for Kids bietet eine besonders einfache Zeichenoberfläche für Pixelbilder und kleine Animationen.
M: Pixilart – Pixel Editor ermöglicht Pixelzeichnungen mit Raster, Ebenen und Frames.
E: Pixelorama Web bietet viele Werkzeuge für Sprites, Paletten, Ebenen und Animationen.
Alternative ohne Internet: Nutze kariertes Papier und Buntstifte. Ein Kästchen entspricht einem Pixel.

Das englischsprachige Video zeigt viele Grundlagen wie klare Linien, Formen, Konturen, Licht, Schatten und Farbauswahl. Nutze einzelne Abschnitte als visuelle Vertiefung.

Werkstatt: Entwickle Dein eigenes Pixelbild

Jetzt gestaltest Du ein eigenes Werk. Wähle je nach Niveau ein Raster und eine Aufgabe.

Motiv wählen: Entscheide Dich für ein einfaches Objekt, Tier, Symbol oder eine Fantasiefigur.
Raster festlegen: G kann mit 8 × 8 oder 16 × 16 arbeiten, M mit 16 × 16 oder 24 × 24, E mit 24 × 24 oder 32 × 32.
Silhouette planen: Setze zuerst nur die Außenform in einer Farbe.
Große Farbflächen ergänzen: Verwende zunächst wenige Farben.
Licht und Schatten setzen: Ergänze eine hellere und eine dunklere Variante.
Details prüfen: Entferne Pixel, die keine wichtige Funktion haben.
Lesbarkeit testen: Betrachte Dein Bild einmal stark vergrößert und einmal in Originalgröße.
Überarbeiten: Vergleiche Deinen Entwurf mit dem Motiv und verbessere Form und Kontrast.
Exportieren: Speichere das fertige Bild möglichst als PNG, damit die Pixelkanten scharf bleiben.
E-Erweiterung: Erstelle zwei bis vier Frames und animiere eine kleine Bewegung.

Differenzierung G/M/E

Bereich	G – Grundniveau	M – Mittleres Niveau	E – Erweitertes Niveau
Raster	8 × 8 oder 16 × 16	16 × 16 oder 24 × 24	24 × 24 oder 32 × 32
Motiv	Einfaches Symbol oder Gegenstand	Eigenes Tier, Objekt oder Figur	Komplexere Figur, Spielobjekt oder Szene
Farben	Drei bis vier Farben	Vier bis acht Farben	Eigene abgestimmte Palette
Form	Klare Silhouette	Silhouette plus Details und Schatten	Bewusste Formensprache und Varianten
Produkt	Einzelbild	Ausgearbeitetes Einzelbild	Sprite, Sprite-Sheet oder Animation
Reflexion	Benenne Pixel, Raster und Motiv.	Begründe Form- und Farbentscheidungen.	Erkläre, wie Reduktion, Kontrast und Bewegung zusammenwirken.

Fachbegriffe auf einen Blick

Begriff	Bedeutung
Pixel	Einzelner Bildpunkt einer Rastergrafik
Raster	Anordnung von Bildpunkten in Zeilen und Spalten
Auflösung	Anzahl der Bildpunkte in Breite und Höhe eines Bildes
Palette	Ausgewählte Menge von Farben für ein Bild
Silhouette	Erkennbare Außenform eines Motivs
Sprite	Kleine Grafik für eine Figur oder ein Objekt, besonders in Spielen
Frame	Einzelbild einer Animation
Sprite-Sheet	Bilddatei mit mehreren Sprites oder Bewegungsphasen
Kontrast	Deutlicher Unterschied, zum Beispiel zwischen hell und dunkel

Interaktive Aufgaben

Quiz: Teste Dein Wissen

Was ist ein Pixel? (Ein einzelner Bildpunkt) (!Eine ganze Bilddatei) (!Ein Lautsprecher) (!Eine Tastenkombination)

Was beschreibt ein Raster? (Eine Anordnung aus Zeilen und Spalten) (!Eine Liste mit Musiktiteln) (!Eine Kameraeinstellung) (!Eine Bewegung im Sport)

Warum werden Formen in Pixel Art oft reduziert? (Damit ein Motiv mit wenigen Bildpunkten klar erkennbar bleibt) (!Damit immer möglichst viele Farben benutzt werden) (!Damit das Bild automatisch unscharf wird) (!Damit keine Entscheidung über Formen nötig ist)

Was ist eine Farbpalette? (Eine ausgewählte Menge von Farben) (!Die Größe des Bildschirms) (!Eine Sammlung von Tastaturbefehlen) (!Die Geschwindigkeit einer Animation)

Was ist eine Silhouette? (Die erkennbare Außenform eines Motivs) (!Der Name einer Bilddatei) (!Ein Ton in einem Computerspiel) (!Eine zufällige Pixelreihe)

Was ist ein Sprite? (Eine kleine Grafik für eine Figur oder ein Objekt) (!Ein gedrucktes Arbeitsblatt) (!Eine Tonspur) (!Ein Internetpasswort)

Was ist ein Frame in einer Animation? (Ein einzelnes Bild der Bewegungsfolge) (!Eine Farbmischung) (!Ein Dateiname) (!Ein Lautstärkeregler)

Welche Arbeitsweise passt gut zu einem ersten Pixelbild? (Mit wenigen Farben und einer klaren Form beginnen) (!Sofort möglichst viele Details zeichnen) (!Jeden Pixel zufällig färben) (!Das Raster vollständig ignorieren)

Warum ist Kontrast bei kleinen Pixelbildern hilfreich? (Er macht wichtige Formen besser unterscheidbar) (!Er vergrößert automatisch das Raster) (!Er ersetzt alle Farben durch Grau) (!Er löscht einzelne Frames)

Welches Vorhaben gehört besonders zum E-Niveau? (Eine kleine Sprite-Animation entwickeln) (!Nur den Begriff Pixel abschreiben) (!Ein Raster nicht benutzen) (!Alle Farben aus dem Bild entfernen)

Memory

Pixel	Bildpunkt
Raster	Zeilen und Spalten
Palette	Farbauswahl
Sprite	Spielgrafik
Frame	Einzelbild
Silhouette	Außenform
Kontrast	Helligkeitsunterschied
Animation	Bewegungsfolge

Drag and Drop

Ordne die richtigen Begriffe zu.	Thema
Bildpunkt	Pixel
Zeilen und Spalten	Raster
Außenform	Silhouette
Feste Farbauswahl	Palette
Einzelbild einer Bewegung	Frame
Figur oder Objekt im Spiel	Sprite

...

Kreuzworträtsel

Pixel	Wie heißt ein einzelner Bildpunkt?
Raster	Wie heißt die Anordnung aus Zeilen und Spalten?
Palette	Wie heißt eine festgelegte Auswahl von Farben?
Sprite	Wie nennt man eine kleine Grafik für eine Spielfigur oder ein Spielobjekt?
Kontrast	Wie heißt ein deutlicher Unterschied zwischen hell und dunkel?
Silhouette	Wie heißt die erkennbare Außenform eines Motivs?

LearningApps

Lückentext

Offene Aufgaben

Leicht – G-Niveau

Pixel-Suche: Vergrößere ein digitales Bild stark und beschreibe, ab wann Du einzelne Bildpunkte erkennst.
Rasterkopie: Übertrage ein einfaches 8 × 8-Pixelmotiv auf kariertes Papier und verwende höchstens vier Farben.
Silhouetten-Test: Gestalte einen Apfel, Fisch oder Roboter nur als einfarbige Außenform. Lass eine Mitschülerin oder einen Mitschüler das Motiv erraten.
Drei-Farben-Bild: Entwickle ein kleines Symbol mit genau drei Farben und erkläre, welche Farbe Grundfläche, Licht und Schatten übernimmt.

Standard – M-Niveau

Eigenes Icon: Entwirf in einem 16 × 16- oder 24 × 24-Raster ein eigenes Icon für ein erfundenes Spiel.
Kontrastvergleich: Gestalte dasselbe Motiv in zwei unterschiedlichen Farbpaletten und vergleiche, welche Version besser lesbar ist.
Spielobjekt: Entwickle ein Sprite für einen Schlüssel, Schatz, Gegner oder eine Spielfigur und beschreibe die wichtigsten reduzierten Formen.
Pixel-Analyse: Wähle ein frei lizenziertes Pixelbild aus Wikimedia Commons, untersuche Raster, Palette, Silhouette und Details und präsentiere Deine Ergebnisse.

Schwer – E-Niveau

Mini-Animation: Erstelle aus zwei bis vier Frames eine kurze Bewegung, zum Beispiel Blinzeln, Springen oder Leuchten.
Sprite-Sheet: Gestalte mehrere Zustände einer Figur in einer gemeinsamen Bilddatei und achte auf gleichbleibende Größe und Farbpalette.
Mini-Spielszene: Entwickle eine kleine Szene mit Hintergrund, Figur und mindestens zwei Gegenständen. Alle Elemente sollen dieselbe Pixelästhetik besitzen.
Design-Revision: Lass Dein Bild von zwei Personen testen. Sammle Rückmeldungen zur Erkennbarkeit und überarbeite anschließend mindestens drei Stellen begründet.

Lernkontrolle

Rasterwechsel: Ein Motiv ist in einem 32 × 32-Raster gut erkennbar. Erkläre, welche Entscheidungen Du treffen musst, wenn Du es auf 16 × 16 verkleinerst.
Form und Bedeutung: Vergleiche zwei Pixelbilder desselben Motivs mit unterschiedlich vielen Details. Begründe, welches Bild für ein kleines Spielsymbol geeigneter ist.
Farbentscheidung: Entwickle für eine Nacht-Szene eine kleine Farbpalette und begründe, wie Du Figur und Hintergrund deutlich unterscheidbar machst.
Bewegungsplanung: Plane eine Sprungbewegung mit drei Frames. Beschreibe, was sich von Frame zu Frame verändern muss und was gleich bleiben sollte.
Werkzeugwahl: Entscheide, ob Du für eine bestimmte Aufgabe kariertes Papier, Piskel, Pixilart oder Pixelorama verwenden würdest. Begründe Deine Wahl anhand der Aufgabe.
Pixelstil beurteilen: Erkläre, warum ein technisch höher aufgelöstes und glatteres Bild nicht automatisch die bessere Pixel Art sein muss.

Lernnachweis

Für Deinen Lernnachweis ist wichtig, dass Du nicht nur ein fertiges Bild zeigst, sondern Deinen Gestaltungsprozess erklären kannst.

Du kannst die Begriffe Pixel, Raster, Palette, Silhouette, Sprite und Frame korrekt verwenden.
Du kannst erklären, warum reduzierte Formen bei kleinen Rasterbildern wichtig sind.
Du kannst ein eigenes Pixelbild mit einer klaren Silhouette gestalten.
Du setzt Farben und Kontraste so ein, dass Dein Motiv gut lesbar bleibt.
Du kannst mindestens eine gestalterische Entscheidung begründen.
Du dokumentierst eine Überarbeitung Deines Bildes.
Auf M- oder E-Niveau kannst Du zusätzliche Details, Schatten, Sprites oder eine kleine Animation sinnvoll einsetzen.

OERs zum Thema

Wikimedia Commons: Art at pixel scale – freie Medienbeispiele zu Pixel Art
Wikimedia Commons: Pixel art icons – Sammlung kleiner Pixel-Icons
Piskel for Kids – browserbasierter Pixel- und Sprite-Editor
Pixilart Pixel Editor – interaktiver Online-Pixeleditor
Pixelorama – freier Pixel-Art-Editor mit Webversion

Verknüpfte Lernbereiche

Pixel-Art

aiMOOC-Projekte

Inhalte werden geladen ...

Mediathek wird aus dem Wiki geladen ...

Frag mich zum aktuellen Lerninhalt oder wähle eine kurze Hilfe.

Textmodus bereit

Sprache