• Σπίτι
  • Σχετικά
  • Άρθρα
  • Επικοινωνία

: 91 11 9810018780 Mail στη διεύθυνση: info@aceinfowayindia.com / Call: 91 11 9810018780

  • Το άρθρο γράφτηκε
  • στις 14.10.2009
  • στις 10:31 π.μ.
  • από admin

Πώς να δημιουργήσετε ένα Νίκαια Sleek Dark κουμπιού στο Photoshop

Γεια σου ρε παιδιά ένα ακόμη Photoshop Tutorial. Σε αυτό το σεμινάριο θα σας Μάθετε πώς να δημιουργήσετε ένα Νίκαια Sleek Dark κουμπιού στο Photoshop. Αυτό είναι πολύ απλό και πολύ αποτελεσματικό φροντιστήριο. Ελπίζω ότι θα απολαύσετε αυτό το σεμινάριο.

Τελικό Preview

Αυτό είναι αυτό που κάνουμε σήμερα πηγαίνουν

final-sleek-dark-button

Βήμα # 1

Ανοίξτε photoshop και να δημιουργήσει ένα νέο έγγραφο, η δική μου είναι 550px Χ 398px με λευκό φόντο.

final-sleek-dark-button-step1

Βήμα # 2

Συμπληρώστε το χρώμα στο φόντο στρώμα, το χρώμα μου είναι # 131313.

final-sleek-dark-button-step2

Βήμα # 3

Επιλέξτε το Rounded Rectangle Tool και να δημιουργήσει το κουμπί, ακτίνα ορυχείο είναι 5px, πλάτος: 219px και ύψος: 40px.

final-sleek-dark-button-step3

Τώρα εφαρμόζεται κάποιο αποτέλεσμα

Gradient Overlay

Styling το κουμπί, κάντε διπλό κλικ στην φωτογραφία του κουμπιού Layer στην Στρώματα ομάδας για το άνοιγμα του στρώματος στυλ παράθυρο διαλόγου, θα εφαρμόσουμε μια κάθετη gradiant αποτέλεσμα για κουμπιού σας. Στη συνέχεια, κάντε κλικ στο χρώμα κλίση για το δικαίωμα του Gradient δυνατότητα να ανοίξει το χρώμα Gradient Editor.

iphone-like-buttons-step3-b

Κάντε διπλό κλικ στα αριστερά-χρώμα-stop και πληκτρολογήστε την τιμή # 0E0E0E χρώμα, κάντε διπλό κλικ στα αριστερά-κέντρο-χρώμα-stop και πληκτρολογήστε την τιμή # 1C1C1C χρώμα, κάντε διπλό κλικ επάνω δεξιά-κέντρο-χρώμα-stop και πληκτρολογήστε το τιμή χρώμα # 262626, στη συνέχεια, κάντε διπλό κλικ στο δεξί-χρώμα-stop και πληκτρολογήστε την τιμή χρώμα # 292929.

final-sleek-dark-button-step3a

Θα πρέπει να μοιάζει με αυτό.

final-sleek-dark-button-step3b

Outer Glow

Επόμενη εφαρμόσει το Εξωτερικό στυλ στρώμα Glow. Η αλλαγή του τρόπου μείγμα να Overlay, από την αλλαγή των τιμών του μεγέθους. Επιλέγω να ορίσετε το μέγεθος σε 3px

Επιλέγω να ρυθμίσετε το Αδιαφάνεια κατά 30%.

Η αλλαγή της Τεχνική σε ακριβή.

final-sleek-dark-button-step3c

Θα πρέπει να μοιάζει με αυτό.

final-sleek-dark-button-step3d

Βήμα # 4

Επιλέξτε Οριζόντια Type Tool και κείμενο σχετικά με το είδος μπροστά.

final-sleek-dark-button-step4

Βήμα # 5

περιοχή της στιβάδας του κουμπιού (Ctrl + Κάντε κλικ στις φωτογραφίες του κουμπιού Layer στο Layers Panel).

final-sleek-dark-button-step5

Από δημιουργήσετε ένα νέο όνομα στρώμα το στρώμα Blue κλίση.

