Inset

Βοήθεια και προτάσεις για το καλύτερο πρόγραμμα επεξεργασίας εικόνας, και γραφικών.

Συντονιστές: Super-Moderators, Graphics Moderators

Απάντηση
Άβαταρ μέλους
fmayakos
Honorary Member
Δημοσιεύσεις: 1249
Εγγραφή: 23 Ιούλ 2001 03:00
Τοποθεσία: Θεσσαλονίκη

Inset

Δημοσίευση από fmayakos » 10 Σεπ 2005 02:49

Photoshop Month: 09/30
Σ' αυτό το βοήθημα εξοικειωνόμαστε με την
λειτουργία του Inset. Η χρησιμότητα του inset
είναι πολύ μεγάλη για τους gui designers γι' αυ-
τον τον λόγο, φρόντισα αυτό το βοήθημα να
είναι αρκετά πλήρες.
To εφέ του inset είναι ένα πάρα πολύ χρήσιμο
γι' αυτούς που σχεδιάζουν κουμπιά ή οθόνες
πάνω σε μία επιφάνεια γιατί δίνει την αίσθηση
του βάθους και του οτι το κουμπί υπάρχει.
Δείτε το εξής παράδειγμα:
Εικόνα


Inset

Βήμα 1

Δεδομένου του ότι έχετε κάνει ενα panel για το interface σας ήδη, κάντε ένα νέο layer Εικόνα.
(για το panel δείτε το βοήθημα Μεταλλική επιφάνεια)
Το επόμενο βήμα είναι η δημιουργία ενός μικρού μεταλλικού κουμπιού.

Εικόνα


Βήμα 2

Πατήστε Ctrl+R ή View -> Rulers ούτως ώστε να εμφανιστούν οι χάρακες.
Τώρα με την βοήθεια των χαράκων θα ορίσουμε δύο ευθείες οι οποιες θα τέμνονται εκεί που θέλουμε να βρίσκεται το κουμπί. Έτσι κάνοντας click πάνω σε έναν από τους χάρακες και κρατώντας το κουμπί πατημένο μπορείτε να ορίσετε μία από τις δύο γραμμές. Ομοιοτρόπως, θα κάνετε και τη δεύτερη.
Εάν γίνει κάποιο λάθος και θέλετε να τις μετακινήσετε, θα χρειαστεί πρώτα να επιλέξετε το Move Tool Εικόνα.
Εάν πάλι κάνετε περισσότερες γραμμές-οδηγούς απ' όσες χρειάζεστε πάλι με το Move Tool Εικόνα σύρτε τες πάνω στου χάρακες.

Εικόνα


Βήμα 3

Πληκτρολογήστε D και Χ για να έχετε Εικόνα και ορίστε foreground χρώμα το #C1C2C4.
Αφού βρείτε το σημείο σας και το ορίσετε με την βοήθεια των ευθειών επιλέξτε το Ellipse tool Εικόνα και εισάγετε αυτές τις ρυθμίσεις:
Εικόνα

Τώρα, αφού τοποθετήσετε (με πολλή προσοχή) το ποντίκι σας στο σημείο τομής των ευθειών σχηματίστε ένα μικρό κυκλάκι για κουμπί.

Ίσως πολλοί να μου εκφράσετε την εξής απορία τώρα:
- Ρε 'συ φίλε τι γίνεται αν εγώ δεν θέλω στρογγυλό κουμπί; Είναι υποχρεωτικό να κάνω το κουμπί σου;
- Όχι, βέβαια... Κατ' αρχάς, η ιδέα του κουμπιού είναι πρόσθετη σ' αυτό το tutorial. Κανονικά το tutorial είναι μόνο για το εφέ του inset αλλά είπα να προσθέσω και αυτό το εύκολο κουμπάκι για πειραματισμό. Εάν τώρα εσείς θέλετε ελλειπτικό κουμπί αντί για Circle επιλέγετε Proportional και εισάγετε μία αναλογία ύψους και πλάτους που σας βολεύει. Εάν τώρα θέλετε τετράγωνο ή κάποιο άλλο σχήμα τώρα επιλέξτε ανάλογα αλλα φροντίστε προτίστως να έχετε επιλέξει το From Center.


