<Αναζήτηση> Αρχική / Όλα , BUTTON , ICON , Tutorial / Blog άρθρο: RIATMP1157-Πώς να κάνει κουμπί και τα εικονίδια

| Mobile | RSS

RIATMP1157-Πώς να κάνει κουμπί και τα εικονίδια

27 του Σεπτεμβρίου, 2009
How to make button and icon tutorial

Πολύ απλό αλλά ελκυστικό κουμπί και φροντιστήριο εικονίδιο δημιουργώντας για σχεδόν όλους με ελάχιστη ή σχεδόν καθόλου εμπειρία Photoshop. Σκοπός αυτού του tutorial δεν δείχνουν ακριβώς το τέχνασμα και την τεχνική της δημιουργίας ενός κουμπιού, αλλά και σας ενθαρρύνει να είναι δημιουργική και ευφάνταστη να κάνουν τα δικά σας κουμπιά στο μέλλον.


Ένα από τα σημαντικά μυστικό σε κάθε δημιουργική εργασία είναι η δυνατότητα να δείτε το αποτέλεσμα πολύ πριν να έχουν ξεκινήσει την εφαρμογή. Υπάρχουν πολλές προσέγγιση για την επίτευξή του, για μένα ο καλύτερος τρόπος είναι κοντά τα μάτια μου και να προσπαθήσουμε να δούμε τι πρόκειται να δημιουργήσουν. Μόλις έχω κάτι ενδιαφέρον προσπαθήστε να πάρετε ένα στιγμιότυπο στη μνήμη μου, πριν ανοίξω τα μάτια μου και αμέσως θα βασιστεί σε ένα χαρτί πριν το ξεχάσω. Είναι μια άσκηση που μπορείτε να κάνετε και να κάνει τακτικά θα αυξήσει την ικανότητά σας να δείτε πιο καθαρά.

Αφήνει να πει αυτό είναι αυτό που έχω δει, όταν έκλεισα τα μάτια μου, τώρα πώς μπορώ να το εκτελέσει, στο Photoshop;


Icon exercise draw on paper
Icon άσκηση αντλήσει από χαρτί
Για να δημιουργήσετε αυτό στο Photoshop βήματα είναι τα εξής, θα προσπαθήσω να γίνει απλό:

Βήμα 1: Ανοίξτε ένα νέο αρχείο στο Photoshop και να δώσει το όνομα, όπως button_tutorial.psd, πλάτος: 300, ύψος: 250, αφήστε τα πάντα ως προεπιλογή.


Create new photoshop file
Δημιουργία νέου αρχείου Photoshop

Βήμα 2: Μπορείτε να κρατήσετε ως φόντο άσπρο ή να χρησιμοποιήσετε κάποια εξομάλυνση υφή, αν προτιμάτε, απλά δημιούργησε γρήγορα κάποια υφή χρησιμοποιώντας βιβλιοθήκη υφή.

Create texture in Photoshop
Δημιουργία υφή στο photoshop

Βήμα 3: Προσθέστε ένα νέο στρώμα και να δώσει ένα όνομα, τη δημιουργία στρογγυλεμένες πλατεία γωνία επιλογή κουτί (135px X135px) και να κάνουν την ακτίνα της γωνίας για να 20px. Υπάρχουν πολλοί τρόποι για να δημιουργήσετε στρογγυλεμένο τετράγωνο κουτί, ένα από ένας απλός τρόπος είναι: να σχεδιάσετε ένα τετράγωνο κουτί πρώτο και επιλέξτε «Select -> Modify -> Ομαλή" από το επάνω μενού και επιλέξτε 20px ακτίνα.

create rounded corner square box
δημιουργούν στρογγυλεμένες κουτί πλατεία γωνία
Η οθόνη σας θα μοιάζει με αυτό:


rounded corner square box in photoshop
στρογγυλεμένες κουτί πλατεία γωνία στο photoshop
Βήμα 4: Για να συμπληρώσετε αυτόν τον τομέα με την επιλογή χρώματος ντεγκραντέ, κάντε κλικ στο (1) εικονίδιο κλίση στο εικονίδιο του πίνακα και επιλέξτε το (2) επιλογή χρώματος ντεγκραντέ από την κορυφή και να πάρει τρεις έγχρωμες όπως φαίνεται στην εικόνα. [# 80a2be, # 013871, # 31b7dd],


gradient color in photoshop
χρώματος ντεγκραντέ στο Photoshop
Τελική εικόνα σας πρέπει να είναι κάπως έτσι.


Gradient color in photoshop
Χρώματος ντεγκραντέ στο Photoshop

Βήμα 5: Τώρα ο χρόνος του να εξερευνήσει κάποιο αποτέλεσμα,
Κάντε κλικ στο "Προσθήκη στυλ επιπέδου" εικονίδιο στο κάτω μέρος του παραθύρου στρώμα σας, και στο παράθυρο του στυλ επιπέδου ελέγχου του πλαισίου ελέγχου "Προσπίπτουσα σκιά" μόνο. Ακολουθήστε την εικόνα παρακάτω δείγμα.

Add a layer style Drop Shadow
Προσθέστε ένα στυλ επιπέδου προσπίπτουσα σκιά

Βήμα 6: Τώρα κουτί »Outer Glow" Έλεγχος. Να, όπως φαίνεται στην παρακάτω εικόνα.


Add a layer style Outer glow
Προσθέστε ένα στυλ επιπέδου Εξωτερική λάμψη

Βήμα 7: "Εσωτερική λάμψη" πλαίσιο δίπλα Έλεγχος. Να, όπως φαίνεται στην παρακάτω εικόνα.


Add a layer style Inner glow
Προσθέστε ένα στυλ επιπέδου εσωτερική λάμψη

Και εδώ είναι η τελική επίδραση στο στυλ σας.


Add a new layer effect in photoshop
Προσθέστε μια νέα εφέ επιπέδου στο photoshop

Βήμα 8: Προσθέστε ένα νέο στρώμα και επιλέξτε «Stroke» από το μενού "Επεξεργασία" στην κορυφή και να δώσει το πράσινο χρώμα, 6px στο εσωτερικό των συνόρων. Ακολουθήστε την εικόνα του δείγματος.


Use stroke to create border from edit menu.
Χρησιμοποιήστε το εγκεφαλικό επεισόδιο για τη δημιουργία των συνόρων από το μενού επεξεργασίας.

Βήμα 9: Τώρα έχετε μια εικόνα σαν αυτή. Αλλαγή του στυλ από την κορυφή του πίνακα στρώμα για να «οθόνη» θα δίνουν διάφανο αποτέλεσμα.


Use stock to create border from edit menu.
Χρησιμοποιήστε το υλικό για τη δημιουργία των συνόρων από το μενού επεξεργασίας.

Βήμα 10: Προσθήκη νέων στρώμα και σχεδιάσετε ένα στρογγυλεμένο ορθογώνιο κουτί όπως φαίνεται στην παρακάτω εικόνα. Είναι ίδια όπως «Βήμα 3» περιγράφω πριν.

Draw a rounded rectangle box
Σχεδιάστε ένα στρογγυλεμένο ορθογώνιο κουτί

Βήμα 11: "Προσθήκη μάσκας επιπέδου" Επιλέξτε από κάτω γραμμή εικονιδίων στο παράθυρο Layer, και «εικονίδιο Gradient" επιλέξτε από το παράθυρο «Εργαλεία». Τώρα κάντε κλικ και σύρετε το ποντίκι σας για το στρογγυλεμένο ορθογώνιο κουτί για να εφαρμόζονται από πάνω προς τα κάτω και θα δείτε παρόμοιο αποτέλεσμα σαν αυτό.


Add layer mask and Gradient icon for lighting effect
Προσθήκη μάσκας επιπέδου και εικονίδιο Gradient για εφέ φωτισμού

Βήμα 12: Τώρα προσθέστε άλλο ένα στρώμα και να σχεδιάσετε έναν κύκλο, όπως στην παρακάτω εικόνα και την αλλαγή του «Opecity» από τον πίνακα στρώμα σε περίπου 50%.


Opecity  to use highlight effect
Opecity να χρησιμοποιήσετε επίδραση επισημάνετε

Βήμα 13: Τώρα πλέον καιρός να θέσουμε ένα εικονίδιο που θέλετε να τοποθετήσετε ή μπορείτε να χρησιμοποιήσετε οποιαδήποτε υπάρχουσα εικόνα από τη συλλογή σας. Εφιστώ απλώς μια κάμερα γρήγορα.


Draw camera in photoshop
Ισοπαλία κάμερα στο Photoshop



Μπορείτε να προσθέσετε περισσότερα εφέ φωτισμού, αν προτιμάτε, αλλά είναι εντελώς μέχρι σας.


Lighting effect on button
εφέ φωτισμού στο κουμπί

Αφού έχετε έτοιμο το κουμπί, ο χρόνος του να δημιουργήσετε όσες θέλετε μέσα σε μόλις λίγα λεπτά. Έχω τώρα, Ήχος παιχνιδιού, Ακούστε, συσκευή ήχου, Equalizer, DVD, CD, μικρόφωνο, Εγγραφή, βίντεο, Tape, έλεγχος έντασης ήχου και κάμερα.


Sound play, Listen, Audio Device, Equalizer, DVD, CD, Mic, Recording, Video, Tape, Volume Control and camera
Ήχος παιχνιδιού, Ακούστε, συσκευή ήχου, Equalizer, DVD, CD, μικρόφωνο, Εγγραφή, βίντεο, Tape, έλεγχος έντασης ήχου και κάμερα
Βρέθηκαν αυτό το σεμινάριο χρήσιμο; Μπορείτε να αγοράσετε ένα καφέ για μένα, μπορείτε να πληρώσετε εδώ !! Cheers :)

pixel RIATMP1157  How to make button and icons

Μοιραστείτε και απολαύστε
  •  RIATMP1157  How to make button and icons favicons?domain=digg RIATMP1157  How to make button and icons favicons?domain=www.dzone RIATMP1157  How to make button and icons favicons?domain=www.facebook RIATMP1157  How to make button and icons favicons?domain=www.google RIATMP1157  How to make button and icons favicons?domain=www.linkedin RIATMP1157  How to make button and icons favicons?domain=favorites.live RIATMP1157  How to make button and icons favicons?domain=www.mixx RIATMP1157  How to make button and icons favicons?domain=www.myspace RIATMP1157  How to make button and icons  RIATMP1157  How to make button and icons favicons?domain=reddit RIATMP1157  How to make button and icons favicons?domain=www.stumbleupon RIATMP1157  How to make button and icons favicons?domain=technorati RIATMP1157  How to make button and icons favicons?domain=twitter RIATMP1157  How to make button and icons favicons?domain=buzz.yahoo RIATMP1157  How to make button and icons
Αφήστε μια απάντηση 5837 εμφανίσεις, 13 μέχρι στιγμής σήμερα |
Ακολουθήστε Συζήτηση

One Response to "RIATMP1157-Πώς να κάνει κουμπί και τα εικονίδια"

  1. Zoran Λέει:

    Δεν είστε σίγουροι ότι αυτό είναι αλήθεια:), αλλά χάρη για μια θέση.
    Ευχαριστίες

Αφήστε μια απάντηση