Πώς να δημιουργήσετε τη δική σας γραμματοσειρά για windows. Πώς να δημιουργήσετε τη δική σας χειρόγραφη γραμματοσειρά. FontCreator στα ρωσικά - δημιουργία γραμματοσειρών

Γεια σε όλους.
Πριν από λίγο καιρό, για να γίνουμε δεκτοί στις εξετάσεις, αντιμετωπίσαμε ένα πρόβλημα - όλοι όσοι είχαν χάσει μαθήματα έπρεπε να υποβάλουν δοκίμια γραμμένα με το χέρι. Για 1-2 περάσματα 1 δοκίμιο, 2-5 περάσματα 2 δοκίμια, και ούτω καθεξής. Κάθε περίληψη είναι τουλάχιστον 10 φύλλα. Η εύρεση μιας περίληψης για ένα θέμα στο Διαδίκτυο δεν είναι δύσκολη, αλλά πώς μπορείτε να μεταφέρετε το όλο θέμα στο χαρτί με την ελάχιστη προσπάθεια;Πολλές ρωσικές χειρόγραφες γραμματοσειρές βρέθηκαν στο Διαδίκτυο (σύνδεσμος). Αλλά, μετά τη λήψη πολλών αντιγράφων αυτών των γραμματοσειρών, έγινε σαφές ότι κανείς δεν θα πίστευε στην αυθεντικότητα όσων γράφτηκαν και δεν μπορούσατε να περάσετε ένα απλό τεστ από τον δάσκαλο όταν σας ζήτησε να γράψετε κάτι με τον ίδιο χειρόγραφο.Ως εκ τούτου αποφασίστηκε φτιάξτε τη δική σας χειρόγραφη γραμματοσειρά. Αλλά πώς να φτιάξετε μια γραμματοσειρά από το χειρόγραφό σαςγια να μην τον ξεχωρίσει κανείς και να δείξετε ήρεμα ότι εσείς γράψατε;
Η λύση βρέθηκε - το υπέροχο πρόγραμμα High-Logic FontCreator Professional 9

Χειρόγραφη γραμματοσειρά


Εγκαθιστούμε το Font Creator, νομίζω ότι δεν πρέπει να υπάρχουν προβλήματα με αυτό.

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


  1. Σαρώνουμε (κατά προτίμηση) ή φωτογραφίζουμε το αλφάβητο που προκύπτει.

  2. Σε Paint, Photoshop ή οποιοδήποτε άλλο πρόγραμμα επεξεργασίας γραφικών, ανοίξτε το σαρωμένο (φωτογραφημένο) αλφάβητό μας.

  3. Εκκινήστε το εγκατεστημένο Font Creator:


  • Κάντε κλικ στο αρχείο (Αρχείο) - νέο (Νέο) ή Ctrl + N



  • Δίνουμε ένα όνομα στη γραμματοσειρά μας από χειρόγραφο (γραμματοσειρές μου. ru ), επιλέξτε Κανονικό και Να μην συμπεριλαμβάνονται περιγράμματα (για κενό περίγραμμα σιλουετών).


  • Εμφανίζεται ένα παράθυρο με σιλουέτες πινακίδων, αγγλικών γραμμάτων και κάποιου άλλου αλφαβήτου. Τώρα ας προσθέσουμε τα γράμματα του ρωσικού αλφαβήτου:


1. Κάντε κλικ στην Εισαγωγή στην επάνω γραμμή και επιλέξτε Χαρακτήρες.


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

3. Επιλέξτε το γράμμα "A" και κάντε κλικ στην Προσθήκη, μετά επιλέξτε "I" και επίσης κάντε κλικ στην Προσθήκη.



4. Με τον ίδιο τρόπο, προσθέστε τα γράμματα «Ё», «ε» και γράμματα από άλλα αλφάβητα που χρειάζεστε.

5. Στο πεδίο "Προσθήκη αυτών των χαρακτήρων...", αλλάξτε το κόμμα στην παύλα μεταξύ $0410-$044F.
6. Ως αποτέλεσμα, στο πεδίο Προσθήκη αυτών των χαρακτήρων... θα πρέπει να γράφεται ως εξής: $0410-$044F,$0401,$0451

7. Κάντε κλικ στο Ok.


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

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

