Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Bildbearbeitung

ein Überblick über Raster- und Vektorgrafiken, über Grundbegriffe der Bildbearbeitung und über Grafikformate
by

H Hildebrand

on 3 November 2013

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Bildbearbeitung

Bildbearbeitung
Bildbearbeitung
Set them free
Go your own road
Eric Johansson
Eric Johansson
Fishy island
Eric Johansson
Grafik-Arten
Begriffe
Grafik-Formate
Arten
Formate
Grafik-Arten
Grafik-Arten
V
V e k t o r g r a f i k
R a s t e r g r a f i k
V
besteht aus geometrischen Formen:
Kreise, Ellipsen
Dreiecke, Vierecke
Linien, Kurven
...
mit bestimmten Eigenschaften:
Position
Größe
Farbe
...
Kreis
7-Eck
besteht aus einzelnen Bildpunkten (Pixel), die in einem Raster angeordnet sind

jeder Bildpunkt hat seinen Farbwert
54 kByte
V
Speicherbedarf
V e k t o r g r a f i k
1.080 kByte
Speicherbedarf
R a s t e r g r a f i k
vs.
benötigt i.A. relativ wenig Speicherplatz

nur die Eigenschaften der Objekte müssen gespeichert werden
Speicherbedarf wird durch die Anzahl der Objekte bestimmt
die Größe des Bildes hat
keine Bedeutung
Einsatz & Verbreitung
V e k t o r g r a f i k
Einsatz & Verbreitung
R a s t e r g r a f i k
vs.
komplexer Aufbau und aufwändige Handhabung
Vorkenntnisse und Einarbeitung erforderlich

Grafiken müssen "konstruiert" werden
für die Ausgabe auf Monitor und Drucker müssen Rastergrafiken erzeugt werden

Softwareunterstüzung eher gering

Verwendung vorwiegend in technischen Bereichen
einfacher Aufbau und intuitive Handhabung
wenig Vorkenntnisse erforderlich

Kameras und Scanner liefern Rasterbilder
auch Ausgabe auf Monitor und Drucker ist prinzipiell pixelorientiert

sehr gute Unterstützung durch Software

Fotos haben großen Stellenwert
Skalierung
V
V e k t o r g r a f i k
Skalierung
R a s t e r g r a f i k
vs.
kann beliebig vergrößert bzw.
verkleinert werden
die Qualität leidet darunter nicht

die Formen werden bei der Skalierung
originalgetreu neu berechnet
HH
Speicher-bedarf
Einsatz
Details & Natürlichkeit
V e k t o r g r a f i k
R a s t e r g r a f i k
vs.
Feine bzw. diffuse Details können nicht dargestellt werden.
Für realistische Eindrücke nicht geeignet.

Verwendung bei einfachen Formen mit wenig
Farbverläufen:
Logos, Cliparts, Diagramme, Schrift, technische Zeichnungen, CAD, ...
Details
Skalierung
Details & Natürlichkeit
Speicherbedarf
Details
V
benötigt viel Speicherplatz

jeder einzelne Bildpunkt muss gespeichert werden
Speicherbedarf wird durch die Größe des Bildes bestimmt
Beispiel Kreis:
Mittelpunkt (x|y) - 2 x 2 Byte
Radius r - 1 x 2 Byte
2 Farben [R|G|B] - 2 x 3 Byte
12 Byte
Beispiel Kreis:
50 x 50 = 2500 Farbwerte [R|G|B]

2500 x 3 Byte - 7500 Byte
kann zwar vergrößert bzw.
verkleinert werden
jedoch leidet die Qualität recht stark darunter

die Formen können i. A. nicht originalgetreu
berechnet werden
7500
Byte
Einsatz
Feine bzw. difuse Details können gut dargestellt werden.
Für realistische Eindrücke geeignet.

Verwendung bei natürlichen Bildern mit
Farbverläufen:
Fotos, Bilder mit Licht- und Schatteneffekten, 3D-Szenen, ...
Fazit
V
V e k t o r g r a f i k
Fazit
R a s t e r g r a f i k
Beide Grafik-Arten haben ihre Stärken und Schwächen.
Für Rastergrafiken spricht die große Verbreitung und einfache Handhabung.
Vektorgrafiken überzeugen in speziellen Bereichen wegen ihrer Skalierbarkeit.

Vektor, ich find'
dich voll gut,
ehhh...
Du bist auch
nicht übel...
Fazit
Ich bin jetzt
mal ein Raster!
Begriffe der
Bildbearbeitung
Abmessungen
eines Bildes
Die Größe eines Bildes wird in Pixel angegeben.
Begriffe der
Bildbearbeitung
Begriffe
2 Farben (1 bit)
16 Farben (4 bit)
256 Farben (8 bit = 1 Byte)
16,7 Mio. Farben (24 bit = 3 Byte)
Solche Angaben werden manchmal fälschlicherweise mit der "Auflösung" in Verbindung gebracht.
Ein Bild der Größe
"40 x 20"
ist 40 Pixel breit
und 20 Pixel hoch.
Farbtiefe
Die Farbtiefe gibt die Anzahl der im Bild verwendbaren Farben an.
Sie bestimmt die Farbtreue des Bildes.
82
185
241
52
B9
F1
0,3 mm
255

