Anzeige
Tutorialbeschreibung

Button: Glas-Buttons

Button: Glas-Buttons

Wir beginnen, indem wir mit [STRG]+[N] ein neues Bild der Standardgröße 640 * 480 px erstellen.

Dort ändern wir die Hintergrundfarbe auf ein neutrales Grau (zum Beispiel: #aaaaaa). Andere Hintergrunfarben, insbesondere Weiß, lenken nur von der eigentlichen Aufgabe ab, und können die menschliche Farbwahrnemung ein wenig aus dem Gleichgewicht bringen.

Als nächstes, aktivieren wir mit [U] das Rechteck-Werkzeug und zeichnen mit diesem einen rechteckigen Button in entsprechender Größe.
Natürlich können jegliche andere Formen verwendet werden, die auch mit einem Masken-Werkzeug erstellt sein können.
Der Vorteil von Vektormasken liegt aber klar auf der Hand: sie können in jede andere Form gebracht werden und vergrößert oder verkleinert werden ohne den geringsten Qualitäts-Verlust. Ich habe für dieses Tutorial das normale Rechteck und ein abgerundetes Rechteck verwendet.

Abbildung 1:
Bilder


Nun rufen wir mit einem [Doppelklick] auf das entsprechende Vorschaubild der Button-Ebene die Fülloptionen auf.

Nachfolgend nun die Einstellungen um den Glas-Effekt zu erzeugen. Die Einstellungen bei Abbildung 4 müssen nur dann vorgenommen werden, wenn ein etwas "rauchigeres" Erscheinungsbild erwünscht ist. (siehe dazu Abbildung 8, Beispiel 2).

Abbildung 2:
Bilder


Abbildung 3:
Bilder


Abbildung 4:
Bilder


Abbildung 5:
Bilder

Um den Stil des Verlaufs zu bearbeiten genügt ein [Doppelklick] auf den Verlauf.
Die nachfolgenden Farbwerte können natürlich nach Belieben geändert werden, wichtig ist nur die Helligkeits- und Positionsverteilung, wie sie hier zu erkennen ist.

Abbildung 6:

Bilder

Abbildung 7:

Bilder

Zum Schluß speichern wir den fertigen Stil nun nur noch mit einem Klick auf den Button "Neuer Stil..." ab und wenden ihn dann mit einem Klick auf "OK" auf unsere zuvor rrstellte Form an.

Und hier nun das fertige Ergebnis.
Beispiel 1 ist ohne "Schein nach innen", Beispiel 2 mit.

Abbildung 8:

Bilder


Kommentare
Achtung: Du kannst den Inhalt erst nach dem Login kommentieren.
Portrait von GonZoX
  • 04.02.2013 - 23:11

Nettes Basic, aber nicht wirklich ein realistischer Glas-Effekt.

Portrait von GermanRusher
  • 09.01.2013 - 13:41

Gesucht...Gefunden...Geschafft...
Danke für dieses schnelle unkomplizierte Tutorial, hat mir langes suchen erspart.

Portrait von Bioweapon
  • 01.09.2012 - 03:54

Tolles Tut ^^ Sehr einfach und sehr schnell^^

Portrait von doug_butabi
  • 07.05.2012 - 10:40

Sehr cool! Danke für die Hilfe!!!

Portrait von KoenischKoeln
  • 19.04.2012 - 15:06

In meinen Augen nicht sinnvoll da man keine Schrift unter den Glaseffekt tun kann, was aber schlichtweg dazu gehört.

Portrait von MrBug
  • 10.12.2011 - 20:53

Super Anleitung - Einfach und Klasse Ergebnis!
Danke :)

Portrait von fnaticc
  • 20.10.2011 - 23:14

tolle buttons :D und tutorial sehr sehr einfach.. xD

Portrait von xelax90
  • 28.09.2011 - 16:24

Super einfach und ziemlich cool :-)

Portrait von Chrombayer
  • 15.08.2011 - 14:12

Danke für die gute Beschreibung

Portrait von Maestro74
  • 18.07.2011 - 19:48

Endlich habe ich hier in diesem Forum einen tollen Beitrag zu diesem Thema gefunden. Lange habe ich nach einer Möglichkeit gesucht, solche Buttons zu entwerfen. Das es mit PS so einfach geht, hätte ich nicht gedacht. Dank der tollen Anleitung konnte ich schon einige Entwürfe fertig stellen. Macht weiter so. DANKE

Portrait von Kroete12
  • 05.01.2011 - 20:10

Super!
Toll erklärt und vor allem verständlich. Auch so kleine Dinge wie als Style speichern wurden nochmal hineingebracht!

Portrait von Sheryl82
  • 06.12.2010 - 10:45

Ich fand es richtig toll. Super Erklärung. Hat mir echt viel geholfen. Danke!!!

Portrait von hurrli
  • 19.11.2010 - 11:35

Super Tutorial! Hilft mir weiter. Besten Dank!

Portrait von Cebaoth
  • 05.11.2010 - 13:01

Mit Abstand das beste Glasbutton-Tutorial, dass ich bis jetzt gelesen habe!

Portrait von scarred13
  • 29.09.2010 - 12:12

Einfach, aber gut! Danke!

Portrait von fruechtchen79
  • 17.09.2010 - 12:44

sehr gut verständlich und leicht nachzubauen

Portrait von Sotho
  • 05.09.2010 - 16:42

ein wirklich hilfreiches Turorial - Danke!

Portrait von dim5252
  • 11.08.2010 - 10:36

Sehr gut erklärt, nach paar min. fertig :D THX

Portrait von derEve
  • 03.08.2010 - 21:25

Sehr nice! Vielen Dank

Alternative Portrait
-versteckt-(Autor hat Seite verlassen)
  • 29.07.2010 - 21:39

funktioniert super bei mir, danke!

x
×
×