Τώρα ας προσθέσουμε το σαρωμένο (φωτογραφημένο) αλφάβητό μας στο πρόγραμμα Font Creator:
Αν δεν το έχετε ανοίξει ακόμα, τότε ήρθε η ώρα να το κάνετε.
Στο πρόγραμμα επεξεργασίας γραφικών, επιλέξτε το πρώτο γράμμα και αντιγράψτε ( Ctrl +C) στο Font Creator, επιλέξτε αυτό το γράμμα και κάντε κλικ στην εισαγωγή ( Ctrl + V)

Συνεχίζουμε να αντιγράφουμε και να επικολλάμε όλα τα γράμματα στη θέση τους. Ως αποτέλεσμα, έχουμε την παρακάτω εικόνα.

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

Ας καταλάβουμε γιατί χρειάζονται:
Η χαμηλότερη γραμμή 1 (Win Descent) είναι το μέγιστο όριο για γράμματα με ουρά (ts, y, shch, z, r, d) δεν θα εκτυπωθούν όλα κάτω από αυτήν τη γραμμή.
Η γραμμή 2 (Baseline) είναι η γραμμή υποστήριξης κάθε γράμματος. Όλα τα γράμματα πρέπει να βρίσκονται σε αυτή τη γραμμή.
Γραμμή 3 (x-Ύψος) - μέγιστο ύψος μικρών γραμμάτων.
Γραμμή 4 (CapHeight) - το μέγιστο ύψος μεγάλων γραμμάτων, αριθμών, καθώς και των γραμμάτων "c", "d", "b".
Γραμμή 5 (WinAscent ) - το ανώτερο όριο χαρακτήρων, όλα πάνω από αυτή τη γραμμή δεν θα εκτυπωθούν.
Η αριστερή (6) και η δεξιά (7) κάθετες γραμμές καθορίζουν τον τρόπο με τον οποίο τα γράμματα της γραμματοσειράς σας θα αγγίζουν το ένα το άλλο. Εάν θέλετε τα γράμματα να αγγίζουν το ένα το άλλο όπως στο χειρόγραφο, μετακινήστε το γράμμα κοντά στο αριστερό (6) και μετακινήστε το δεξί (7) πάνω στο γράμμα έτσι ώστε να γλείφει ελαφρώς πέρα ​​από τη γραμμή.

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


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

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

Δημιουργήστε τη δική σας γραμματοσειρά

Γεια σας παιδιά. Όπως υποσχέθηκα, σας λέω πώς να φτιάξετε τη δική σας γραμματοσειρά.
Θα πω αμέσως ότι δεν δίνω σύνδεσμο για να κατεβάσετε το πρόγραμμα εδώ, αλλά δεν θα σας είναι δύσκολο να το βρείτε μόνοι σας. Το πρόγραμμα ονομάζεται High-Logic Font Creator, ξεκίνησα με αυτό και είναι ο απλούστερος τρόπος να μετατρέψετε τα γράμματα που σχεδιάζετε σε πραγματική γραμματοσειρά. Εάν παρατηρήσετε τυχόν σφάλματα, παρακαλώ γράψτε, γιατί όλα αυτά έγιναν σχεδόν διαισθητικά, και δεν προσποιούμαι καθόλου την αριστοτεχνική εκτέλεση :) Και ως συνήθως, θα ανοίξουν μεγαλύτερες εικόνες κάνοντας κλικ.
Φίλοι που ασχολούνται επαγγελματικά με τις γραμματοσειρές, μην ορκίζεστε, πρακτικά δεν θα υπάρχουν όροι ή κανόνες εδώ. Η ανάρτηση προορίζεται για όσους ήθελαν πάντα να δημιουργήσουν κάτι τέτοιο, αλλά δεν ήξεραν πώς να προσεγγίσουν :)

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

Σχεδιάζω τα πάντα στο Illustrator, αλλά εξαρτάται από εσάς. Πολλοί άνθρωποι απλώς γράφουν σε χαρτί και σαρώνουν, αυτό είναι επίσης μια επιλογή.
Στη συνέχεια, πρέπει να αποθηκεύσετε κάθε γράμμα ξεχωριστά. Αυτό ήταν, τώρα ανοίξτε το πρόγραμμα.
Η πρώτη μας ενέργεια είναι αρκετά προφανής: Αρχείο - Νέο... Βλέπουμε το παράθυρο:

