Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Grundlage Pixelgrafik

1.315 Aufrufe

Veröffentlicht am

Veröffentlicht in: Bildung
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Grundlage Pixelgrafik

  1. 2. Grafik-Typen Wird in dieser Präsentation NICHT behandelt! Besteht aus Bild-Punkten ( genannt: Pixel) Besteht aus Zeichenbefehlen ( z.B. Linie von Punkt X nach Y ) Pixel-Bild Vektor-Bild
  2. 3. Aufbau - Pixelgrafik <ul><li>Aus rechteckigen Bildpunkten (Pixel) </li></ul><ul><li>Jedes Pixel hat eine Farbe </li></ul><ul><li>Pixel haben KEINE feste Größe </li></ul><ul><li>Die Auflösung bestimmt die Pixel-Größe </li></ul>
  3. 4. Speicherverbrauch: Einflussfaktoren <ul><li>Grafikformat (unterschiedliche Komprimierungsverfahren) </li></ul><ul><li>Bildgröße (Höhe und Breite) </li></ul><ul><li>Auflösung (dpi ...) </li></ul><ul><li>Farbtiefe, Farbanzahl </li></ul><ul><li>Merke: </li></ul><ul><li>Hohe Qualität und Detail-Reichtum braucht viel Speicher! </li></ul><ul><li>Einen Mittelwert von Qualität und Speicherverbrauch anstreben! </li></ul>
  4. 5. Speicherverbrauch: 1. Grafik-Format <ul><li>JPG, JPEG </li></ul><ul><ul><li>Optimal für Fotos </li></ul></ul><ul><ul><li>Verlustbehaftet komprimiert </li></ul></ul><ul><li>PNG </li></ul><ul><ul><li>Optimal für Grafik mit Text </li></ul></ul><ul><ul><li>KEIN Patentschutz, Standart im WWW </li></ul></ul><ul><ul><li>Verlustfrei komprimiert </li></ul></ul><ul><li>GIF </li></ul><ul><ul><li>Optimal für Grafik mit Text </li></ul></ul><ul><ul><li>Patentgeschützt </li></ul></ul><ul><ul><li>Verlustfrei komprimiert </li></ul></ul><ul><li>TIFF </li></ul><ul><ul><li>Optimal zum Datenaustausch </li></ul></ul><ul><ul><li>Unkomprimiert und komprimiert </li></ul></ul>
  5. 6. Speicherverbrauch: 2. Bildgröße <ul><li>Wenn Höhe und Breite vergrößert werden: </li></ul><ul><li>Passen mehr Pixel in die Grafik (trotz gleicher Auflösung) </li></ul><ul><li>Dadurch sind meist mehr Farben notwendig (da jedem Pixel eine Farbe zugeordnet ist) </li></ul><ul><li>Merke : </li></ul><ul><ul><li>Kleine Bilder verbrauchen weniger Speicher </li></ul></ul><ul><ul><li>Große Bilder verbrauchen mehr Speicher </li></ul></ul>
  6. 7. <ul><li>Die Auflösung klärt folgende Frage: </li></ul><ul><li>Wie viel Pixel passen auf die Länge X ? </li></ul><ul><li>Einheit: meist DPI ( D ot P er I nch = Pixel/Zoll) </li></ul><ul><li>Formel: </li></ul><ul><li>Merke: </li></ul><ul><ul><li>Hohe Auflösung </li></ul></ul><ul><ul><li>Viele Pixel/cm (viele, kleine Pixel) </li></ul></ul><ul><ul><li>Hoher Speicherverbrauch </li></ul></ul>Speicherverbrauch: 3. Auflösung 1Zoll ~ 2,54cm Auflösung = Pixel-Anzahl 1 Zoll Pixel-Breite Breite der Grafik
  7. 8. Speicherverbrauch: Bildgröße - Auflösung <ul><li>Maße und Auflösung sind voneinander abhängig: </li></ul><ul><li>1x1Zoll-Bild enthält bei 72dpi 5184 Pixel (72 Pixel x 72 Pixel = 5184) </li></ul><ul><li>gleiches Bild bei 150 dpi  22500 Pixel (150 Pixel x 150 Pixel = 22500) </li></ul><ul><li>Auflösung ändern  die Darstellungsgröße wird verändert </li></ul><ul><li>Um die Größe zu erhalten, ist die Pixelanzahl anzupassen! </li></ul><ul><li>denn: </li></ul><ul><li> Ein Bild mit höherer Auflösung hat kleinere Pixel. </li></ul><ul><li> Wenn die Auflösung erhöht wird, müssen Pixel hinzugerechnet werden! </li></ul><ul><li>ABER: </li></ul><ul><li>Die Bildqualität wird kaum verbessert. Je nach Güte das Algorithmus!. </li></ul>
  8. 9. Speicherverbrauch: 4. Farben - Farbtiefe - <ul><li>Schwarz-Weiß </li></ul><ul><ul><li>1 Bit pro Farbe (1 - schwarz, 0 - weiß) </li></ul></ul><ul><li>Graustufen </li></ul><ul><ul><li>8 Bit pro Farbe (für 256 Helligkeitsstufen) </li></ul></ul><ul><li>Indizierte Farben </li></ul><ul><ul><li>8 Bit pro Farbe (für 256 Farben) </li></ul></ul><ul><li>RGB </li></ul><ul><ul><li>24 Bit pro Farbe 8 Bit * 3 (gemischt aus R ed: 0-255, G reen: 0-255, B lue: 0-255) </li></ul></ul><ul><li>CMYK </li></ul><ul><ul><li>32 Bit pro Farbe 8 Bit * 4 (gemischt aus C yan: 0-255, M agenta: 0-255, Y ellow: 0-255 , Bac k : 0-255) </li></ul></ul>Variation der Farbmodi für einen Farb-Verlauf
  9. 10. Speicherverbrauch: 4. Farben - Anzahl - <ul><li>Anzahl der Farben minimieren </li></ul><ul><li>In Grafikformaten wie PNG und GIF möglich </li></ul><ul><li>Merke bei Grafiken mit Text: </li></ul><ul><li>RGB oder CMYK -Farben in </li></ul><ul><li>Indizierte Farben umwandeln </li></ul><ul><li>Anzahl der verwendeten Farben sinnvoll beschränken </li></ul>
  10. 11. Fragen zur Pixelgrafik <ul><li>Warum ist das so kompliziert … Grafik als Schachbrett aus Rechtecken, die keine feste Größe haben? </li></ul><ul><li>Pixelgrafiken sollen durch viele Medien darstellbar sein ( z.B. Scanner, Monitor, Beamer, Drucker … ) </li></ul><ul><li>Jedes Medium funktioniert anders: </li></ul><ul><ul><li>Der Flachbrett-Scanner beleuchtet zeilenweise, misst die Reflektion und zerlegt diese dann in Pixel </li></ul></ul><ul><ul><li>Einen Röhren-Monitor gibt es z.B. mit Streifenmaske (statt quadratische Pixel) und nur 72 dpi Auflösung </li></ul></ul><ul><ul><li>Ein Tintenstrahl-Drucker sprüht Streifen aus runden Punkten </li></ul></ul><ul><li>Jedes Gerät hat eine eigene „Auflösung“ </li></ul>
  11. 12. Fragen zur Pixelgrafik <ul><li>Wie viel Speicher verbraucht ein JPG-Foto, wenn die Datei 500 KB groß ist ? </li></ul><ul><li>500 KB </li></ul><ul><li>Leider Falsch!! </li></ul><ul><li>Das Format ist wie GIF, PNG usw. KOMPRIMIERT </li></ul><ul><li>Dadurch ist der reale Speicherverbrauch viel höher! </li></ul><ul><li>Vergleich: </li></ul><ul><li>Bei einem ZIP -Paket kann man die Größe nach dem Entpacken auch nicht voraussagen! </li></ul><ul><li>Das hängt von der Komprimierbarkeit der Daten ab. </li></ul>
  12. 13. Fragen zur Pixelgrafik <ul><li>An welchen „Schrauben kann ich drehen“, wenn mein Bild wenig Speicher verbrauchen soll? </li></ul><ul><li>Das passende Grafik-Format wählen (JPG oder PNG oder TIFF oder …) </li></ul><ul><li>Höhe und Breite verringern </li></ul><ul><li>Die Auflösung verringern </li></ul><ul><li>Die Anzahl der Farbinformationen begrenzen </li></ul>
  13. 14. Fragen zur Pixelgrafik <ul><li>Wie groß ist die Breite und Höhe einer Grafik, wenn diese am Bildschirm (in voller Größe) betrachtet werden soll? </li></ul><ul><li>Heute stellen 4/3-Monitore min. 1024 x 768 Pixel dar (z.B. 15‘‘ TFT-Monitor) </li></ul><ul><li>Eine Grafik mit einer Breite von 1024 Pixel und einer Höhe von 768 Pixel füllt die meisten Bildschirme aus </li></ul><ul><li>Gilt nur wenn: </li></ul><ul><ul><li>Die Auflösung der Grafik der Monitorauflösung entspricht </li></ul></ul><ul><ul><li>Beträgt meist 96 dpi </li></ul></ul>
  14. 15. Fragen zur Pixelgrafik <ul><li>Wie groß sollte die Auflösung einer Grafik für einen Powerpoint-Vortrag sein? </li></ul><ul><li>Wenn er mit Bildschirm / Beamer gehalten wird: ~ 96 dpi </li></ul><ul><li>Wenn es Folien zum Drucken für einen Overhead-Projektor werden sollen: ~ 200 dpi </li></ul>

×