Revision [1a6d03a]
Letzte Änderung am 2020-05-26 09:39:21 durch Oksana Neopagitova
ADDITIONS
![image](/uploads/Prog2V02/BMBF_Logo_klein.jpg?width=200)

## Photoshop-Basiswissen für Webseiten-Layout

_<span class="right">Inhalte von Prof. Dr. Klaus Chantelau</p>_

Rastergraphik / Vektorgraphik
Farben
Verläufe
Ebenen



#### PS Layout-Entwurf und Übertragung nach HTML /CSS

![PS Layout-Entwurf](/uploads/Prog2V02/Prog2_02_1.jpg)

>>* Rastergraphik / Vektorgraphik
>>* Farben
>>* Verläufe
>>* Ebenen
>>* Transparenzen und Bildmontagen in Ebenen
>>* Objekte freistellen



#### Rastergraphik / Vektorgraphik

**Rasterbilder**

![Rastergrafiken](/uploads/Prog2V02/Prog2_02_2.jpg)


**Vektorgrafiken**

![Vektorgrafiken](/uploads/Prog2V02/Prog2_02_3.jpg)

x(t) = x<sub>0</sub> + rcos2&#928;t
y(t) = y<sub>0</sub> + rsin2&#928;t
0 &#8804; t < 1

Parameter: x<sub>0</sub>, y<sub>0</sub>, r

![Vektorgrafiken Schema](/uploads/Prog2V02/Prog2_02_4.jpg)



#### Farben

**Additive Farbmischung**

![Additive Farbmischung](/uploads/Prog2V02/Prog2_02_5.jpg)

![Photoshop Werkzeuge](/uploads/Prog2V02/Prog2_02_6.jpg)

![Photoshop Farbwähler](/uploads/Prog2V02/Prog2_02_7.jpg)


**RGB-Farbraum**

![Additive Farbmischung im RBG-Farbraum1](/uploads/Prog2V02/Prog2_02_2.jpg)

![Additive Farbmischung im RBG-Farbraum1](/uploads/Prog2V02/Prog2_02_8.jpg)
![Additive Farbmischung im RBG-Farbraum2](/uploads/Prog2V02/Prog2_02_9.jpg)

![Additive Farbmischung im RBG-Farbraum3](/uploads/Prog2V02/Prog2_02_10.jpg)



#### Andere Farbräume

![Farbräume im PS Farbwähler](/uploads/Prog2V02/Prog2_02_11.jpg)



#### HSB-Farbraum

1. Drehung um R-Achse
2. Drehung um G-Achse

![HSB-Farbraum](/uploads/Prog2V02/Prog2_02_12.jpg)

3. V=I bis auf eine Skalierung/Normierung so dass Vmax=1 und Vmin=0
4. Projektion auf J-K Ebene
5. H= Winkel in J-K Ebene
6. S=Abstand vom Ursprung in J-K Ebene



#### Spektralfarbe und das HSB Modell

Spektralfarbe heißt S=100%
max. Hell:B = 100%

![Spektralfarbe und das HSB Modell](/uploads/Prog2V02/Prog2_02_13.jpg)

Spektralfarbe mit variierter Helligkeit (Brightness)
B=0% bis B=100%

![Spektralfarbe Brightness](/uploads/Prog2V02/Prog2_02_14.jpg)



#### Verläufe

**Auswahl-, Füll- und Verlaufswerkzeug**

![Auswahlwerkzeuge in Photoshop](/uploads/Prog2V02/Prog2_02_15.jpg)

![Verlaufswerkzeug in Photoshop](/uploads/Prog2V02/Prog2_02_16.jpg)



#### Ebenen

![Ebenen in Photoshop](/uploads/Prog2V02/Prog2_02_17.jpg)

![Neue Ebene in Photoshop](/uploads/Prog2V02/Prog2_02_18.jpg)



#### Transparenzen und Bildmontagen in Ebenen

<center>Transparanzen</center>
![Transparenzen in Photoshop](/uploads/Prog2V02/Prog2_02_19.jpg)


#### Bildmontage in Ebenen

![Bildmontage in Ebenen](/uploads/Prog2V02/Prog2_02_20.jpg)

![Bildmontage in Ebenen2](/uploads/Prog2V02/Prog2_02_21.jpg)
DELETIONS
![image](/uploads/Prog2V02/BMBF_Logo_klein.jpg?width=200)
# Photoshop-Basiswissen für Webseiten-Layout
##
_<span class="right">Inhalte von Prof. Dr. Klaus Chantelau</p>_
Rastergraphik / Vektorgraphik
Farben
Verläufe
Ebenen
#### PS Layout-Entwurf und Übertragung nach HTML /CSS
![PS Layout-Entwurf](/uploads/Prog2V02/Prog2_02_1.jpg)
>>* Rastergraphik / Vektorgraphik
>>* Farben
>>* Verläufe
>>* Ebenen
>>* Transparenzen und Bildmontagen in Ebenen
>>* Objekte freistellen
#### Rastergraphik / Vektorgraphik
**Rasterbilder**
![Rastergrafiken](/uploads/Prog2V02/Prog2_02_2.jpg)
**Vektorgrafiken**
![Vektorgrafiken](/uploads/Prog2V02/Prog2_02_3.jpg)
x(t) = x<sub>0</sub> + rcos2&#928;t
y(t) = y<sub>0</sub> + rsin2&#928;t
0 &#8804; t < 1
Parameter: x<sub>0</sub>, y<sub>0</sub>, r
![Vektorgrafiken Schema](/uploads/Prog2V02/Prog2_02_4.jpg)
#### Farben
**Additive Farbmischung**
![Additive Farbmischung](/uploads/Prog2V02/Prog2_02_5.jpg)
![Photoshop Werkzeuge](/uploads/Prog2V02/Prog2_02_6.jpg)
![Photoshop Farbwähler](/uploads/Prog2V02/Prog2_02_7.jpg)
**RGB-Farbraum**
![Additive Farbmischung im RBG-Farbraum1](/uploads/Prog2V02/Prog2_02_2.jpg)
![Additive Farbmischung im RBG-Farbraum1](/uploads/Prog2V02/Prog2_02_8.jpg)
![Additive Farbmischung im RBG-Farbraum2](/uploads/Prog2V02/Prog2_02_9.jpg)
![Additive Farbmischung im RBG-Farbraum3](/uploads/Prog2V02/Prog2_02_10.jpg)
#### Andere Farbräume
![Farbräume im PS Farbwähler](/uploads/Prog2V02/Prog2_02_11.jpg)
#### HSB-Farbraum
1. Drehung um R-Achse
2. Drehung um G-Achse
![HSB-Farbraum](/uploads/Prog2V02/Prog2_02_12.jpg)
3. V=I bis auf eine Skalierung/Normierung so dass Vmax=1 und Vmin=0
4. Projektion auf J-K Ebene
5. H= Winkel in J-K Ebene
6. S=Abstand vom Ursprung in J-K Ebene
#### Spektralfarbe und das HSB Modell
Spektralfarbe heißt S=100%
max. Hell:B = 100%
![Spektralfarbe und das HSB Modell](/uploads/Prog2V02/Prog2_02_13.jpg)
Spektralfarbe mit variierter Helligkeit (Brightness)
B=0% bis B=100%
![Spektralfarbe Brightness](/uploads/Prog2V02/Prog2_02_14.jpg)
#### Verläufe
**Auswahl-, Füll- und Verlaufswerkzeug**
![Auswahlwerkzeuge in Photoshop](/uploads/Prog2V02/Prog2_02_15.jpg)
![Verlaufswerkzeug in Photoshop](/uploads/Prog2V02/Prog2_02_16.jpg)
#### Ebenen
![Ebenen in Photoshop](/uploads/Prog2V02/Prog2_02_17.jpg)
![Neue Ebene in Photoshop](/uploads/Prog2V02/Prog2_02_18.jpg)
#### Transparenzen und Bildmontagen in Ebenen
<center>Transparanzen</center>
![Transparenzen in Photoshop](/uploads/Prog2V02/Prog2_02_19.jpg)
#### Bildmontage in Ebenen
![Bildmontage in Ebenen](/uploads/Prog2V02/Prog2_02_20.jpg)
![Bildmontage in Ebenen2](/uploads/Prog2V02/Prog2_02_21.jpg)
***
CategoryProgrammierung2
Revision [9620753]
Bearbeitet am 2017-08-22 13:00:48 von ClaudiaMichel
ADDITIONS
CategoryProgrammierung2
DELETIONS
CategoryDelete
Revision [5a77d0b]
Bearbeitet am 2016-09-27 12:48:13 von NicoleHennemann
ADDITIONS
CategoryDelete
DELETIONS
CategoryProg2
Revision [2276509]
Die älteste bekannte Version dieser Seite wurde von RonnyGertler am 2012-12-20 21:22:34 erstellt
ADDITIONS
![image](/uploads/Prog2V02/BMBF_Logo_klein.jpg?width=200)
# Photoshop-Basiswissen für Webseiten-Layout
##
_<span class="right">Inhalte von Prof. Dr. Klaus Chantelau</p>_
Rastergraphik / Vektorgraphik
Farben
Verläufe
Ebenen
#### PS Layout-Entwurf und Übertragung nach HTML /CSS
![PS Layout-Entwurf](/uploads/Prog2V02/Prog2_02_1.jpg)
>>* Rastergraphik / Vektorgraphik
>>* Farben
>>* Verläufe
>>* Ebenen
>>* Transparenzen und Bildmontagen in Ebenen
>>* Objekte freistellen
#### Rastergraphik / Vektorgraphik
**Rasterbilder**
![Rastergrafiken](/uploads/Prog2V02/Prog2_02_2.jpg)
**Vektorgrafiken**
![Vektorgrafiken](/uploads/Prog2V02/Prog2_02_3.jpg)
x(t) = x<sub>0</sub> + rcos2&#928;t
y(t) = y<sub>0</sub> + rsin2&#928;t
0 &#8804; t < 1
Parameter: x<sub>0</sub>, y<sub>0</sub>, r
![Vektorgrafiken Schema](/uploads/Prog2V02/Prog2_02_4.jpg)
#### Farben
**Additive Farbmischung**
![Additive Farbmischung](/uploads/Prog2V02/Prog2_02_5.jpg)
![Photoshop Werkzeuge](/uploads/Prog2V02/Prog2_02_6.jpg)
![Photoshop Farbwähler](/uploads/Prog2V02/Prog2_02_7.jpg)
**RGB-Farbraum**
![Additive Farbmischung im RBG-Farbraum1](/uploads/Prog2V02/Prog2_02_2.jpg)
![Additive Farbmischung im RBG-Farbraum1](/uploads/Prog2V02/Prog2_02_8.jpg)
![Additive Farbmischung im RBG-Farbraum2](/uploads/Prog2V02/Prog2_02_9.jpg)
![Additive Farbmischung im RBG-Farbraum3](/uploads/Prog2V02/Prog2_02_10.jpg)
#### Andere Farbräume
![Farbräume im PS Farbwähler](/uploads/Prog2V02/Prog2_02_11.jpg)
#### HSB-Farbraum
1. Drehung um R-Achse
2. Drehung um G-Achse
![HSB-Farbraum](/uploads/Prog2V02/Prog2_02_12.jpg)
3. V=I bis auf eine Skalierung/Normierung so dass Vmax=1 und Vmin=0
4. Projektion auf J-K Ebene
5. H= Winkel in J-K Ebene
6. S=Abstand vom Ursprung in J-K Ebene
#### Spektralfarbe und das HSB Modell
Spektralfarbe heißt S=100%
max. Hell:B = 100%
![Spektralfarbe und das HSB Modell](/uploads/Prog2V02/Prog2_02_13.jpg)
Spektralfarbe mit variierter Helligkeit (Brightness)
B=0% bis B=100%
![Spektralfarbe Brightness](/uploads/Prog2V02/Prog2_02_14.jpg)
#### Verläufe
**Auswahl-, Füll- und Verlaufswerkzeug**
![Auswahlwerkzeuge in Photoshop](/uploads/Prog2V02/Prog2_02_15.jpg)
![Verlaufswerkzeug in Photoshop](/uploads/Prog2V02/Prog2_02_16.jpg)
#### Ebenen
![Ebenen in Photoshop](/uploads/Prog2V02/Prog2_02_17.jpg)
![Neue Ebene in Photoshop](/uploads/Prog2V02/Prog2_02_18.jpg)
#### Transparenzen und Bildmontagen in Ebenen
<center>Transparanzen</center>
![Transparenzen in Photoshop](/uploads/Prog2V02/Prog2_02_19.jpg)
#### Bildmontage in Ebenen
![Bildmontage in Ebenen](/uploads/Prog2V02/Prog2_02_20.jpg)
![Bildmontage in Ebenen2](/uploads/Prog2V02/Prog2_02_21.jpg)
***
CategoryProg2