Στο παράθυρο, πληκτρολογήστε το όνομα της γραμματοσειράς μας στο πεδίο Επωνυμία γραμματοσειράς, επιλέξτε Unicode, Κανονικό, Να μην περιλαμβάνονται περιγράμματα. Αυτές είναι οι ρυθμίσεις μου :)
Κάντε κλικ στο OK, βλέπουμε ότι έχει ανοίξει ένα πρότυπο γραμματοσειράς με όλα τα πιθανά γράμματα, αριθμούς και άλλα σύμβολα.

Δεν θυμάμαι ποια είναι η προεπιλεγμένη γραμματοσειρά, έχω το σύνολο προτύπων γραμματοσειράς Arial. Για να αλλάξετε τη γραμματοσειρά, να προσθέσετε γράμματα, πρέπει να μεταβείτε στην επιλογή Εισαγωγή - Χαρακτήρες, βρίσκεται στον επάνω πίνακα. Μπορείτε επίσης να προσθέσετε κυριλλικό, αλλά δεν θα το κάνουμε προς το παρόν.
Στη συνέχεια, το πιο σημαντικό πράγμα είναι να προσθέσουμε τα γράμματά μας. Βρείτε το κεφαλαίο γράμμα Α και κάντε διπλό κλικ πάνω του.
Βλέπουμε ένα παράθυρο με ένα σωρό κελιά και ρίγες.

Πανικοβαλλόμαστε, ελαχιστοποιούμε το πρόγραμμα, παίρνουμε μια βαθιά ανάσα και επιστρέφουμε. Τώρα η Ντίνα θα τα εξηγήσει όλα.
Κάθε λωρίδα έχει το δικό της σκοπό, αλλά πρώτα τα πράγματα. Σε αυτό το παράθυρο, κάντε δεξί κλικ οπουδήποτε και κάντε κλικ στην Εισαγωγή εικόνας.
Θυμόμαστε πού αποθηκεύσαμε όλα μας τα γράμματα, βρείτε το Α μας, ανοίξτε το. Ένα άλλο παράθυρο:

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

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

Και τώρα για οριζόντιες γραμμές. Δεν θα σας επιβαρύνω με όρους, θα το εξηγήσω δημοφιλώς:
1. Η ανώτατη μπάρα είναι η μέγιστη απόσταση πάνω από τη γραμμή βάσης (4).
2. Δεύτερο από την κορυφή είναι το ύψος των κεφαλαίων γραμμάτων.
3. Το τρίτο είναι το ύψος των πεζών γραμμάτων.
4. Η γραμμή βάσης κατά μήκος της οποίας παρατάσσονται όλα τα γράμματα.
5. Μέγιστη απόσταση κάτω από τη γραμμή βάσης (4).

Για να αλλάξετε τις παραμέτρους των οριζόντιων γραμμών, πρέπει να ανοίξετε τις Ρυθμίσεις στην καρτέλα Μορφή. Συνιστώ να κάνετε Google τις παραμέτρους ορισμένων δημοφιλών γραμματοσειρών και να τις χρησιμοποιήσετε ως παράδειγμα εάν θέλετε να αλλάξετε κάτι. Αλλά δεν έκανα κάτι τέτοιο :)

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

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

Έχω ένα γράμμα Q με ουρά, δεν θέλω να ξεχωρίζει από τη γενική σειρά των γραμμάτων, οπότε το τοποθετώ στη γραμμή βάσης και αφήνω την ουρά παρακάτω.
Κάντε το ίδιο με όλα τα πεζά γράμματα (p, q, y, g, j), και μερικά, αντίθετα, μπορεί να είναι ελαφρώς υψηλότερα από το κεφαλαίο γράμμα (d, b, k, f).

Δεν χρειάζομαι αριθμούς ακόμα, οπότε η εικόνα μου μοιάζει με αυτό:

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

Λοιπόν, τώρα μπορείτε να επιδοθείτε. Τραβάμε τη χειρότερη φωτογραφία από τα πυροτεχνήματα της 9ης Μαΐου, κάνουμε μερικά μαγικά στο Photoshop, πληκτρολογούμε το κείμενο και voila! :)

Όχι τόσο δύσκολο, σωστά; Μην παραλείψετε να το δοκιμάσετε και να μας δείξετε τα αποτελέσματα :)