Styling το μπλε κλίση-διπλό κλικ στην φωτογραφία το μπλε κλίση Layer στην Στρώματα ομάδας για το άνοιγμα του στρώματος στυλ παράθυρο διαλόγου, θα εφαρμόσει την οριζόντια gradiant αποτέλεσμα για κουμπιού σας. Στη συνέχεια, κάντε κλικ στο χρώμα κλίση για το δικαίωμα του Gradient δυνατότητα να ανοίξει το χρώμα Gradient Editor.

Κρατήστε το Angle στο 180o

final-sleek-dark-button-step5ab

Κάντε διπλό κλικ στο αριστερό-χρώμα-stop και πληκτρολογήστε την τιμή # 047CA3 χρώμα, κάντε διπλό κλικ στο κέντρο-χρώμα-stop και πληκτρολογήστε την τιμή χρώμα # 25C4F4, στη συνέχεια, κάντε διπλό κλικ στο δεξί-χρώμα-stop και πληκτρολογήστε την τιμή χρώμα # 047CA3.

final-sleek-dark-button-step5b

Θα πρέπει να μοιάζει με αυτό.

final-sleek-dark-button-step5a

Τώρα αποεπιλέξετε επιλογής σας (Ctrl + D). Τώρα να το highlight κάτω από το κουμπί έτσι ώθηση το στρώμα κάτω δύο pixels ακουμπώντας το κάτω πλήκτρο (από το πληκτρολόγιό σας).

Αποτέλεσμα

final-sleek-dark-button

Κατεβάστε το αρχείο προέλευσης

Αν θέλετε να ελέγξετε την εργασία σας, μπορείτε να κατεβάσετε το αρχείο PSD για αυτό το σεμινάριο.

κοιμάμαι-κουμπί (226 KB)

Filed under: Photoshop, Tutorials από admin

Προώθηση μας

  • Προσθέστε σε Mixx!

Ετικέτες: Photoshop, Tutorials

Σχετικά άρθρα:

αν απολαύσατε την ανάγνωση αυτού του άρθρου, παρακαλώ ελέγξτε τα άλλα συναφή άρθρα παρακάτω:

    • Πώς να δημιουργήσει Ι-Phone Όπως κουμπιού στο Photoshop
    • Πώς να δημιουργήσετε letterpress Τυπογραφίας στο Photoshop
    • Πώς να δημιουργήσετε Νίκαια Easy 3D Επίδραση Κείμενο στο Photoshop
    • Πώς να δημιουργήσετε Smooth Γυαλιστερό Επίδραση Κείμενο στο Photoshop
    • Δημιουργήστε ένα ωραίο κουτί Icon στο Photoshop
Untitled Document

Υποβολή ένα σχόλιο

XHTML: Μπορείτε να χρησιμοποιήσετε αυτές τις ετικέτες: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> < del datetime = ""> <em> <i> <q cite=""> <strike> <strong>