0

255

magenta
0

255

255

cyan
Grundfarben
Hexadezimale Angaben

0

0

0

->

schwarz

128

128

128

->

grau
255

255

255

->
weiß
Farbaddition
255

255

0



gelb
RGB-Farben
Alle Farben lassen sich zusammensetzen
aus den Grundfarben
Rot
,
Grün
und
Blau
.
Die Intensität dieser Farbanteile kann Werte
von 0 bis 255 (bzw. 00 bis FF) annehmen.
Damit ergeben sich
256·256·256 = 16,7 Mio. Farben.
Auflösung
Die Auflösung gibt die Pixeldichte bei der Ausgabe des Bildes in "Dots per Inch" (dpi) an.
Sie bestimmt die Detailtreue des Bildes.
10 dpi bedeutet, dass 10 Pixel pro Inch
(pro Zoll bzw. pro 2,54 cm)
ausgegeben werden.
Auflösung: bis zu 300 dpi
Tablet/Handy
Ein Bild (
1200 x 900
) hat bei einer Auflösung von
300 dpi
eine Größe von:
4 Zoll x 3 Zoll
bzw.
10,2 cm x 7,6 cm
Auflösung: ca. 100 dpi
Monitor
Ein Bild (
1200 x 900
) hat bei einer Auflösung von
100 dpi
eine Größe von:
12 Zoll x 9 Zoll
bzw.
30,5 cm x 22,9 cm
Auflösung: 300 - 1200 dp
i
Drucker
Ein Bild (
1200 x 900
) hat bei einer Auflösung von
600 dpi
eine Größe von:
2 Zoll x 1,5 Zoll
bzw.
5,1 cm x 3,8 cm
Soll ein Foto im Format
9 x 13 cm
bei
600 dpi
originalgetreu ausgedruckt werden, dann muss das Bild eine Abmessung von
3071 x 2126 Pixel
(6,5 MegaPixel) haben.
Bedeutung der Auflösung beim Druck
png
bmp
bmp - Bitmap
bmp - Bitmap
B i l d b e a r b e i t u n g
Popart.bmp
600 x 600 - 16,7 Mio. - 1.080 kByte
Grafik-Formate
Grafik-Formate
Es gibt viele verschiedene Grafikformate.

Sehr häufig verwendete sind:
*.bmp / *.gif / *.jpg / *.png

Sie erfüllen verschiedene Anforderungen:
geringerer Speicherbedarf
angemessene Qualität
Transparenz
Animationen
u.v.a.m.

gif -
gif -
Transparenz
Popart.gif
600 x 600 - 256 - 56 kByte
Graphics Interchange
Format
Graphics Interchange
Format
jpg -
jpg -
Popart.jpg
600 x 600 - 16,7 Mio. - 35 kByte
Joint Photographic
Experts Group

Joint Photographic
Experts Group
Transparenz
Popart.png
600 x 600 - 16,7 Mio. - 447 kByte
Portable Network
Graphics
Portable Network
Graphics
png -
png -
Grundlagen:
Bereiche gleicher Farbe werden zusammen- gefasst gespeichert.

Farbtiefe:
2 bis 256

Kompression:
relativ hoch

Qualität:
bis 256 Farben keine Verluste, sonst Farbverfälschungen

Besonderheiten:
Transparenz möglich
Animationen möglich

Grundlagen:
Blockweise werden Farbunterschiede untersucht und Farbinformationen "herausgerechnet".

Farbtiefe:
16,7 Mio.

Kompression:
hoch
(je nach Einstellung)

Qualität:
Verluste treten auf
(je nach Kompression)

Besonderheiten:
Grad der Kompression
einstellbar

Grundlagen:
Jeder Bildpunkt wird mit seinem Farbwert gespeichert.

Farbtiefe:
2 bis 16,7 Mio .

Kompression:
keine
sehr hoher
Speicherbedarf

Qualität:
hoch
keine Verluste

Besonderheiten:
keine


Grundlagen:
Bereiche gleicher Farbe werden zusammen- gefasst gespeichert.

Farbtiefe:
2 bis 16,7 Mio.

Kompression:
hoch
(je nach Farbtiefe)

Qualität:
keine Verluste
(trotz Kompression)

Besonderheiten:
Transparenz möglich

