Τα στοιχεία του Ρετρό Web Design

Το vintage και retro στυλ γίνεται όλο και πιο δημοφιλές στο σημερινό ψηφιακό έργο τέχνης.

Η χρήση ρετρό και vintage θέματα στο σχεδιασμό είναι ίσως μια από τις πιο διαδεδομένες τάσεις, δεδομένου ότι η βιομηχανία πήγε σχεδόν εντελώς ψηφιακή.

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

Από εδώ, είναι δυνατό να προσδιοριστούν οι τεχνικές που χρησιμοποιήθηκαν και να περιγραφεί ο τρόπος με τον οποίο επηρεάζουν τη συνολική σχεδίαση. Θα εξοικειωθείτε με αυτές τις τάσεις σχεδιασμού και θα μπορείτε να τις αναπαράγετε.

Για να σας βοηθήσουμε, τα σύντομα μαθήματα είναι διάσπαρτα σε όλο το άρθρο. Θα σας δείξουμε επίσης σε πολλά άλλα χρήσιμα σεμινάρια και πόρους για να ξεκινήσετε με το δικό σας vintage και ρετρό έργο!

1. Κύκλοι και άλλα απλά σχήματα

Απλά σχήματα χρησιμοποιούνται συνήθως στον σχεδιασμό vintage. Οι κύκλοι είναι οι πιο συνηθισμένοι, ειδικά στο branding. Τα παρακάτω παραδείγματα έχουν επιλεγεί προσεκτικά για να σας δείξουν πόσο δυνατά είναι τα απλά σχήματα.

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

Η επωνυμία του Circlebox Creative βασίζεται σε έναν κύκλο και εμπνέεται από vintage γραμματόσημα και κονκάρδες. Το σχέδιο είναι παγωμένο με floral μοτίβα και απλό τυπογραφικό στυλ.

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

Αυτό το vintage σχέδιο, όπως το εμπορικό σήμα της Circlebox Creative, εμπνέεται από vintage γραμματόσημα μελάνης και κονκάρδες. Η ταυτότητα μοιάζει με ότι έχει πράγματι σφραγιστεί σε ένα κομμάτι χαρτί, σε αντίθεση με τις ομαλές και καθαρές γραμμές του Circlebox.

Ακολουθεί ένα άλλο κομμάτι επωνυμίας που βασίζεται σε έναν κύκλο. Η υφή και το μπλε σε όλο το γκρι φέρνουν πραγματικά αυτό το σχέδιο στη ζωή.

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

Μίνι-Tutorials

Πώς να εφαρμόσετε ένα floral μοτίβο της Damask σε έναν κύκλο χρησιμοποιώντας το Adobe Illustrator

Η εφαρμογή ενός μοτίβου σε έναν κύκλο στο Illustrator είναι κάτι που πιθανότατα θα κάνετε πολλά αν εξερευνήσετε την ρετρό τάση. Η τεχνική είναι παρόμοια με αυτά που κάνουν τα Glace Cakes για την επωνυμία τους (όπως φαίνεται παραπάνω).

Ανοίξτε το Illustrator και σχεδιάστε έναν κύκλο. Κρατήστε το πλήκτρο Shift ενώ σύρετε τον κύκλο σας έξω για να το κρατήσετε στρογγυλό. Εισαγάγετε το μοτίβο floral από την Damask επιλέγοντας Αρχείο → Τόπος.

Καταργήστε το φόντο και αλλάξτε το χρώμα του νέου μοντέλου που έχετε τοποθετήσει. Μπορείτε να επιλέξετε μεμονωμένα στοιχεία χρησιμοποιώντας το εργαλείο άμεσης επιλογής.

Επιλέξτε το μοτίβο σας χρησιμοποιώντας το εργαλείο επιλογής και, στη συνέχεια, μεταβείτε στο παράθυρο → Pathfinder για να ανοίξετε το παράθυρο Pathfinder, αν δεν το έχετε ήδη κάνει. Κρατήστε το πλήκτρο Shift και επιλέξτε τον κύκλο σας για να επιλέξετε και τα δύο στοιχεία ταυτόχρονα. Κάντε κλικ στο κουμπί "Μείον εμπρός" στο παράθυρο του Pathfinder για να αφαιρέσετε το floral μοτίβο που βρίσκεται έξω από τον κύκλο σας. Παίξτε με την επιλογή χρωμάτων σας, και τελειώσατε!