Για τη δημιουργία γραμματοσειρών προτείνω να χρησιμοποιήσετε ένα πρόγραμμα επεξεργασίας FontCreatorαπό την High-Logic. Θα πω αμέσως ότι το πρόγραμμα είναι πληρωμένο, αλλά αυτή είναι η καλύτερη επιλογή που τράβηξε το μάτι μου. Εάν χρειάζεστε ένα δωρεάν πρόγραμμα επεξεργασίας γραμματοσειρών, δώστε προσοχή στο πρόγραμμα Τύπος φωςαπό το cr8software και την ηλεκτρονική υπηρεσία Glyphr Studio. Θα μείνω με το FontCreator (αν δεν κάνω λάθος ήταν η έκδοση 6.0).

Βήμα 1:και έτσι, εκκινήστε το πρόγραμμα επεξεργασίας και χρησιμοποιώντας την εντολή: Αρχείο > Νέο(Αρχείο > Νέο) - δημιουργήστε μια νέα γραμματοσειρά. Στο παράθυρο που ανοίγει Νέα γραμματοσειρά (από τα Αγγλικά) Νέα γραμματοσειρά) , θα χρειαστεί να καθορίσετε έναν αριθμό παραμέτρων:

  • Όνομα οικογένειας γραμματοσειράς- όνομα της οικογένειας γραμματοσειρών, π.χ. μόνο το όνομα της γραμματοσειράς, κάτι τέτοιο Times New Roman, επεσήμανα Η γραμματοσειρά μου.
  • Σετ χαρακτήρα- ένα σύνολο χαρακτήρων που περιλαμβάνονται στη γραμματοσειρά, προτείνω να επιλέξετε Unicode (χαρακτήρες).
  • Στυλ γραμματοσειράς- στυλ γραμματοσειράς, για κάθε στυλ πρέπει να δημιουργήσετε ένα ξεχωριστό αρχείο. Για κανονικό (προεπιλεγμένο) στυλ γραμματοσειράς, επιλέξτε την επιλογή Τακτικός.
  • Προκαθορισμένα περιγράμματα- ενσωματωμένα κυκλώματα. Συνιστώ να επιλέξετε την επιλογή Να μην περιλαμβάνονται περιγράμματα, η οποία θα σας επιτρέψει να δημιουργήσετε ένα καθαρό περίγραμμα σιλουετών.

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

2.1. Χρησιμοποιώντας την εντολή: Εισαγωγή > Χαρακτήρες… (Εισαγωγή > Σύμβολα...)- Ανοιξε το παράθυρο Εισαγωγή χαρακτήρων(από τα Αγγλικά) εισαγωγή χαρακτήρων).

Σε αυτήν την περίπτωση, ενδέχεται να λάβετε το ακόλουθο μήνυμα:

Αυτή η λειτουργία δεν μπορεί να αναιρεθεί. Θέλετε να συνεχίσετε;

Σας ενημερώνει ότι η λειτουργία είναι μη αναστρέψιμη και για να την ολοκληρώσετε πρέπει να επιβεβαιώσετε την ενέργειά σας, πατήστε το κουμπί " Ναί».

2.2. Στη συνέχεια, ένας πίνακας συμβόλων θα εμφανιστεί μπροστά σας. Για ευκολία, στη λίστα Γραμματοσειρέςεπιλέξτε γραμματοσειρά Arial. Στη λίστα Μεταβείτε στο Unicode Blockεπιλέγω κυριλλικό. Χρησιμοποιώντας το πεδίο Επιλεγμένος χαρακτήρας, κοιτάζει τον κωδικό για τα γράμματα "A" ($0410) και "I" ($044F). Στο χωράφι Προσθέστε αυτούς τους χαρακτήρες ή/και το εύρος χαρακτήρων…προσθέτουμε τους απαραίτητους χαρακτήρες ή/και εύρος χαρακτήρων, στην περίπτωσή μας είναι: $0410-$044F . Κάντε κλικ στο κουμπί " Εντάξει».

2.3. Σύμβολα με κυριλλικά γράμματα θα προστεθούν στη φόρμα γραμματοσειράς σας. Με τον ίδιο τρόπο, αλλά χωριστά, μπορείτε να προσθέσετε τα γράμματα "ε" ($0451) και "Ё" ($0401), τα οποία δεν συμπεριλήφθηκαν στο εύρος των χαρακτήρων που καθορίστηκε στο προηγούμενο βήμα.

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

3.1. Για παράδειγμα, σχεδιάζω ένα κεφαλαίο γράμμα "Α".

