Workshop
Grundlagen Photoshop
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Erste Schritte
Gestaltung von Text
Ausgabeformate
Fotonachbearbeitung
Agenda
A
C
D
E
B
Photoshop
Arbeiten mit Ebenen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
Erste Schritte
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
B
C
D
A
E
Erste Schritte
Print(Plakate, Anzeigen in
Zeitschriften, Flyer etc.)
Print(Plakate, Anzeigen in
Zeitschriften, Flyer etc.)
Web(Grafiken für PP-
Präsentationen, Webseiten etc.)
Web(Grafiken für PP-
Präsentationen, Webseiten etc.)
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
B
C
D
A
E
Erste Schritte
PrintPrint WebWeb
300 dpi 72 dpi
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
B
C
D
A
E
Die Auflösung eines Bildes
• die Auflösung eines Bildes bezieht sich auf dieAnzahl der Bildpunkte (Pixel) pro Fläche.
• dpi = dots per inch (Punkte pro Zoll)
Erste Schritte
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
B
C
D
A
E
Erste Schritte
PrintPrint WebWeb
CMYK RGB
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
B
C
D
A
E
Erste Schritte
CyanMagentaYellow
Key
CyanMagentaYellow
Key
RedGreenBlue
RedGreenBlue
RGBCMYK
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
B
C
D
A
E
Der Farbmodus eines Bildes
• Farbmodus für Bilder, die für die ausgedruckte Darstellung ausgelegt sind: CMYK.
• Farbmodus für Bilder, die für die digitale Darstellung (am Bildschirm/Beamer) ausgelegt sind: RGB.
Photoshop
Erste Schritte
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
B
C
D
A
E
Übung
Erstellen eines Web-Banners für die MuK-Halloween-Party
1. Lege eine Datei im Format 728 x 90 Pixel mit 72 dpi an.
2. Öffne das Bild „Kürbis.jpg“ (liegt auf dem Server).
Photoshop
Erste Schritte
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
B
C
D
A
E
3. Öffne die imb-Website (www.imb-uni-augsburg.de); gehe auf die Unterseite Studium MuK-Studium
4. Erstelle einen Screenshot des Browserfensters mittels Alt+Druck und füge ihn in eine neue Photoshop-Datei ein.
Photoshop
Erste Schritte
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
Fotonachbearbeitung
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Folgende Arbeitschritte sollen an „Kürbis.jpg“ durchgeführt werden:
• Foto um 90 Grad drehen
• Foto verkleinern
• Helligkeit / Kontrast verbessern
• Kerzenflammen entfernen
• Bildausschnitt wählen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Foto um 90 Grad drehen:
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Foto verkleinern:
Höhe ca. 250 Pixel
Proportionen erhalten
Bild neu berechnen mit „bikubisch schärfer“
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Helligkeit / Kontrast verbessern:
Helligkeit: 20 Prozent verringern
Kontrast:20 Prozent erhöhen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Kerzenflammen entfernen
Auswahl des „Kopierstempel-Werkzeugs“ ( ) in der Werkzeugleiste
Alt-Taste gedrückt halten und auf Referenz-Stelle klicken
Geeignete Werkzeuggröße einstellen
Maustaste gedrückt halten und über die auszubessernde Stelle ziehen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Bildausschnitt wählen:
Auswahl des „Freistellungswerkzeugs“ ( ) in der Werkzeugleiste
Höhe 90 Pixel
Ausschnitt wählen mit der „Enter“-Taste bestätigen.
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Folgende Arbeitsschritte sollen am Screenshot der imb-Website durchgeführt werden:
• MuK-Logo ausschneiden
• Hintergrund entfernen
• Größe ändern (Transformieren)
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
MuK-Logo ausschneiden
Auswahl des „Freistellungswerkzeugs“ ( ) in der Werkzeugleiste
Einen ungefähren Rahmen um das MuK-Logo aufziehen
Mit der Enter-Taste bestätigen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Hintergrund entfernen
Die Ebene „Hintergrund“ löschen
Auswahl des „Zauberstabs“ ( ) in der Werkzeugleiste
In den weißen Bereich außerhalb des MuK-Logos klicken.
Die Entf bzw. Del Taste drücken, um den markierten Bereich zu löschen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Größe ändern (Transformieren)
Tastenkombination Strg+T betätigen
Um das Objekt erscheint ein Rahmen mit Ziehpunkten, worüber die Größe geändert werden kann.
Durch gleichzeitiges Drücken der Strg-Taste werden die Proportionen beibehalten.
Mit der Enter-Taste bestätigen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Fotonachbearbeitung
B
C
D
A
E
Photoshop
Zwischenergebnis:
+
+
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
Arbeiten mit Ebenen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
D
A
E
Photoshop
Ebenen – Was ist das?
• Elemente können auf eine eigene Ebene gelegt werden leichter zu bearbeiten
• Vergleichbar mit verschiedenen, übereinander gelegten Overhead-Folien
B
C
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
D
A
E
Photoshop
Ebenenfenster öffnen:
Fenster EbenenB
C
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
D
A
E
Photoshop
Das Ebenenfenster
B
C Ebenenname
Neue Ebene
Ebene löschen
Ebene ein-/ausblenden
DeckkraftEbene fixieren„Füllmethode“
Effekte
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
D
A
E
Photoshop
Neue Ebene einfügen: „Ebene“ „Neu“ „Ebene…“
B
C
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
B
C
D
A
E
Photoshop
Folgende Arbeitschritte sollen nun durchgeführt werden:
• Ebene mit der Farbe „schwarz“ füllen
• Datei „kürbis.jpg“ in die neue Datei ziehen
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
D
A
E
Photoshop
„Kürbis.jpg“ und das MuK-Logo in leere Ebene einfügen:
B
CVerschieben-Werkzeug
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
D
A
E
Photoshop
Ebene mit Farbe füllen:
B
C
Füllwerkzeug
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Arbeiten mit Ebenen
D
A
E
Photoshop
Zwischenergebnis:
B
C
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
Gestaltung von Text und Grafik
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
D
A
E
Photoshop
Text einfügen:
B
C
Textwerkzeug
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
D
A
E
Photoshop
Text bearbeiten:
B
C
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
D
A
E
Photoshop
Text bearbeiten:
B
C
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
B
C
D
A
E
Photoshop
Folgende Arbeitschritte sollen nun durchgeführt werden:
• Text „Halloween – Party │ 31.10.09 in der Mensa“ einfügen
• „Halloween – Party“ in hellgrün
• „|“ in weiß
• „31.10.09 in der Mensa“ in orange
• Schrift: Calibri; Schriftgröße: 26
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
B
C
D
A
E
Photoshop
Zwischenergebnis:
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
B
C
D
A
E
Photoshop
Effekte auf das MuK-Logo anwenden
Ebene mit dem MuK-Logo auswählen
Im Ebenen-Fenster auf „Ebeneneffekte hinzufügen“ ( ) klicken
„Schein nach außen“ auswählen
Deckkraft 75%, Überfüllen 10%, Größe 15 px, Farbe: hellgrün
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
B
C
D
A
E
Photoshop
Fertig!
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Gestaltung von Text und Grafik
B
C
D
A
E
Photoshop
Animation!
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
Ausgabeformate
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
Formate im ÜberblickFormate im Überblick
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
Photoshop DocumentPhotoshop Document
Dateierweiterung: *.psd
Das „Arbeitsformat“ von Photoshop
Speichert alle verwendeten Bilddaten, Ebenen, Schriften, etc.
Verlustfreies Format (keine Komprimierung) große Dateien
Nicht für die Veröffentlichung (z.B. im Internet) bestimmt
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
JPEG File Interchange Format (JPEG)JPEG File Interchange Format (JPEG)
Dateierweiterung: *.jpg (seltener: *.jpeg)
Weit verbreitet für Fotos (Standardformat von Digitalkameras)
Bietet die Kompression (verlustbehaftet) der Bilder an
Oft genutzt im Internet
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
Graphics Interchange Format (GIF)Graphics Interchange Format (GIF)
Dateierweiterung: *.gif
Hauptanwendungsbereich im Internet
Bietet transparenten Hintergrund
Einfache Animationen (Animiertes GIF) möglich
Max. 256 Farben kleine Dateigröße
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
Tagged Image File Format (TIFF)Tagged Image File Format (TIFF)
Dateierweiterung: *.tif oder *.tiff
Relativ vielseitig
Ermöglicht mehrere Bilder in einer Datei
Unterstützt CMYK-Farbraum
Einsatz in Druckereien
Im Web: Verwendung bei hochauflösenden Pressephotos
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
Portable Document Format (PDF)Portable Document Format (PDF)
Dateierweiterung: *.pdf
Integration von Text, Grafiken und Fotos
Dokumentschutz möglich
Identische Ausgabe
Offener Standard (ISO)
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
Wie speichern wir unser Dokument?Wie speichern wir unser Dokument?
Worst Case:
GIF:
JPG:
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Ausgabeformate
B
C
D
A
E
Photoshop
Wie speichern wir unser Dokument?Wie speichern wir unser Dokument?
Höchste Qualität:
GIF:
JPG:
14kB
40kB
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
Photoshop
… und wie geht es weiter?
Bitzer | El Tahwy | Klötzer | Kuhn | Meyer | Meyer | Möller | Regler | Specht | Studniberg
… und wie geht es weiter?
B
C
D
A
E
Photoshop
Ich will zu Hause weiter üben und ausprobieren! Testversion herunterladen: www.adobe.com/de/downloads/
Ich brauche Photoshop – aber nur hin und wieder! Auf den Rechnern in den WiWi-CIP-Pools ist Photoshop installiert
Ich will zum Photoshop-Pro werden! Studenten-Version kaufen (ca. 199,- €) z.B. bei www.cobra-shop.de
Workshop
Vielen Dank fürEure Aufmerksamkeit
Top Related