CommentLuv Enabled δείτε περισσότερα
«Δωρεάν Κοινωνική σελιδοδείκτη Εικόνες
Paradise Προγραμματιστών τοποθεσίες της Εβδομάδας για τις 16 Οκτωβρίου 2009 »
Untitled Document

    Εγγραφή

  • Μέρα για ζωοτροφές
  • Εγγραφείτε μέσω email
  • Ακολουθήστε μας σε έξαψη
  • Χορηγός
  • Χορηγός
  • Χορηγός
  • Χορηγός
  • Χορηγός
  • Χορηγός

    • Αναζήτηση

      Untitled Document
  • Ημερολόγιο

    Οκτώβριο του 2009
    M T Δ T F S S
    «Σεπ Νοέ »
    1 2 3 4
    5 6 7 8 9 10 11
    12 13 14 15 16 17 18
    19 20 21 22 23 24 25
    26 27 28 29 30 31
    • Σελίδες

      • Σπίτι
      • Σχετικά
      • Άρθρα
      • Επικοινωνία
    • Κατηγορίες

    • Css (19)
    • Σχεδιασμός / Έμπνευση (48)
    • Freebies (31)
    • Graphic Design (10)
    • Photoshop (16)
    • Πόροι (29)
    • Seo (1)
    • Εργαλεία (7)
    • Tutorials (30)
    • Τυπογραφία (4)
    • Web Development (5)
    • Wordpress (6)
    • Αρχεία

    • Νοέμβρης 2009
    • Οκτώβριο του 2009
    • Σεπτέμβριος 2009
    • Αύγουστος, 2009
    • Ιούλιος 2009
    • Ιούνιος 2009
    • Μάιο 2009
    • Πρόσφατες δημοσιεύσεις

    • Css
    • Σχεδιασμός / Inspiration
    • Freebies
    • Γραφιστική
    • Photoshop
    • Δημοφιλείς θέσεις

    • Πώς δημιουργήσει εμφανίσιμη μορφή δεν πίνακα
    • 30 ιστοσελίδες με μέγιστη Πορτοκαλί
    • Πώς να δημιουργήσετε Νίκαιας Scalable CSS Βασισμένο Breadcrumbs
    • 5 βήματα για τη βελτίωση της Γράψτε Css
    • Πώς να δημιουργήσετε letterpress Τυπογραφίας στο Photoshop
    • Δημιουργήστε ένα ωραίο κουτί Icon στο Photoshop
    • 6 Awesome Online επεξεργασίας φωτογραφιών Εργαλεία
    • Ετικετών

    Css Σχεδιασμός Γραμματοσειρές Freebies Γραφιστικής Γραφικός Σχεδιασμός Εικόνες Έμπνευση Inspitation Photoshop Πόρων Εργαλεία Tutorials Τυπογραφίας Web ανάπτυξη Wordpress

    • Φίλοι

      • Abduzeedo
      • Εκτός Alist
      • BittBox
      • CrazyLeaf Design
      • Css Κόλπα
      • David Walsh
      • Fudgegraphics
      • Καύσιμο δημιουργικότητά σας
      • Βοήθεια Developer
      • Άμεση Shift
      • Line25
      • Mirificampress
      • Μου Ink Blog
      • Noupe
      • PSDFan
      • PSDtuts
      • Μερίδιο Brain
      • Έξι Αναθεωρήσεις
      • Κουτάλι Graphics
      • Toxel
      • Vandelay Design
      • Λειτουργούμε
      • Web Designer Depot
      • Web Designer Λέτζερ
      • Web Designer Wall
      • Μπορείτε Ο σχεδιαστής
    • Μεταφραστής

      English flagItalian flagKorean flagChinese (Simplified) flagChinese (Traditional) flagPortuguese flagGerman flagFrench flagSpanish flagJapanese flagArabic flagRussian flagGreek flagDutch flagBulgarian flagCzech flagCroat flagDanish flagFinnish flagHindi flagPolish flagRumanian flagSwedish flagNorwegian flagCatalan flagFilipino flagHebrew flagIndonesian flagLatvian flagLithuanian flagSerbian flagSlovak flagSlovenian flagUkrainian flagVietnamese flagAlbanian flagEstonian flagGalician flagMaltese flagThai flagTurkish flagHungarian flag
  • ΧΟΡΗΓΟΙ

    Αναχώρηση UPrinting για YouTheDesigner.


    Business Cards Online

    Web Design Blog Directory

.
Untitled Document
Επιστροφή στην κορυφή

Γενικά

Αυτά ίσως κάποιων συμφερόντων
  • Σχετικά με την Εταιρία μας
  • Μαρτυρίες
  • Στοιχεία Επικοινωνίας
  • Ιστολόγιο
  • Κοινωνική - Twitter, Flickr

Έργα

Παραδείγματα των παλαιότερων προγραμμάτων
  • Σχετικά με την Εταιρία μας
  • Μαρτυρίες
  • Στοιχεία Επικοινωνίας
  • Ιστολόγιο
  • Κοινωνική - Twitter, Flickr

Υπηρεσίες

Αυτό είναι αυτό που πωλούν σήμερα
  • Σχετικά με την Εταιρία μας
  • Μαρτυρίες
  • Στοιχεία Επικοινωνίας
  • Ιστολόγιο
  • Κοινωνική - Twitter, Flickr

Στοιχεία Επικοινωνίας

Θέλετε να μας μίσθωση; ξεκινήσετε εδώ ...
  • Δωρεάν Project Αξιολόγηση
  • Email - info@aceinfowayindia.com
  • Τηλ: 91 11 9810018780

Copyright © 2009, All Right Reserved, Ace Infoway Ινδία Μίσθωση Ace Infoway Ινδία για το επόμενο σχέδιό σας σχέδιο. Προβολή του χαρτοφυλακίου μας.