Web2.0 Button

Post Pic
στις 17.03.09. Kατηγορίες Photoshop με Ένα Σχόλιο

Σε αυτό το βοήθημα θα δούμε αναλυτικά πως μπορούμε να δημιουργήσουμε εύκολα ένα web2.0 button σε 5 μόνο βήματα, χρησιμοποιόντας το Adobe Photoshop. Σε αργότερο βοήθημα θα δούμε πως μπορούμε να μετατρέψουμε το κουμπί αυτό σε πλήρως λειτουργικό σε μια ιστοσελίδα

Βήμα 1

Δημιουργουμε ένα νεό αρχείο εικόνας απο το File>New

img11

Βήμα 2

Διαλέγουμε το Rounded Rectancular Tool (U). Στο Radius βάζουμε 15px. Διαλέγουμε το χρώμα που θέλουμε να έχει το σχήμα που θα φτιάξουμε. Δημιουργούμε το σχήμα που θέλουμε.

img21

img3

img4

Βήμα 3

Κρατόντας το CTRL πατημένο επιλέγουμε το σχήμα που δημιουργήσαμε απο τα layers. Αυτό επιλέγει μόνο το σχήμα μας. Έχοντας την επιλογή μας ενεργή δημιουργούμε ένα νέο layer. Πάμε στο Select>Modify>Contract και επιλέγουμε 2px.  Επιλέγουμε το Gradient Tool και διαλέγουμε ένα πιο ανοιχτό χρώμα απο αυτό που έχει το αρχικό μας σχήμα. Μετά κρατώντας το Shift πατημένο ξεκινάμε το gradient απο την κορυφή της επιλογής εώς το τέλος της. Αυτό μας φτιάχνει ένα νεό layer με highlight.

img5

img6

img7

img8

Βήμα 4

Επιλέγουμε το αρχικό μας σχήμα και πάμε στο Layer>Layer Style>Drop Shadow και βάζουμε τις ρυθμίσεις όπως στην είκονα.

img9

Βήμα 5

Επιλέγουμε το Horizontal Type Tool και κάνοντας κλίκ στην εικόνα μας γράφουμε το κείμενο που θέλουμε. Κάνουμε duplicate το κείμενο που γράψαμε κάνοντας δεξί κλίκ στο layer του κειμένου και επιλέγοντας Duplicate Layer. Κάνουμε διπλό κλικ στο νέο layer και πάμε στις ρυθμίσεις χρώματος του κειμένου. Επιλέγουμε ένα πιο ανοιχτό χρώμα απο αυτό του προηγούμενου κειμένου. Βάζουμε το layer απο κάτω απο το παλιό και επιλέγουμε το παλιό. Επιλέγουμε το Move Tool και πατάμε μια φορά το δεξί βελάκι στο πληκτρολόγιο και μία το πάνω. Αυτό δίνει μια αίσθηση βάθους στα γράμματα.

img10

img111

Tags:

Pantso { Προσωπική Ιστοσελίδα / Άρθρα Στο GreekTuts }
Ο Παναγιώτης έχει σπουδάσει προγραμματιστής και προγραμματιστής Video Games ενώ τώρα κάνει το Bachelor του σε Computer Science από το Πανεπιστήμιο του Roehampton στο Λονδίνο. Έχει εργαστεί στο Darkfall Online , το πρώτο ελληνικό MMORPG, ως World Builder, είναι BlackBoard Support Certified , ενώ σήμερα εργάζεται ώς HTML Author στην Atcom SA.

Ένα Σχόλιο στο άρθρο Web2.0 Button

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>