3.2. Κατ 'αρχήν, μετά τη σάρωση, αυτό το αρχείο εικόνας μπορεί να χρησιμοποιηθεί για εισαγωγή. Για να το κάνετε αυτό, επιλέξτε την εικόνα του επιθυμητού συμβόλου στη φόρμα. Στη συνέχεια χρησιμοποιώντας την εντολή: Εργαλεία > Εισαγωγή εικόνας… (Εργαλεία > Εισαγωγή εικόνας)- Ανοιξε το παράθυρο Εισαγωγή εικόνας ράστερ (από τα Αγγλικά) εισαγωγή bitmap) .


3.3. Στο παράθυρο που ανοίγει, κάντε κλικ στο κουμπί Φορτώνω…» (από τα Αγγλικά) Κατεβάστε) και επιλέξτε το αρχείο εικόνας που χρειάζεστε.

3.4. Μετακίνηση του ρυθμιστικού Κατώφλι (από τα Αγγλικά) κατώφλι) Ρυθμίστε το επίπεδο σκουρότητας της εικόνας για να δημιουργήσετε ένα πιο καθαρό περίγραμμα. Μπορείτε επίσης να χρησιμοποιήσετε φίλτρα:

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

Λειτουργία εισαγωγής (από τα Αγγλικά) λειτουργία εισαγωγής) καλύτερα αφήστε το Ιχνος, για μετατροπή σε καμπύλες. ΜΕ Αρνητικός (από τα Αγγλικά) αρνητικός) , νομίζω ότι όλα είναι ξεκάθαρα. Κάντε λοιπόν κλικ στο κουμπί Παράγω».

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

Γενικά, η διαδικασία δημιουργίας μιας γραμματοσειράς δεν μπορεί να χαρακτηριστεί ιδιαίτερα δύσκολη. Αυτό απαιτεί υπομονή και πολύ χρόνο. Χρησιμοποιώντας το πρόγραμμα επεξεργασίας γραμματοσειρών FontCreator, αυτή η φορά μπορεί να αποθηκευτεί με πολλούς τρόπους εισάγοντας και μετατρέποντας μια εικόνα χαρακτήρα σε διάνυσμα. Ωστόσο, ακόμη και αυτή η επιλογή είναι πολύ δουλειά. Αυτό είναι το μόνο που έχω. Σας ευχαριστώ για την προσοχή σας. Καλή τύχη!

Μου φαίνεται ότι πολλοί από αυτούς που παθιάζονται με το σχέδιο γραμμάτων και τη δημιουργία γραμμάτων κάποια στιγμή σκέφτονται: δεν πρέπει να μετατρέψουμε όλη αυτή την ομορφιά σε γραμματοσειρά; Για να μπορείτε όχι μόνο να θαυμάσετε μια συγκεκριμένη σύνθεση, αλλά και να εκτυπώσετε αυτά τα όμορφα γράμματα σε ένα πραγματικό πληκτρολόγιο και να δημιουργήσετε ακόμα περισσότερη ομορφιά... Λοιπόν, τουλάχιστον έτσι ήταν για μένα :) Όταν συνειδητοποίησα ότι μπορείτε να δημιουργήσετε μια γραμματοσειρά τον εαυτό σου, κυριολεκτικά μου συνέβη μια επανάσταση της συνείδησης (μάλλον αυτό ακριβώς λέγεται "aha-moment" στα αγγλικά).

Και άρχισα να προσπαθώ να καταλάβω πώς να το κάνω αυτό. Υπήρχαν λίγες πληροφορίες και αυτό που υπήρχε ήταν ακατανόητο και περίπλοκο. Χάθηκα σε αυτό το πυκνό δάσος όρων και σχεδόν εγκατέλειψα την ιδέα να μάθω πώς να δημιουργώ γραμματοσειρές. Αλλά από θαύμα δεν τα παράτησα, συνέχισα να προσπαθώ και έφτιαξα την πρώτη μου γραμματοσειρά Bronks - κάθε άλλο παρά ιδανική, αλλά πολύ πολύτιμη από άποψη εμπειρίας. Παρεμπιπτόντως, έγραψα ήδη για το πώς δημιουργήθηκε το Μπρονξ. Και σήμερα θέλω να σας πω λεπτομερέστερα για τη διαδικασία δημιουργίας μιας γραμματοσειράς στο σύνολό της, ώστε να είναι πιο εύκολο για εσάς να καταλάβετε αν αυτή είναι η δραστηριότητά σας και αν θα σας ενδιέφερε να τη δοκιμάσετε.

