Πώς να δημιουργήσετε Pop Up Μενού στο Photoshop

Adobe Photoshop είναι το βιομηχανικό πρότυπο για την εργασία με ψηφιακές εικόνες και graphic design . Μεγάλο μέρος του αισθητικού περιεχομένου που βλέπετε για τα καλύτερα σχεδιασμένες ιστοσελίδες σχεδιάστηκε και δημιουργήθηκε στο Photoshop . Ωστόσο , το Photoshop είναι καλό για κάτι περισσότερο από την αισθητική ? Μία από τις πολλές άλλες πτυχές για την ιστοσελίδα σας που μπορεί να δημιουργηθεί με το λογισμικό είναι ένα pop -up μενού . Οδηγίες
δημιουργία του μενού
Η

1 Ανοίξτε το Adobe Photoshop και επιλέξτε "Αρχείο - . > Νέα " Επιλέξτε το "Web" προεπιλογής και την επιλογή 1024 x 768 διάσταση για μια ιδέα για το πώς pop -up μενού σας θα πρέπει να κλιμακωθεί και μεγέθους για ένα κανονικό παράθυρο του προγράμματος περιήγησης . 2

Επιλέξτε το «εργαλείο Γραμμή " από τον πίνακα εργαλείων και "Shift + κλικ " ενώ σύρετε προς τα πλάγια για να σχεδιάσετε μια οριζόντια γραμμή σε όλη την καμβά . Μπορείτε να ρυθμίσετε κάθε χρώμα προσκηνίου θέλετε να καθορίσει το χρώμα της γραμμής ? Πρόκειται να κολλήσει με αυτό το χρώμα για το pop-up μενού, καθώς
εικόνων 3

Επιλέξτε το "Τύπος . εργαλείο . " Μετακινήστε τον κέρσορα κοντά στη γραμμή και κάντε κλικ στο κουμπί όταν δείτε μια κυματιστή γραμμή δίπλα στον κέρσορα τύπου . Αυτό ενεργοποιεί το "Πληκτρολογήστε στο δρόμο " λειτουργία .
Η

4 Καθορίστε τις προτιμήσεις σας κείμενο για το μενού κειμένου flyout σας . Πληκτρολογήστε μια λέξη τίτλος για το μενού .
5

Re - επιλέξτε το "Τύπος εργαλείου " και κάντε κλικ στο σημείο που θέλετε το pop-out μενού για να ξεκινήσει κάτω από τον τίτλο . Πληκτρολογήστε τις subheads σας , πατώντας το πλήκτρο " Επιστροφή " για να ξεκινήσει κάθε νέο. Αν θα θέλατε να αλλάξετε το διάστημα μεταξύ subheads , επισημάνετε το κείμενο και ανοίξτε το "Character " μέρος για να ρυθμίσετε τις κορυφαίες ρυθμίσεις .
Η

6 Επιλέξτε το " εργαλείο ορθογωνίου " και σχεδιάστε ένα ορθογώνιο γύρω από το subhead κειμένου να δημιουργήσετε ένα φόντο για το μενού pop -up . Χρησιμοποιήστε το " εργαλείο Move" για να ευθυγραμμίσει το ορθογώνιο προς την οριζόντια γραμμή . Μετακινήστε το ορθογώνιο στρώμα κάτω από το στρώμα οριζόντια γραμμή στο "Layers " panel
Η 7

Επιστροφή στην subhead στρώμα κειμένου και επιλέξτε ". Layer - > Ραστεροποίηση - . > Τύπος "

8

κάντε δεξί κλικ στο στρώμα στο " Layers" πάνελ και επιλέξτε "Επιλογή pixels . " Επιλέξτε " Edit - > Fill" και επιλέξτε ένα ελαφρύ χρώμα που θα αντίθεση με το μπλε φόντο . Για παράδειγμα , αν χρησιμοποιείτε το απλό λευκό , θα έχετε ένα δροσερό αποτέλεσμα αντίστροφο κείμενο για το μενού .
Η

9 Επιλέξτε το " εργαλείο Line" και " Shift + κλικ" για να δημιουργήσει μια διαχωριστική γραμμή μεταξύ της πρώτο και δεύτερο subheads . Διπλότυπο αυτή τη γραμμή ανάμεσα σε κάθε subhead επιλέγοντας το " εργαλείο Move" και κρατώντας πατημένο το πλήκτρο "Επιλογή" , όπως σας σύρετε τη γραμμή σε κάθε θέση .
Η 10

Επιλογή όλων των στρωμάτων διαχωριστική γραμμή στην " Layers " πάνελ και επιλέξτε" Layer - > Ομάδα στρώμα " . Επιλέξτε αυτήν την ομάδα και επιλέξτε την επιλογή " Διανομή κάθετη κέντρα " στο " εργαλείο Move" πάνελ πάνω στον καμβά για να διανείμει τις γραμμές ομοιόμορφα μεταξύ των subheads .
Εικόνων αποθήκευση, η ετοιμασία μενού σας για το Web

11

Επιλέξτε το «εργαλείο φέτα " από τον πίνακα εργαλείων και επιλέξτε " View - > Snap" από τον πίνακα ελέγχου . Δημιουργία φέτες για τον τίτλο και το καθένα από τα subheads , επιτρέποντας στο δρομέα για να σπάσει απότομα σε κάθε γραμμή .
Η 12

Επιλέξτε "Αρχείο - > Αποθήκευση για το Web " και ρυθμίστε την ποιότητα και το χρώμα τις ρυθμίσεις σας για το πώς θέλετε το αναδυόμενο μενού για να εμφανιστεί στο διαδίκτυο .
Η 13

Ανοίξτε και να συνδέσει τις φωτογραφίες σας με το Adobe Dreamweaver ή άλλο πρόγραμμα επεξεργασίας HTML για να εμψυχώσει αναδυόμενο μενού σας .
Η

Η