Pixel 101
Pixel 101, CC-BY 4.0, derschnabel
Was ist ein Pixel?
• Digitale Bilder, aka Pixelgrafik, bestehen aus einem Raster, der mit Pixel gefüllt ist
• Pixel, oder Bildpunkte (dot) sind die kleinsten darstellbaren Elemente auf elektronischen Bildverarbeitungsgeräten
• die genaue Größe eines Pixels ist abhängig von der Auflösung
http://www.janaszek.de/cg/cg_pixel.html
Was ist Auflösung?
• Anzahl von Pixel pro Inch (Zoll)
• wird in dpi (dots per inch) angegeben (1 Inch entspricht ungefähr 2,54 cm)
• Eine Auflösung von bspw. 200 dpi bedeutet, dass auf einer Strecke von einem Inch 200 Pixel dargestellt werden.
Faustregel:
hohe Auflösung = detailreiches Bild = große Datei
Was ist Auflösung?
geringe Auflösung (z.B. 100 dpi)
Das Bild ist aufgrund der niedrigen Auflösung und der damit niedrigen Bildinformationen kaum noch zu erkennen.
hohe Auflösung (z.B. 400 dpi)
Das Bild ist relativ feinkörnig wiedergegeben.
mittlere Auflösung (z.B. 200 dpi)
Die geringere Auflösung lässt das Bild schon wenig detailgetreu erscheinen.
Unterschiede der Ausgabegeräte
= Geräte, die Bilder wiedergeben können
• Diese Geräte arbeiten mit
unterschiedlichen Auflösungen:
• Monitore: 72 dpi
• Drucker: 200 – 300 dpi
Unterschiede der Ausgabegeräte
• Gleiche Bildgröße (tatsächlichen Pixel), jedoch unterschiedliche Auflösung
http://www.janaszek.de/cg/cg_pixel.html
96 dpi, Bildschirm
300 dpi, Drucker
Bildgröße & Auflösung
TippSoll das Bild ausgedruckt werden, achtet man daher am besten schon zu Anfang auf die Bildgröße und überlegt, wie groß das Bild im Ausdruck werden soll.
Pixelgröße: reale Größe
Druckgröße: Maße des Ausdrucks
Auflösung: Anzahl der pixel/inch
Bildgröße & Auflösung anpassen
Wie man sehen kann, wird durch eine Veränderung der Auflösung (z.B.
von 96 auf 300 dpi) nur die Größe der beim Ausdruck bedruckten Fläche beeinflusst - die oberen Werte bleiben jedoch
gleich. Die Bildgröße als solche bleibt also erhalten.
http://www.janaszek.de/cg/cg_pixel.html
Skalieren
ist das Verkleinern oder Vergrößern eines Bildes
• Verkleinerung eher unproblematisch
• Problematisch hingegen Vergrößerungen
▶ unvermeidbare Verschlechterung der Bildqualität
Skalieren
TippWeil das Vergrößern nicht verlustfrei erfolgt, sollte man am besten zu Beginn das Bild möglichst groß anlegen oder - bei geplanter Weiterverarbeitung von Bildmaterial - möglichst großformatige Grafiken wählen.
5-fache Vergrößerung des Bildausschnitts
► Erkennbares “Pixeln”
http://www.janaszek.de/cg/cg_pixel.html
Unterschiedliche Farbmodelle
RGB-Modell
• additivesFarbmodell
RGB steht für die 3 Grundfarben Rot, Grünund Blau. Weitere Farben werden durch das Mischen dieser drei Farblichter erzeugt, wobei alle drei zusammen Weiß ergeben. Dieses Modell wird von licht- emittierenden Geräten verwendet (Bildschirm, Beamer,…). Eine bestimmte Farbe wird in RGB mit drei Zahlen zwischen 0 und 255 angegeben (R: 0, G: 0, B:0) -> Monitore
CMYK-Modell
• subtraktivesFarbmodell
CMYK stehtdie licht-absorbierenden Farben Cyan(Türkis), Magenta (Purpur), Yellow(Gelb) und Key(Schwarz). Das Mischen dieser vier unterschiedlich transparenten Substrate bewirkt eine veränderte Lichtremission und in Folge eine neue Farbe. Eine bestimmte Farbe wird in CMYK mit vier Zahlen zwischen 0 und 100 angegeben (C=0, M=0, Y=0, K=0) -> Drucker
http://dawnsbrain.com/the-cmyk-color-wheel/
http://www.informatikzentrale.de/rgb-farbmodell.html
Unterschiedliche Farbmodelle
• Die RGB- und CMYK-Werte der Primär- und Sekundärfarben
RGB-Modell CMYK-Modell
Steckbrief Dateiformate
• Pixelorientierte Dateiformate
*.JPG *.GIF *.PNG *.BMP *.TIF
TippBessere Grafikprogramme haben meist eigene Dateiformate, wie bspw. das XCF-Format in GIMP.
oder PSD in Photoshop. Steht ein solches zur Verfügung, sollte man möglichst dieses wählen, weil nur so alle programmeigenen
Features mitgespeichert werden.
Noch ein Tipp
Es reicht nicht aus, nur die Datei mit der typischen Endung eines
Grafikformats zu benennen, sondern man muss das Grafikformat auch
ausdrücklich beim Speichern wählen - die für das Format typische Endung wird dann oft von selbst vergeben.
Steckbrief Dateiformate
JPEG (Joint Photographic Experts Group) für Rastergrafiken
• wird eingesetzt zum Speichern komprimierter Bilder wie Fotografien – vor allem im Internet (je kleiner die Dateigröße desto schneller lädt die Seite)
GIF (Graphics Interchange Format)
für Rastergrafiken (nicht geeignet für Fotografien mit vielen Farbabstufungen)
• wird eingesetzt für Animationen auf Websites oder flächige Farben, Schrift und Graustufenbilder
PNG (Portable Network Graphics) für Rastergrafiken
• wird eingesetzt bei Web- und Infografiken die mit Transparenz arbeiten
• PNG vereint die Vorteile von GIF und JPEG
BMP (Bitmap) für Rastergrafiken
• wird eingesetzt um Verluste durch Komprimierung zu verhindern
• große Dateigröße, nicht geeignet zur Einbettung