Η γραμματοσειρά ΑΡΧΙΖΕΙ ΜΕ ΣΥΝΤΟΜΗ

ΤΟ ΣΧΕΔΙΟ ΓΛΥΦΩΝ ΕΙΝΑΙ ΤΟ ΕΡΓΟ ΤΗΣ ΗΜΕΡΑΣ :)

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

Το πόσο γενικά σχεδιάζω μια γραμματοσειρά —δηλαδή, πόσα γλυφά δημιουργώ— εξαρτάται άμεσα από το κοινό-στόχο. Είναι σαφές ότι όσο περισσότερα γλυφά, τόσο πιο πολύτιμη είναι η γραμματοσειρά, αλλά ταυτόχρονα υπάρχουν γλυφές για τις οποίες αξίζει να αφιερώσετε χρόνο και υπάρχουν και αυτοί που δεν είναι τόσο πολύ (για παράδειγμα, εάν δημιουργείτε μια τυπική γραμματοσειρά handdrone για τις μικρές επιχειρήσεις, η υποστήριξη ευρείας γλώσσας θα είναι πολύ πιο σχετική από όλα, όλα, όλα τα μαθηματικά σημάδια, πολλά από τα οποία, για να είμαι ειλικρινής, είδα για πρώτη φορά στο πρόγραμμα Glyphs :)). Θα μιλήσω λεπτομερώς για το ποια γλυφά πρέπει να σχεδιάζονται απαραίτητα, και ποια επιπλέον και σε ποιες ποσότητες, στο εργαστήριο για τη δημιουργία μιας γραμματοσειράς που εργάζομαι σκληρά (για αυτό στο τέλος της σημείωσης :)).

Μπορώ να πω εν συντομία ότι θα συμβούλευα να κάνετε την πρώτη γραμματοσειρά απλή και συνοπτική, διαφορετικά, εάν προσπαθήσετε αμέσως να δημιουργήσετε τόσο την αρχική όσο και την τελική έκδοση των γραμμάτων και προσθέσετε το κυριλλικό αλφάβητο στο λατινικό αλφάβητο, τότε απλά δεν θα ολοκληρώσετε η γραμματοσειρά (και αν την ολοκληρώσετε, είναι απίθανο να αποδώσει, επειδή στη δημιουργία τύπων δεν μπορείτε να κάνετε χωρίς λάθη, η δυνατότητα να δείτε μικρές κηλίδες και λεπτομέρειες που επηρεάζουν την ποιότητα της γραμματοσειράς εμφανίζεται μόνο με εξάσκηση). Επομένως, στην αρχή είναι καλύτερο να τα βγάλετε πέρα ​​με ένα τυπικό σύνολο βασικών σημείων στίξης A-Z, a-z, 0-9.

Γιατί αφιερώνω μισή μέρα για να σχεδιάσω μια γραμματοσειρά; Επειδή όταν "πιάνετε το κύμα", δηλαδή, αισθάνεστε για ένα συγκεκριμένο στυλ, την ατμόσφαιρα της γραμματοσειράς, είναι καλύτερο να σχεδιάσετε τα πάντα με μια κίνηση, ενώ το χέρι αναπτύσσεται. Αυτό μάλλον ισχύει περισσότερο για χειρόγραφες γραμματοσειρές (δεν έχω δοκιμάσει άλλες ακόμα). Εάν το αφήσετε στην άκρη και προσπαθήσετε να σχεδιάσετε τα υπόλοιπα γράμματα αργότερα, είναι σίγουρο ότι θα διαφέρουν και θα χρειαστεί χρόνος για να «συντονίσετε το χέρι σας» ξανά και να αρχίσετε να πέφτετε στο γενικό στυλ.

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

ΨΗΦΙΑΚΟ ΜΕΡΟΣ ΤΗΣ ΔΙΑΔΙΚΑΣΙΑΣ

Μόλις σχεδιαστεί η γραμματοσειρά, ήρθε η ώρα να την ψηφιοποιήσετε. Η αλυσίδα επεξεργασίας μου μοιάζει με αυτό: σαρωτής - photoshop - εικονογράφος. Στο σαρωτή βάζω τις μέγιστες ρυθμίσεις, στο Photoshop αυξάνω την αντίθεση και καθαρίζω λίγο τα περιγράμματα, στο Illustrator κάνω ένα ίχνος, βρίσκω το αλφάβητο (δηλαδή τακτοποιώ τα γράμματα με τη σειρά, προσπαθώ να "συναρμολογήσω" ένα λίγα λόγια για να ελέγξω πώς φαίνονται όλα) και καθαρό-καθαρίζω τα γράμματα.

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