Εικόνα


Βήμα 4

Πατήστε Ctrl+H ή View -> Extras ούτως ώστε να εξαφανιστούν προσωρινά οι γραμμές.
Για ακόμα μια φορά θα χρησιμοποιήσουμε layer styles.
Κάνουμε διπλό click στο layer με το κουμπί και ανοίγει το παράθυρο Layer Styles.

Αρχίζουμε με Inner Shadow.
Εικόνα

Συνεχίζουμε με Inner Glow:
Εικόνα

Ενεργοποιούμε και το Gradient Overlay με τις ρυθμίσεις:
Εικόνα

Και τέλος Stroke
Εικόνα

Kαι τώρα στο κυρίως πιάτο!

Εικόνα


Βήμα 5

Επανεμφανίστε τις γραμμές πατώντας Ctrl+H ή View -> Extras.
(Εάν η επιφάνεια στην οποία εφαρμόζετε το inset δεν είναι μεταλλική τώρα είναι η κατάλληλη στιγμή για να αλλάξετε foreground χρώμα επιλέγοντας ένα χρώμα ελαφρώς πιο σκούρο από αυτό της επιφάνειας.)

Δημιουργήστε ένα ακόμη layer Εικόνα και μεταφέρετέ το κάτω από το layer του κουμπιού, σέρνωντάς το.

Επιλέξτε πάλι το Ellipse tool Εικόνα και (έχοντας τις ίδιες ρυθμίσεις με πριν) σχεδιάζετε ένα κυκλάκι αρχίζοντας απο το σημείο τομής των ευθειών φροντίζοντας να βγει λίγο μεγαλύτερο (όπως στην εικόνα).

Πατήστε για τελευταία φορά Ctrl+H ή View -> Extras ώστε να εξαφανιστούν οι γραμμές και κάντε διπλό click στο layer του μεγαλύτερου κύκλου.

Εικόνα


Βήμα 6

Πατήστε για τελευταία φορά Ctrl+H ή View -> Extras ώστε να εξαφανιστούν οι γραμμές και κάντε διπλό click στο layer του μεγαλύτερου κύκλου.
Ενεργοποιήστε το Gradient Overlay και αφού εισάγετε αυτές τις ρυθμίσεις
Εικόνα
πατήστε ΟΚ.

Εικόνα

Αυτό ήταν! Δεν ήταν και τόσο δύσκολο... έτσι;
βαρέθηκα να διαβάζω greeklish!
κάντε έναν κόπο http://speech.ilsp.gr/greeklish/greeklishdemo.asp και μεταφράζετε τα μηνυματα σας
περισσότεροι θα τα διαβάσουν στα ελληνικά!

Άβαταρ μέλους
af
Honorary Member
Δημοσιεύσεις: 2928
Εγγραφή: 06 Ιούλ 2003 17:18
Τοποθεσία: Γλυφάδα
Επικοινωνία:

Inset

Δημοσίευση από af » 10 Σεπ 2005 04:34

:clap: :clap: :clap: :clap:
Πολύ χρήσιμο tut, μπράβο Fmayakos :)

Άβαταρ μέλους
xmavidis
Honorary Member
Δημοσιεύσεις: 1217
Εγγραφή: 02 Δεκ 2003 19:59
Τοποθεσία: Ηράκλειο

Inset

Δημοσίευση από xmavidis » 10 Σεπ 2005 13:38

Πολύ χρήσιμο και πολύ ωραίο! :P
I want to know God’s thoughts; the rest are details.
Albert Einstein

LightForce
WebDev Moderator
Δημοσιεύσεις: 3812
Εγγραφή: 13 Απρ 2003 23:49

Inset

Δημοσίευση από LightForce » 10 Σεπ 2005 18:06

άψογο το Inset και πολύ χρήσιμο Αργύρη.

Απάντηση

Επιστροφή στο “Adobe Photoshop, illustrator”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες