Dieses Photoshop Tutorial zeigt, wie es "verhältnismäßig" einfach zu erstellen ist Blickfang Ikonen für Web 2.0-Stil mit Reflexionen und so weiter, einfach, indem Sie die Auswirkungen auf die Schicht. Wenn Sie verstehen den Prozess, ist es auch möglich - freien Lauf zu lassen Ihrer Kreativität - zu viele Variationen zu erstellen.
STEP 1 - FORM ICON
Wir schaffen eine Ebene und zeichnen Sie ein Rechteck
(Oder quadratisch) mit leicht abgerundeten Ecken.

Wenden Sie diese Schicht folgende Auswirkungen:

Wie habe ich einen inneren Schatten Farbe # ffd800

Die Steigung geht aus # 067500 bis # 0cff00
Wir haben fast unser Symbol! Die Rotfärbung, dass Sie es mögen! Wichtig war, eine Abstufung von dunkel bis klar.

SCHRITT 2 - REFLECTION
Fügen Sie eine neue Ebene oberhalb dieser cha wir gerade gemacht haben. Wählen Sie die Form des Symbols (Ctrl + Klick auf Schicht) und - wenn sie sich im neuen leeren Ebene - wählen Sie aus dem Menü Select-> Modify-> Contract: Geben Sie 2 Pixel:


Stellen Sie die Vordergrundfarbe auf Weiß
und wählen Sie das Verlauf-Werkzeug
, Going von weiß bis transparent. Dann einen Farbverlauf von oben nach unten, um zu erhalten:

Nun, den letzten Schliff, wählen Sie eine kreisförmige Selektion
, Wählen einer Ellipse und platzieren Sie es, wie unten dargestellt, und drücken Sie die Entf-Taste - wenn man Sie hier die Transparenz zu 90/80 setzen möchten:



STEP 3 - Text und Symbole
Mit einer der vielen Bibliotheken kostenlose Fonts Sie ein graphisches Symbol, ein Symbol in kurzer hinzufügen können. Wenn dieser Entwurf ist, in meinem Fall, indem die Wirkung:

Otteremo ein schöner Effekt, um zurückzukehren:


Das einzige, was fehlt ... den Text Ihrer Wahl!










X Nun das Tutorial gemacht, ist Web 2.0 macht die Standards, die Webmaster kaum vergessen können ...
Ich habe versucht, auf der Netzwerk-Graphen in einer Schrift ähnlich wie die Schaltflächen, die Sie genutzt werden, aber ich habe nicht gefunden, könnten Sie mir sagen, was es oder dort genannt, es zu finden? Dank
@ Mark: Danke Mark! Sie können einige Bitmap-Schriften, diese Adresse zu finden: http://www.orgdot.com/aliasfonts/
Photoshop Tutorial: Web 2.0 Stil-Ikonen in 3 Schritten | Undolog.com ...
Tutorial um Icons mit Photoshop 2.0-Stil zu schaffen ....
hei .. aber du hast vergessen, uns mitzuteilen, wie unter dem Schatten verblassen!
.. Sie wissen .. 99 .. Sie haben dies bereits getan ist 100
mythischen kleinen Knopf .. aber es wäre ein Schatten cunt eh nehmen eh! ^. ^
@ Dapdudida:
Um vergib mir, ich machte einen kleinen Screencast, obwohl es kam kein Ton! Gehe hier zum Nachdenken Techniken 
Sie haben Recht
Es gibt zwei Techniken: mit der Maske auf die Ebene (das erste Beispiel) und die allgemeine Verwendung von Masken! Ich bevorzuge die erste
Große Tutorial! Ich war für eine lange Zeit suchen, thanks a lot! Ihr Blog zu meinen Favoriten, nur
@ Artemisia: Danke!
Hallo, herzlichen Glückwunsch für die tuotorial Ich war sehr nützlich, aber die kleinen Icons, wo Sie gefunden?
Ich habe versucht der Suche auf der Website, die Sie in den Kommentaren Absätzen geschrieben, aber ich fand nichts.
@ Bauernhof Latium: die Symbole sind eigentlich eine Schriftart Diagramm. Hier finden Sie viele kostenlose Schriftarten, Zeichen anstelle der normalen Symbole verschiedener Art enthalten. Suche auf Google "Dingbatfont"
Das Jungs nach diesem Schritt .. Ich weiß, es ist Scheiße, aber ich bin on tilt "Add eine neue Ebene über der von Ihnen gerade erstellt haben. Wählen Sie die Form (Strg + Klick auf Ebene) und weiterhin auf die neue leere Ebene "kann mir jemand bitte erklären, wie man ein Kind von 2 Jahren waren?
@ Marco: Sie haben in der Praxis zu tun ist, die gleiche Form des Knopfes auf der Vakuum-Schicht neu, aber etwas kleiner. So wählen Sie den Inhalt einer Ebene können Sie mit Strg + Klick. Auf diese Weise werden Sie die Auswahl um der Form der Taste. Wählen Sie dann die leere Ebene, so dass die Auswahl getroffen zuvor auf dieser Ebene handeln wird.
Das Problem ist, dass wenn ich gesetzt bekommen "Gradient Overlay" und dann alles mit der Schicht der Farbe des Gradienten ist überdacht und ermöglicht es mir, die quadratische Form zu sehen, dass ich auf den Knopf zuerst. Zweitens wieder am Anfang, ich schaffe das Niveau, aber die Platzgestaltung im Schatten draußen und drinnen ich eingreifen müssen unbedingt duplizieren Sie die Ebene. Und "richtig?
Wir danken Ihnen für Ihre hervorragende Anleitung! Seit ich sah meine Kreationen kann nur besser!
@ Mathias: Vielen Dank! Für alle Informationen zögern Sie nicht, mich per E-Mail
Kannst du erklären, wie Sie ein Video-Tutorial mit sichtbaren Fenster Pop-Up-Stil bearbeitet haben?
Kurz gesagt, bin ich um die Wirkung auf das Video verweist, wo visisibile ein Lernprogramm zum Erstellen von Web 2.0 Stil-Ikonen empfehlen
@ Giuseppe Serra:
Ich habe die Javascript-Bibliothek ShodowBox , dass Sie Popup-Fenster mit verschiedenen Inhalten öffnen können: Bilder, Flash-Filme oder QuickTime, HTML-Seiten und vieles mehr.
einfach und praktisch ... wie Ich mag es:)
Hallo, wenn ich auf die macshera der Schicht verschwindet anzuwenden versuchen und den zweiten Platz auf der Ebenenmaske ist weiß und nicht schwarz wie im Film, warum?
@ Stephen: Sie müssen bei gedrückter ALT-Taste, wenn Sie die Maske anwenden
Excellent guide, danke!
Ich vermisse nur eine Sache ... Die Passage, in der Sie beim Einlegen der Ellipse: Das kann ich nicht geben, dass Auswirkungen auf das Symbol.
Ich kann nicht verstehen diesem Schritt:
Vielen Dank im Voraus
Digit @ WM: Dies ist ein einfacher Schritt. Die Gradientenschicht geschnitten wird, vorzugsweise mit einer Kreisform. Was Sie tun müssen, ist folgen der dargestellten Figuren, um die Wirkung ähnlich wie vorgeschlagen, aber Sie können auch für verschiedene Werte für verschiedene Effekte. Auf Ebene "Glanz", was zu schneiden, verwenden Sie eine kreisförmige Auswahl um den Bereich abgrenzen zu löschen und drücken Sie die "DELETE" abzuschneiden unten.
Darüber hinaus können Sie die Deckkraft der Ebene auf 90% bzw. 80% auf die verwendeten Farben basieren gesenkt werden.
Ich hoffe, dass Ihre Frage beantwortet.