Καθαρίζω γράμματα στο Illustrator με διάφορους τρόπους: πρώτον, με μια μαγική γόμα από την Astute Graphics (μέρος πρόσθετο επί πληρωμή, για το οποίο μιλάω), δυστυχώς δεν γνωρίζω μια δωρεάν εναλλακτική λύση τουλάχιστον κατά προσέγγιση ποιότητας, δεύτερον, με ένα τυπικό μολύβι εικονογράφου - επισημαίνω το περίγραμμα και το κάνω πιο ακριβές.

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

Ένα καλό πρόγραμμα γραμματοσειρών είναι σημαντικό

Η συναρμολόγηση μιας γραμματοσειράς, δηλαδή η μετατροπή διανυσματικών γραμμάτων σε λειτουργικά, το είδος που μπορεί να πληκτρολογηθεί σε ένα πληκτρολόγιο, θεωρητικά μπορεί να γίνει σε διαφορετικά προγράμματα. Αν κάνετε Google, θα βρείτε εντυπωσιακές λίστες με επιλογές για κάθε γούστο και προϋπολογισμό. Δεν παραθέτω ονόματα εδώ γιατί δεν είμαι έτοιμος να προτείνω κάτι που δεν ξέρω/δεν έχω δοκιμάσει ποτέ. Δουλεύω στο πρόγραμμα Glyphs και ξέρω μόνο ότι όλοι οι σοβαροί σχεδιαστές τύπων (όσοι πουλάνε γραμματοσειρές) τις φτιάχνουν είτε σε Glyphs είτε σε Fontlab. Αυτό πιθανότατα οφείλεται στο γεγονός ότι τα φθηνότερα/δωρεάν προγράμματα δεν παρέχουν όλες τις επιλογές που χρειάζεστε για να δημιουργήσετε ενδιαφέρουσες ιστορίες γραμματοσειράς.

Κάποτε επέλεξα το Glyphs επειδή ήθελα, αφενός, να συνηθίσω αμέσως το «σωστό» πρόγραμμα γραμματοσειρών (δηλαδή, αυτό που μπορεί να χρησιμοποιηθεί για να δημιουργήσει πραγματικά στοχαστικές, σύνθετες, πλούσιες σε στοιχεία γραμματοσειρές και να μην κολλήσει περίπου για ένα μήνα σε κάποιο δωρεάν). για να μάθω αργότερα ότι δεν μπορείτε να δημιουργήσετε απολίνωση υπό όρους εκεί), από την άλλη, δεν ήμουν έτοιμος να πληρώσω πολλές φορές περισσότερο για το Fontlab. Προφανώς, η επιλογή ήταν η σωστή - γνωρίζω ανθρώπους που άλλαξαν από το Fontlab στο Glyphs και λένε ότι το τελευταίο έχει πιο ξεκάθαρη διεπαφή :)

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

Μετά την εξαγωγή σε Glyphs, δημιούργησα πολλά διαφορετικά πράγματα: ομάδες γραμμάτων, διαστήματα (αρνητικό διάστημα στα αριστερά και δεξιά των γραμμάτων, χονδρικά), kerning (αποστάσεις μεταξύ συγκεκριμένων ζευγών γραμμάτων), προσθήκη γλωσσικής υποστήριξης, ligatures (ειδικά παραλλαγές συνδυασμών γραμμάτων), αρχικές και τελικές επιλογές (με μακριές αλογοουρές, swashes, flourishes και όλα αυτά) και εναλλακτικά σύνολα, εάν προτείνονται. Στην πορεία, ο κώδικας ρυθμίζεται έτσι ώστε όλα να λειτουργούν για τον τελικό χρήστη όπως είχα σκοπό και χωρίς προβλήματα. Αυτό το στάδιο, το οποίο περιέγραψα σε μερικές προτάσεις, είναι στην πραγματικότητα αυτό που χρειάζεται περίπου το 70% του χρόνου κατά τη δημιουργία μιας γραμματοσειράς :) Και το περιγράφω εν συντομία όχι επειδή είμαι άπληστος, αλλά επειδή μόνο για το kerning θα μπορούσατε να γράψετε μια νότα σε τρεις φορές περισσότερο από αυτό, και πάλι δεν θα είναι αρκετή. Στο μάθημα σχετικά με τις γραμματοσειρές, θα σταθώ σε όλα αυτά τα σημεία με μεγάλη λεπτομέρεια (αυτή τη στιγμή προσπαθώ να βρω τη γραμμή μεταξύ "δεν είναι αρκετά λεπτομερής" και "υπερβολικά πολλές πληροφορίες για να αφομοιώσω").