Δημιουργία γραμμής Bubbled Χρησιμοποιώντας το Adobe Photoshop

Ας δημιουργήσουμε μια γραμμή που μοιάζει με φούσκα όπως αυτή του παραπάνω παραδείγματος.

Χρησιμοποιώντας το εργαλείο ορθογώνιου περιγράμματος, σύρετε μια επιλογή και γεμίστε το με μαύρο σε ένα νέο στρώμα. Επιλέξτε το εργαλείο ελλειπτικού πλαισίου και κρατήστε πατημένο το πλήκτρο Shift, σύρετε μια πολύ μικρή επιλογή και γεμίστε το με μαύρο, και πάλι σε ένα νέο στρώμα.

Τοποθετήστε τον μαύρο κύκλο στο κάτω μέρος του μαύρου ορθογωνίου. Διπλασιάστε τη στρώση και τοποθετήστε τον νέο κύκλο δίπλα στο πρωτότυπο.

Επαναλάβετε αυτό το βήμα έως ότου έχετε κάτι που μοιάζει με την ακόλουθη εικόνα. Θα έχετε πολλά στρώματα. Επιλέξτε όλα αυτά ενώ κρατάτε πατημένο το πλήκτρο Shift και, στη συνέχεια, μεταβείτε στο Layer → Merge Layers για να τα μετατρέψετε σε ένα.

Τώρα θα προσθέσουμε μερικά απλά στρώματα στυλ ή επιλογές ανάμειξης για να φτιάξουμε το σχήμα μας να ζωντανέψει! Κάντε δεξί κλικ στο στρώμα σας και επιλέξτε "Επιλογές μίξης". Θα πρέπει να ανοίξει το παράθυρο "Layer Style". Εφαρμόστε τα ακόλουθα εφέ για να προσθέσετε μια κλίση, εσωτερική σκιά και σκιά σταγόνας:

Και τελειώσαμε!

2. Δύο τόννοι και περιορισμένα σχέδια χρωμάτων

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

Αυτός ο μινιμαλιστικός σχεδιασμός παίρνει την οπτική του έκκληση από τα ασπρόμαυρα σχήματα και γραμμές, ειδικά την οριζόντια διακεκομμένη γραμμή και τα κομμένα σχήματα από το κάτω μέρος του κύκλου.

Αυτή η επωνυμία επαναλαμβάνει μερικά επιλεγμένα χρώματα σε όλη την έκταση. Τα χρώματα δουλεύουν απίστευτα καλά μαζί. Το κίτρινο-πορτοκαλί είναι το εστιακό χρώμα που τραβάει την προσοχή σας.

Αυτό το όμορφο κομμάτι του ρετρό σχεδιασμού βασίζεται αποκλειστικά στο χρώμα και την τυπογραφία. Οι λεπτές γραμμές πλάτους ενός pixel το τελειώνουν.

Ένας άλλος ασπρόμαυρος σχεδιασμός δύο τόνων. Αυτή η ταυτότητα βασίζεται σε ένα σήμα και παίρνει μια ελαφρώς τρισδιάστατη όψη από απλή τυπογραφία και εφέ.

Αυτό το παράδειγμα δείχνει πραγματικά πόσο αποτελεσματικό μπορεί να είναι το χρώμα. Χρησιμοποιεί τρία χρώματα: πορτοκαλί, καφέ και λευκό. Η αντίθεση μεταξύ των τριών δειγμάτων λειτουργεί πολύ καλά για το σχεδιασμό.

Αυτός ο σχεδιασμός (η ίδια η ταυτότητα, όχι το φόντο) στηρίζεται αποκλειστικά στο χρώμα και την τυπογραφία.

Αυτό το σχέδιο συνδυάζει πορτοκαλί και ωραίο μπλε-πράσινο με λευκό. Ο συνδυασμός χρωμάτων ταιριάζει με τα φανταχτερά σύνορα και τα απλά τυπογραφικά εφέ.