Fazit
Fazit
*.bmp
Qualität
Datei-
größe
*.png
Qualität
Datei-
größe
*.jpg
Qualität
Datei-
größe
*.gif
Wähle das Grafikformat entsprechend:
der Bildeigenschaften
der Art der Verwendung.
Wie heißt dieser "flächige", etwas farblose
Kerl, der unbedingt ins Internet will ?
v e r l u s t f r e i
v e r l u s t b e h a f t e t
gif
Fazit
jpg
Auf einen Blick...
Auf einen Blick...
gif
jpg
png
Fast alle Bilder, die etwas verkaufen, sind manipuliert:
Titelblätter
Mode-Berichte
Werbeanzeigen
CD-Cover
usw.
Du wirst sehen, wie "einfach" es ist, das Aussehen von jemanden zu verändern.
Bilder
Kommerz
&
Bilder
Kommerz
Sei dir bewusst, dass Bilder nicht immer die Realität zeigen.

Sei kritisch und vergleiche dich nicht mit "etwas", das durch 20-stündiges Retuschieren entstanden ist.
Bilder
Kommerz
&
Bilder
Kommerz
Hier wurde bei der Schönheitsoperation etwas übertrieben und zu viele Haut- unebenheiten entfernt.

Bilder
Medien
&
Bilder
Medien
gab es so gar nicht.

Irgendjemand hat ihm zwar den Kopf verdreht, aber ob es Prinzessin Diana war, bleibt offen.

"Das Bild, das alle suchten" ...

Bilder
Medien
&
Bilder
Medien
Dabei war es nur eine Wasserlache.

Durch eine Farbmanipulation sollte die Aussage des Artikel verstärkt werden.
So viel Blut... ?

Bilder
Medien
&
Bilder
Medien
Ja, aber so wie es gezeigt wurde, war es nicht.
Durch Fotomontage wurde die gewünschte Wirkung erzielt.
Zerstörte Städte... ?
Fliehende Menschen... ?
Bilder
Medien
&
Bilder
Medien
Allein schon der gewählte Bild-ausschnitt kann die Aussage eines Bildes verändern.
Was sagt
dieses Bild ?
Und was
jenes ?
Was sagt dir
dieses Bild ?
Bilder
Medien
&
Bilder
Medien
Es ist eine Montage dieser beider Bilder.
So entstand eine etwas (?) andere Wirkung des Bildes.
Ist das Bild "echt" ?
Oder stimmt hier etwas nicht?
Zwei identische
Bildauschnitte... ?
Bilder
Propaganda
&
Bilder
Propaganda
Im unteren Bild wurden Personen entfernt. Darunter war Leo Trotzky - ein Rivale Stalins.
Manchmal ist die Qualität der Fälschung sogar besser.
Welches Bild ist "echt" ?
Bilder
Propaganda
&
Bilder
Propaganda
Auch bei den Nazis verschwanden Personen aus Bildern. Hier traf es Propagandaminister Goebbels selbst - warum, ist nicht geklärt.
Welches Bild ist "echt" ?
Am besten
nennst du mich
'Gif'.
Was ist denn hier passiert ?

Bilder
Medien
&
Bilder
Medien
Das schlechte Foto sollte zeigen, was der Redakteur sehen wollte.

" Bild' dir seine
Meinung !" ;-)
Handschuh
Was ist falsch auf diesem Foto der Bild-Zeitung ?
Seil
Bilder
Medien
&
Bilder
Medien
Es wurde nicht nur der Hintergrund entfernt, eine Kairoer Zeitung ließ auch Mubarak die Gruppe anführen.
Man sieht, das Bild wurde bearbeitet. Erkennst du alle Veränderungen?
Ein Bild sagt mehr als 1000 Worte...
lügt
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
Ein Bild lügt mehr als 1000 Worte...
B i l d b e a r b e i t u n g
Bilder
das Image
&
Bilder
das Image
Die teure Rolex passte wohl nicht zu jedem Zeitpunkt bzw. Anlaß zum Image des Siemens Chefs.
Ob das mit dem geplanten Stellen-abbau zu tun hatte?
Findest du den Unterschied?
Ein Bild lügt mehr als 1000 Worte...
Siemens Chef
Klaus Kleinfeld
zur Hauptversammlung
am 27. Januar 2005
im Sommer 2004
veröffentlicht
Bilder
das Image
&
Bilder
das Image
Die US-Website zeigt in der Mitte eine andere Person, die wohl nicht so recht zum europäischen Image von Microsoft passte.
Welche Person ist hier falsch?
Ein Bild lügt mehr als 1000 Worte...
Bild auf der polnischen Website von Microsoft
Bilder
die Wahrheit
&
Bilder
die Wahrheit
Ein objektives Bild gibt es kaum.

Sei kritisch und hinterfrage - wie bei Texten - die Aussage des Bildes.
Ein Bild lügt mehr als 1000 Worte...
Bildmanipulationen
http://www.20min.ch/wissen/history/story/10367405#showid=30157&index=1
Pannen bei der Bildbearbeitung
http://www.20min.ch/life/story/19356389#showid=22945&index=0
Bilder lassen sich verändern...
so dass sie etwas betonen ...
Viel Spaß dabei ...
und Danke für die Aufmerksamkeit
so dass sie einem schmeicheln ...
so dass sie uns belügen ...
so dass sie etwas vortäuschen ...
so dass sie uns begeistern ...
Moral
Full transcript