Σε αυτό το σεμινάριο άρθρου θα σας πω πώς να δημιουργήσετε τη δική σας γραμματοσειρά για έναν ιστότοπο χρησιμοποιώντας εικονίδια που δημιουργήσατε μόνοι σας. Το μόνο που χρειαζόμαστε για αυτό είναι ένα πρόγραμμα για τη δημιουργία διανυσματικών γραφικών (Adobe Illustrator ή Inkspcape) και πρόσβαση στο Διαδίκτυο!Λοιπόν, ας ξεκινήσουμε! Μπορείτε να κατεβάσετε όλες τις εικόνες, τα εικονίδια και τη γραμματοσειρά css που χρησιμοποιούνται για αυτό στο τέλος του άρθρου.

Για αυτό το σεμινάριο θα κάνουμε κάτι απλό. Για το πρώτο εικονίδιο θα σχεδιάσουμε ένα κανονικό αστέρι. Για το δεύτερο εικονίδιο - ένας αετός με το γράμμα W μέσα. Είναι αρκετά εύκολο να σχεδιάσετε και μπορείτε να δημιουργήσετε οποιαδήποτε σχήματα και συνδυασμούς. Χρησιμοποίησα το illustrator για αυτούς τους σκοπούς.

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

Για τους σκοπούς αυτούς, χρησιμοποιούμε τη δημοφιλή και δωρεάν υπηρεσία IcoMoon.

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

Τώρα έχουμε τη δυνατότητα να αλλάξουμε τον κωδικό για κάθε εικονίδιο (στην περίπτωσή μας θα είναι e600 και e601), το όνομα της γραμματοσειράς μας, το πρόθεμα CSS κ.ο.κ. Όλα αυτά γίνονται στις «Προτιμήσεις». Επίσης, μπορούμε να δούμε τη γραμματοσειρά σε δράση κάνοντας κλικ στον σύνδεσμο «Ενεργοποίηση γρήγορης χρήσης» - που θα μας επιτρέψει να λάβουμε έναν προσωρινό σύνδεσμο προς τη γραμματοσειρά μας, καθώς και την επιλογή προβολής του κώδικα στο CodePen.

Αφού ρυθμίσετε τα πάντα, κάντε κλικ στο κουμπί "Λήψη" στο κάτω μέρος της σελίδας και κάντε λήψη του αρχείου. Σε αυτά τα αρχεία θα βρείτε τη γραμματοσειρά σας σε μορφές ttf, eot, svg και woff + μια δοκιμαστική σελίδα με τη γραμματοσειρά.

Χρήση εικονιδίων στον ιστότοπο

Τώρα, το μόνο που χρειαζόμαστε είναι να συμπεριλάβουμε τη γραμματοσειρά CSS χρησιμοποιώντας το @font-face και να καθορίσουμε άλλες παραμέτρους (όλες είναι γραμμένες στο αρχείο css στο αρχείο που κατεβάσατε.

@font-face ( font-family: "wdm-eagle"; src: url("//yourwebsitename.com/fonts/wdm-eagle.eot"); , ( font-family: "wdm-eagle"; μιλήστε: κανένα; στυλ γραμματοσειράς: κανονικό; βάρος γραμματοσειράς: κανονικό; παραλλαγή γραμματοσειράς: κανονική; μετατροπή κειμένου: κανένας; ύψος γραμμής: 1; /* Καλύτερη απόδοση γραμματοσειράς =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; ) .wdm-star:before ( περιεχόμενο: "\e600"; ) .wdm-eagle:before ( περιεχόμενο: "\e601"; )

Τώρα μπορούμε να χρησιμοποιήσουμε τη γραμματοσειρά μας σε κώδικα HTML ως εξής:

Καθορισμός του ονόματος της κλάσης για την ετικέτα Παίρνουμε το εικονίδιο μας.




Μπλουζα