Ακόμα ένα άλλο τυπογραφικό λογότυπο που βασίζεται σε δύο χρώματα: λευκό χρώμα σε κόκκινο χρώμα. Παρατηρήστε πώς βασίζεται η ταυτότητα σε έναν κύκλο.

Αυτή η ταυτότητα χρησιμοποιεί μόνο τρία χρώματα, ένα κομψό γραμματοσειρά και έναν ωραίο τρόπο ανάμειξης για να βάλει το κερασάκι στην τούρτα.

Πόροι χρωμάτων

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

ColourLovers (εφαρμογή ιστού)
Μια υπέροχη ιστοσελίδα αφιερωμένη στα σχέδια χρωμάτων. Περιηγηθείτε στα υπάρχοντα θέματα που δημιουργήθηκαν από την κοινότητα ή δημιουργήστε το δικό σας από την αρχή ανεβάζοντας φωτογραφίες.
Ελικόπτερο Toucan (εφαρμογή ιστού)
Μια άλλη εφαρμογή στο διαδίκτυο, αλλά χωρίς κοινοτική υποστήριξη όπως ColourLovers. Αυτή η εφαρμογή σάς επιτρέπει να δημιουργείτε σχέδια χρωμάτων από την αρχή ή από τις εισαγόμενες εικόνες.
Adobe Kuler (εφαρμογή ιστού)
Ακόμη άλλη εφαρμογή web διαχείρισης χρωμάτων, αυτή τη φορά που μας έφερε η αγαπημένη Adobe. Η διεπαφή είναι εκπληκτική και εύκολη στη χρήση. Ο Kuler φιλοξενεί μια κοινότητα και μπορείτε να περιηγηθείτε στα σχέδια υψηλότερων επιπέδων χρώματος.
Ροή χρωμάτων (εφαρμογή iPhone)
Αυτή η εφαρμογή iPhone σας επιτρέπει να δημιουργείτε και να αποθηκεύετε παλέτες χρωμάτων από την αρχή ή από μια εισαγόμενη φωτογραφία. Μπορείτε επίσης να δημιουργείτε αυτόματα σχήματα από φωτογραφίες χρησιμοποιώντας τον ενσωματωμένο σκίτσα χρώματος.
Παλέτες (εφαρμογή iPhone)
Οι παλέτες είναι παρόμοιες με το Color Stream, επιτρέποντάς σας να δημιουργείτε και να αποθηκεύετε σχέδια χρωμάτων εν κινήσει από το μηδέν ή από μια εικόνα. Μπορείτε επίσης να πάρετε τα χρώματα από την αγαπημένη σας ιστοσελίδα.

Εάν είστε αρχάριος, εδώ είναι μερικά άρθρα που αξίζει να τα ελέγξετε: " Επιλογή συνδυασμών χρωμάτων " και " Θεωρία χρωμάτων για σχεδιαστές, Μέρος 3: Δημιουργήστε τις δικές σας παλέτες χρωμάτων . "

3. Τυπικά στοιχεία και τάσεις

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

Αυτό το απόσπασμα του σχεδιασμού τύπου είναι γεμάτο από καλής ποιότητας κείμενο. Το κείμενο ολοκληρώθηκε με μια σκιά σταγόνας και ένα απλό αλλά πραγματικά εκπληκτικό μοτίβο διαγώνιο-γραμμής ενός εικονοστοιχείου.

Εδώ είναι το αγαπημένο μου τυπογραφικό κομμάτι σε αυτή την βιτρίνα. Συνδυάζει μερικά εξαιρετικά vintage στυλ με σύγχρονες τεχνικές. Ο τύπος ζωντανεύει με την προσθήκη λεπτών λεπτομερειών, όπως το λευκό εγκεφαλικό επεισόδιο ενός εικονοστοιχείου στη γραμμή "Σας καλωσορίζουμε θερμά" και τις ολοένα και πιο σημαντικές σκιάσεις από τον τύπο ημερομηνίας.

Αυτή η ρετρό τυπογραφία αποκαλύπτει εκπληκτικά απλές τεχνικές. Ο τύπος "Σχεδιασμός" είναι διπλός τρεις φορές και επανατοποθετείται. Το κάτω αντίγραφο είναι στη συνέχεια υφή για να δημιουργήσει ένα υπέροχο στυλ ρετρό μέσα σε λίγα λεπτά.

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

Απλή τυπογραφία σε συνδυασμό με ημιδιαφανή σχήματα και λεπτή υφή. Ο σχεδιασμός συνοδεύεται όμορφα.

Δεν μπορείτε να πάρετε πολύ πιο απλό από αυτό: μια ισχυρή επιλογή των γραμματοσειρών.

Αυτή η τρισδιάστατη τυπογραφία ολοκληρώθηκε κατά πάσα πιθανότητα στο Illustrator, κάνοντας χρήση των εργαλείων 3-D εκεί. Έχει προστεθεί έντονος θόρυβος στο σχέδιο, το οποίο λειτουργεί καλά με το περιορισμένο χρωματικό σχέδιο.

Αυτό το μεγάλο μικρό στιγμιότυπο του ψηφιακού ρετρό σχεδιασμού συνδυάζει την υφή, το θόρυβο, τα απλά σχήματα, τα διαφορετικά στυλ ανάμειξης και το μεγάλο σχέδιο χρωμάτων. Η τυπογραφία, ειδικά ο μεγαλύτερος τύπος, έρχεται στη ζωή από τις απότομες σκιές.

Αυτό το εντυπωσιακό κομμάτι της γραφικής ύλης που εμπνέει vintage χρησιμοποιεί τα στοιχεία που έχουν σχεδιαστεί με το χέρι για την εμφάνισή του. Ο σχεδιασμός έχει επίσης περιορισμένο συνδυασμό χρωμάτων.

Η λευκή τυπογραφία σε αυτό το σχέδιο έχει συγχωνευθεί με την εικόνα σαν να ήταν εκεί όταν λήφθηκε η φωτογραφία. Λειτουργεί καλά με τη φωτογραφία σέπια.

Μίνι-Tutorials

Πώς να δημιουργήσετε τυπογραφία χεριού με χρήση Adobe, Photoshop ή Illustrator

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

Πρώτα απ 'όλα, σχεδιάστε μερικά γράμματα:

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

Αρχίστε να γεμίζετε τις γραμμές σας.

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

Στη συνέχεια, σαρώστε την εικόνα σας. Εάν δεν διαθέτετε σαρωτή, θα μπορούσατε να φωτογραφίσετε μόνο το έργο - βεβαιωθείτε ότι είναι υψηλής ποιότητας. Αφού σαρώσετε ή φωτογραφηθεί η εικόνα, ανοίξτε ένα νέο αρχείο Photoshop και μεταβείτε στο File → Place. εντοπίστε την εικόνα και τοποθετήστε την στο έγγραφό σας.

Μεταβείτε στην επιλογή Εικόνα → Ρυθμίσεις → Φωτεινότητα / Αντίθεση. Αυξήστε το επίπεδο αντίθεσης σε περίπου 50. Αυτό θα σκοτεινιάσει το μαύρο στην εικόνα.

Αποθηκεύστε το αρχείο σας ως εικόνα και ανοίξτε το Adobe Illustrator. Δημιουργήστε ένα νέο αρχείο RGB και μετά πηγαίνετε στο File → Place. Εντοπίστε την πρόσφατα αποθηκευμένη εικόνα και τοποθετήστε την στον καμβά σας. Στη γραμμή μενού στο επάνω μέρος του καμβά, επιλέξτε την επιλογή "Live Trace". Το κείμενό σας είναι πλέον ένα διάνυσμα εργασίας και μπορεί να κλιμακωθεί προς τα επάνω ή προς τα κάτω όπως θέλετε, για να χρησιμοποιηθεί στα έγγραφά σας στο Photoshop.

Πώς να προσθέσετε τυπογραφία σε μια φωτογραφία πόλης Χρησιμοποιώντας το Adobe Photoshop

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

Αντιγράψτε τη φωτογραφία και δημιουργήστε ένα νέο έγγραφο του Photoshop. Επικολλήστε τη φωτογραφία στο έγγραφο. Επιλέξτε το εργαλείο κειμένου και πληκτρολογήστε "Βαρκελώνη" στην τυπογραφική όψη της επιλογής σας. Μεταβείτε στην Επεξεργασία → Μετασχηματισμός → Περιστροφή και περιστρέψτε την τυπογραφία υπό γωνία έτσι ώστε να ευθυγραμμιστεί κατά προσέγγιση με τη γωνία των κτιρίων.

Θα παρατηρήσετε ότι μερικά από τα γράμματα δεν επικαλύπτουν τα κτίρια. Για να διορθώσετε αυτό, επιλέξτε το εργαλείο πένας και εκτελέστε χειροκίνητα το κάτω μέρος των γραμμάτων, σχεδιάζοντας νέα σχήματα πάνω τους. Μόλις το κάνετε, κάντε δεξί κλικ και επιλέξτε "Γεμίστε τη διαδρομή". Συμπληρώστε την επιλογή με μαύρο χρώμα.

Στη συνέχεια, διαγράψτε τις επικαλυπτόμενες περιοχές του τύπου σας. Για άλλη μια φορά, χρησιμοποιήστε το εργαλείο "Στυλό" για να δημιουργήσετε μια επιλογή. Κάντε ζουμ δεξιά στη φωτογραφία σας και εντοπίστε το κτίριο και το δέντρο. Μόλις το κάνετε, κάντε δεξί κλικ και πηγαίνετε στο "Make Selection". Θα πρέπει τώρα να έχετε μια κινούμενη διακεκομμένη γραμμή όπως αυτή που ακολουθεί:

Κάντε δεξί κλικ στο τυπογραφικό σας επίπεδο και επιλέξτε "Τύπος φυσαρίσματος". Αυτό θα το μετατρέψει από ένα στυλ τύπου σε ένα τυποποιημένο επίπεδο. Συγχώνευση του στρώματος τύπου με τα προσαρμοσμένα σχήματα που κάναμε νωρίτερα, επιλέγοντας όλα αυτά κρατώντας το πλήκτρο Shift και πηγαίνοντας στο Layer → Merge Layers. Η επιλογή που κάναμε στο τελευταίο βήμα με το εργαλείο στυλό θα πρέπει να είναι ενεργή. Με το επιλεγμένο επίπεδο μόνο τύπου, πατήστε το πλήκτρο Διαγραφή. Αυτό θα πρέπει να αφαιρέσει όλο το επικαλυπτόμενο κείμενο.

Είναι πλέον καιρός για κάποια πολύ απλή επεξεργασία φωτογραφιών για να συγχωνεύσετε τον τύπο σας λίγο καλύτερα. Επιλέξτε το στρώμα φόντου (το οποίο θα πρέπει να είναι η φωτογραφία σας) και μεταβείτε στην επιλογή Εικόνα → Προσαρμογές → Αποκορεσμός για να μετατρέψετε τη φωτογραφία σας σε κλίμακα του γκρι / ασπρόμαυρη. Τώρα μεταβείτε στην επιλογή Εικόνα → Ρυθμίσεις → Φίλτρο φωτογραφιών. Επιλέξτε την επιλογή σέπια από το αναπτυσσόμενο μενού και πατήστε με το ρυθμιστικό στάθμης για να ρυθμίσετε την ένταση του εφέ. Διάλεξα περίπου το 60%.

Κάντε δεξί κλικ στο στρώμα τύπου και επιλέξτε "Επιλογές μίξης" από το μενού. Εφαρμόστε μια επικάλυψη χρωμάτων στον τύπο σας. Χρησιμοποίησα ένα ανοικτό καφέ. Εδώ είναι το αποτέλεσμά μου:

Πώς να εφαρμόσετε μια σκιά Drop και Pattern Overlay στην τυπογραφία Χρησιμοποιώντας το Adobe Photoshop

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

Πρώτα ας δημιουργήσουμε το απλό πρότυπο. Ανοίξτε ένα νέο έγγραφο του Photoshop που είναι 3α-3 εικονοστοιχεία. Τώρα επιλέξτε το εργαλείο Μολύβι. Κάντε ζουμ δεξιά στον καμβά σας και χρησιμοποιώντας το μαύρο # 000000 τοποθετήστε τρεις κουκίδες διαγωνίως στον καμβά σας, όπως φαίνεται παρακάτω:

Μεταβείτε στην επιλογή Επεξεργασία → Ορισμός μοτίβου για να εμφανιστεί το παρακάτω πλαίσιο πεδίου. Καλέστε το πρότυπό σας κάτι κατάλληλο (κάλεσα τη δική μου "Diag Line 1"). Πατήστε το πλήκτρο "OK". Το σχέδιό σας έχει ολοκληρωθεί!

Δημιουργήστε ένα νέο έγγραφο του Photoshop. Γεμίστε το φόντο με ένα ανοιχτόχρωμο χρώμα της επιλογής σας και προσθέστε κάποια τυπογραφία στον καμβά. Οι γραμματοσειρές που χρησιμοποίησα είναι Helvetica Neue Medium και Helvetica Neue Bold.

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

Κάντε δεξί κλικ στο στρώμα τύπου σας και επιλέξτε "Επιλογές μίξης" για να ανοίξετε το παράθυρο Style Layer. Επιλέξτε "Επικάλυψη μοτίβου" και, από το αναπτυσσόμενο πλαίσιο μοτίβο, επιλέξτε το πρότυπο που κάναμε νωρίτερα. Αλλάξτε τη λειτουργία ανάμειξης σε "Επικάλυψη" και η αδιαφάνεια έως 30%. Τα αποτελέσματα θα ποικίλουν ανάλογα με την επιλογή χρώματος, γι 'αυτό μην διστάσετε να πειραματιστείτε.

Τώρα θα εφαρμόσουμε μια εσωτερική σκιά. Χρησιμοποιήστε τις ρυθμίσεις που βλέπετε στην παρακάτω εικόνα:

Τώρα εφαρμόστε μια πολύ ελαφριά αλλά σημαντική σκιά. Η προσοχή στις μικρές λεπτομέρειες αξίζει πάντα. Χρησιμοποιήστε παρόμοιες ρυθμίσεις με αυτές που βλέπετε στην παρακάτω εικόνα:

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

4. Μείωση στυλ

Το Blending Styles (συνήθως γνωστό ως Mode Blending σε Photoshop και Illustrator) είναι ένας πολύ καλός τρόπος για να προσθέσετε διάσταση στην εργασία σας χωρίς πολλή προσπάθεια. Σας επιτρέπει να συνδυάσετε αντικείμενα και χρώματα μαζί με διάφορους τρόπους. Οι μέθοδοι συγχώνευσης χρησιμοποιούνται συχνά με διαφορετικά επίπεδα αδιαφάνειας. για παράδειγμα, κατά την εφαρμογή μιας φωτογραφικής υφής σε μια εικόνα, την οποία θα συζητήσουμε αργότερα.

Φαίνεται ότι υπάρχουν τρία σχήματα σε αυτό το branding, αλλά στην πραγματικότητα υπάρχουν μόνο δύο: μπλε και κόκκινο. Ένας τρόπος ανάμειξης έχει εφαρμοστεί στα σχήματα για να επιτρέψει στο φόντο με υφή να εμφανιστεί, ανακατεύοντας τα χρώματα και δημιουργώντας ένα ζωντανό σκούρο μωβ.

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

Αυτό το υπέροχο κομμάτι εργασίας επαναλαμβάνει απλά σχήματα και χρησιμοποιεί διαφορετικούς τρόπους ανάμειξης για να κάνει κάθε σχήμα μοναδικό. Οι μέθοδοι συνδυασμού έχουν επίσης εφαρμοστεί στη τυπογραφία.

Οι δύο κύκλοι σε αυτό το σχέδιο έχουν διαφορετικούς τρόπους ανάμειξης που εφαρμόζονται σε αυτά, ένας από τους οποίους προβάλλει μια κόκκινη απόχρωση πάνω στην εικόνα κάτω, η άλλη εκ των οποίων αλλάζει την εικόνα κάτω από ένα σκούρο κόκκινο και οι δύο επιτρέπουν στην υφή να εμφανιστεί. Δημιουργείται ένα ζωντανό κόκκινο, όπου συναντώνται τα δύο σχήματα.

Αυτό το κομμάτι της Γκαλερί Open Γιόγκα είναι ένα από τα αγαπημένα μου στην βιτρίνα. Συνδυάζει ένα απαλό και περιορισμένο συνδυασμό χρωμάτων με μια φωτογραφία και στη συνέχεια προσθέτει θόρυβο, ελαφριά υφή και κομψή τυπογραφία.

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

Αυτό το κομμάτι είναι γεμάτο υφή. Ένας τρόπος ανάμειξης εφαρμόστηκε σε κάθε υφή για να επιτραπεί η εμφάνιση της εικόνας κάτω.

Παρόμοια με την φωτογραφία της Ιταλίας που είδαμε, αυτή η φωτογραφία χειρίστηκε χρησιμοποιώντας ένα στρώμα γεμάτο χρώμα με μια λειτουργία ανάμειξης. Το στυλ έχει ένα στρώμα διαφορετικών χρωματιστών στυφλίδων, πιθανότατα με ένα τρόπο ανάμειξης επικάλυψης που εφαρμόζεται σε αυτά και με μειωμένη διαφάνεια.

Ο κύκλος στη μέση αυτού του κομματιού έχει έναν τρόπο ανάμειξης που εφαρμόζεται σε αυτό, επιτρέποντας την εμφάνιση του φόντου.

Μίνι-Tutorials

Πώς να συνδυάσετε χρώματα με φωτογραφίες χρησιμοποιώντας το Adobe Photoshop

Σε αυτό το mini-tutorial, θα εφαρμόσουμε χρώμα σε μια ασπρόμαυρη φωτογραφία χρησιμοποιώντας το εργαλείο Brush και λειτουργίες ανάμειξης. Θα το χρησιμοποιήσω αυτή η φωτογραφία αράχνη .

Ανοίξτε ένα νέο έγγραφο του Photoshop και τοποθετήστε τη φωτογραφία της επιλογής σας στον καμβά. Έχω δώσει με τα λευκά μου σύνορα.

Επιλέξτε μαλακή βούρτσα και χρώμα φωτός. Έχω επιλέξει ένα κίτρινο παστέλ. Δημιουργήστε ένα νέο στρώμα πηγαίνοντας στο Layer → New Layer. Χρωματίστε ένα μεγάλο στρώμα του χρώματος σας στο νέο στρώμα, όπως φαίνεται εδώ:

Επαναλάβετε τη διαδικασία με περισσότερα χρώματα. Μπορείτε να βάψετε αυτά τα χρώματα στο ίδιο στρώμα - δεν χρειάζεται να δημιουργήσετε νέα στρώματα.

Αφού τελειώσετε με το χρωματισμό του στρώματός σας, μεταβείτε στο στοιχείο Φίλτρο → Θόλωμα → Gaussian Blur. Διαστρέψτε το στρώμα για να συγχωνεύσετε αυτά τα χρώματα λίγο περισσότερο. Οτιδήποτε πάνω από 100 εικονοστοιχεία θα είναι εντάξει, αλλά εξαρτάται από το μέγεθος του καμβά σας: όσο μεγαλύτερο είναι ο καμβάς, τόσο περισσότερα εικονοστοιχεία θα χρειαστεί να το θολάρετε.

Τώρα μπορούμε να αλλάξουμε τη λειτουργία ανάμειξης του στρώματος. Από το αναπτυσσόμενο μενού της λειτουργίας ανάμειξης στην παλέτα στρωμάτων, επιλέξτε "Επικάλυψη".

Μειώστε την αδιαφάνεια του έγχρωμου στρώματος σας σε περίπου 50%. Θα πρέπει να καταλήξετε σε κάτι τέτοιο:

Ο πειραματισμός είναι το κλειδί. κάθε τρόπος ανάμειξης αλλάζει το τελικό προϊόν, πράγμα που σημαίνει ότι ποτέ δεν θα μπορείτε να αναπαραγάγετε ένα αποτέλεσμα. Το παρακάτω παράδειγμα χρησιμοποιεί την οθόνη της μεθόδου ανάμειξης, η οποία πλένει τη φωτογραφία και την κάνει να δείχνει ρετρό. Ο πειραματισμός με εφέ όπως αυτό είναι συνήθως το πώς αναπαράγονται τα εφέ Lomo και Holga.

Πόροι

Παρακάτω είναι μια μικρή επιλογή από μαθήματα αφίσας vintage που κάνουν χρήση των στυλ ανάμειξης:

5. Υφή και θόρυβος

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

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

Αυτή η καθαρή υφή τελικά παράγει ένα καθαρό σχέδιο. Η ρετρό εμφάνιση επιτυγχάνεται με μια ελαφριά βούρτσα grunge για να αφαιρέσετε μερικές περιοχές του λογότυπου και της τυπογραφίας.

Η υφή του χαρτιού έχει χρησιμοποιηθεί υπερβολικά σε αυτό το κομμάτι για να παράγει ένα φθαρμένο ψηφιακό κομμάτι της εργασίας.

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

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

Η υφή σε αυτό το web design είναι ελάχιστη και λεπτή, αλλά παρόλα αυτά συμβάλλει σημαντικά στο οπτικό ενδιαφέρον του συνολικού έργου.

Η υφή χρησιμοποιείται εδώ για να ζωντανέψει το φόντο και την τυπογραφία. Η απλούστερη υφή, αλλά ακόμα τόσο αποτελεσματική.

Η υφή έχει χρησιμοποιηθεί ελάχιστα για να ζωντανέψει αυτή την εικόνα, να της δώσει βάθος και να την κάνει πιο ελκυστική στο μάτι.

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

Αυτό το κομμάτι είναι αρκετά διαφορετικό από τα άλλα σε αυτήν την βιτρίνα. η υφή δεν είναι φωτογραφία, αλλά εικόνα διάνυσμα.

Πόροι

Η λίστα που ακολουθεί περιέχει συνδέσμους σε αρκετές μεγάλες ιστοσελίδες όπου μπορείτε να κατεβάσετε υφές - τόσο premium όσο και δωρεάν - για χρήση στην εργασία σας:

TextureVault
Μια premium αγορά ειδικά για τη λήψη ατομικών υφών. Η τιμή ποικίλλει ανάλογα με το μέγεθος της υφής.
Lost & Taken
Ένα μεγάλο blog που δημοσιεύει μερικές από τις καλύτερες υφές γύρω. Κάποια πράγματα πραγματικά υψηλής ποιότητας εδώ. Μπορείτε επίσης να δείτε το υφές σε μια γκαλερί .
CG Textures
Πιθανώς μια από τις μεγαλύτερες γκαλερί υφής γύρω. Χιλιάδες εικόνες διατίθενται δωρεάν.
TextureLovers
TextureLovers είναι βασικά μια γκαλερί υφές από όλο τον ιστό. Είναι ένα εξαιρετικό μέρος για να πάει αν δεν είστε σίγουροι για το πού να κοιτάξετε, επειδή προβάλλει υφές από διάφορες ιστοσελίδες.

6. Περικοπή εικόνας και μάσκες στρώματος

Οι περικοπές εικόνων και οι μάσκες στρώματος είναι αποτελεσματικές για την προσθήκη επιπλέον στοιχείων σε μια εργασία. Γιατί να συμπεριλάβετε μια ολόκληρη φωτογραφία όταν μπορείτε απλά να δείξετε τι χρειάζεστε ή να το στυλ να ταιριάζει με το υπόλοιπο έργο; Η απλότητα είναι το κλειδί του ρετρό σχεδιασμού.

Αυτό το κομμάτι κάνει μεγάλη χρήση της υφής και των τυπογραφικών αποτελεσμάτων και χρησιμοποιεί έξυπνα μια μάσκα στρώματος για να ολοκληρώσει μια εικόνα του γαλαξία. Φαίνεται υπέροχη.

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

Αυτό το κομμάτι είναι εξαιρετικά μινιμαλιστικό, αλλά φαίνεται εξαιρετικό. ?

σχέδιο σχεδιασμός ιστοσελίδων ρετρό σοδειά ντρίμπλα