Computergrundlagen Graphikbearbeitung – Inkscape und GIMPicp/mediawiki/images/e/e9/WS... · t.de...

http

://w

ww

.icp.

uni-s

tuttg

art.d

e

ComputergrundlagenGraphikbearbeitung – Inkscape und GIMP

Axel Arnold und Olaf Lenz

Institut für ComputerphysikUniversität Stuttgart

Wintersemester 2010/11

http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Was ist ein digitales Bild?

• Bilder selber am Computer gestalten• Bilder am Computer bearbeiten (z.B. von einer Kamera)

Wie speichert ein Computer Bilder?

A. Arnold, O. Lenz Computergrundlagen 2/18

http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Graphikformate

Graphikformate

Rastergraphik (Bitmaps)

verlustfrei

BMP, TIFF,PNG, GIF, ...

verlustbehaftet

JPEG

Vektorgraphik

SVG, PDF,(Enhanced)Postscript,...

3D-Modelle

VRML,POVRAY,DXF, ...


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Unterschiede zwischen Vektor- und Rastergraphik

Vektorgraphik• Objekte (Kreis, Polygon,...)• beliebig vergrößerbar• geringer Platzbedarf bei

geometrischen Objekten• großer Speicherbedarf bei

Rasterdaten (Photos)• Für Skizzen, Graphen, ...

Rastergraphik• Matrix von Farbinformationen• begrenzte Auflösung• Speicherbedarf hängt nicht von

der Komplexität ab• optimierte Speicherverfahren

für Photos (JPEG)• Für Photos, Icons, Logos, ...


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Wozu verlustbehaftete Formate?

PDF, 1.1 KByte PNG, 3.1 KByte JPEG, 1.3 KByte

• Verlustbehaftete Formate sparen Platz• Artefakte an scharfen Übergängen, fallen nur in Photos nicht auf• 2 Megapixel-Photo: als PNG ca. 3 MByte, als JPEG 300 KByte

JPEG nur für Photos!Immer Vektorformate bevorzugen!


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Kommandozeilentools – convert (Image Magick)

• Kommandozeilentool zur Graphikbearbeitung• Nützlich vor allem zum schnellen Konvertieren

Beispiele

• PNG in JPEG konvertieren:convert beispiel.png beispiel.jpg

• Qualität in Prozent einstellen(hier das schlechte Beispiel von der vorigen Folie):convert beispiel.png −quality 10 beispiel.jpeg

• Vergrößern oder verkleinernconvert beispiel.png −resize 10% beispiel.pdf

• Einen kleinen Film aus Einzelbildern erstellenconvert beispiel∗.png beispiel.mpg


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Inkscape

• Freier Editor für Vektorgraphik,Alternative zu CorelDraw, AdobeIllustrator, ...

• http://www.inkscape.org

• Für Linux, Windows, Mac OS X• Natives Format SVG

• XML-basiert• Die meisten Webbrowser können

SVG darstellen


http://www.inkscape.org

http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Inkscape – Leinwand

• Hier werden Objekte platziert• Bewegen per Maus oder durch

Ctrl-Cursortasten• + und - zum Zoomen• Nur was auf der Leinwand liegt,

ist später sichtbar• Unter „File→Document Properties“

läßt sich• die Größe der Leinwand einstellen• ein Gitter (Grid) zum Ausrichten der

Elemente anlegen

• Objekte rasten an anderenObjekten oder am Grid ein


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Inkscape – Werkzeuge

• Auswahlwerkzeug (F1): 1xklicken markiert Objekt zumVerändern der Größe und Position

• 2x Klicken zum Drehen• Knotenwerkzeug (F2): zum

Verschieben vonObjektecken/-punkten

• Rechteck (F4)• Ellipsen (F5)• (Bezier-) Kurven (Shift-F6)• Text (F8)


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Inkscape – Objekteigenschaften

• Objektfarbe setzen (Rand,Fläche mit Shift)

• Aktuelle Füll- undStricheinstellungen

• Status und Benutzungshinweise• Aktuelle Koordinate und Zoom


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

Inkscape – Menüs

• File• Laden/Speichern (SVG, PDF, ...)• Import (auch Bitmaps)• Properties: Größe, Grid

• Edit• Clone: Kopien, die immer wie das

Original aussehen• Mehrfachklone auf Gitter

• Object• Group: Objekte zusammenfassen• Raise/Lower: Objektstapelung

• Path – erzeugen komplexerFormen durch Mengenoperationen

• Filters und Extensions – jedeMenge Effekte


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

GIMP

• Freier Editor für Bitmapgraphik, vergleichbar Adobe Photoshop• Für Linux, Windows, Mac OS X• Rasterbildbearbeitung und -erstellung• http://www.gimp.org


http://www.gimp.org

http

://w

ww

.icp.

uni-s

tuttg

art.d

e

GIMP – Werkzeuge

• Auswahlwerkzeuge:Rechtecke, Ellipsen, Lasso,intelligente Schere

• Verschieben und Verzerren• Textwerkzeug• Füllen der Auswahl• Radiergummi• Zeichenwerkzeuge• Stempelwerkzeuge• Farbwahl Vorder-/Hintergrund• Werkzeugoptionen


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

GIMP – Auswahl

• wird über Werkzeuge erstellt (Kreise, Rechtecke, Lasso,...)• ist unscharf – Punkte können anteilsweise dazugehören• Shift fügt zur Auswahl zu,

Ctrl zieht ab,Shift-Ctrl bildet Schnittmenge

• Menüpunkt „Select“: Weichzeichnen, Ausweiten, ...


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

GIMP – Farb- und Pinseldialoge

• Verschiedene Farbauswahlpaletten, HSV, CMYK (Druckstufe)• Farben können gespeichert werden• Verschiedene, teilweise semitransparente Pinsel• Über die Werkzeugoptionen zu erreichen, wo verwendet


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

GIMP – Ebenen• Ebenen

• Wie ein Stapel von übereinander- liegenden Folienbzw. Papierbögen

• Ermöglichen Arrangieren von Elementen undseparate Anwendung von Effekten

• Verschieben und Drehen usw. wie Auswahl• Ebenendialog über Ctrl-L oder Menü

„Windows→Dockable Dialogs“• Transparente Ebenen brauchen Alpha-Kanal

(„Layer→Transparency→Add Alpha Channel“)• Vereinigen von fertigen Ebenen über

„Layer→Merge Down“• Augensymbol: Sichtbarkeit der Ebene

Kette: gekettete Ebenen zusammen bewegen


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

GIMP – Effekte

Blur – Unschärfe Bumpmapping – 3D-Effekt

Colorize – Einfärben Edge detect – Randerkennung

Viele Effekte unter „Tools“ und „Filters“!


http

://w

ww

.icp.

uni-s

tuttg

art.d

e

FroheWeihnachten

und einen guten Rutschins neue Jahr!


Computergrundlagen Graphikbearbeitung – Inkscape und GIMPicp/mediawiki/images/e/e9/WS... · t.de...

Documents

Transcript of Computergrundlagen Graphikbearbeitung – Inkscape und GIMPicp/mediawiki/images/e/e9/WS... · t.de...