Λογότυπο που δουλεύει σε πινακίδα και σε favicon

Το λογότυπο μιας μικρής επιχείρησης δεν ζει μόνο στην ιστοσελίδα. Εμφανίζεται στην καρτέλα του browser στα 16 και 32 pixel, στην αρχική οθόνη του κινητού και μέσα στη στρογγυλή φωτογραφία προφίλ στο Facebook και στο Instagram. Τυπώνεται στο τιμολόγιο και στην απόδειξη του θερμικού εκτυπωτή, που βγάζει μόνο μαύρο. Μπαίνει στην πόρτα του βαν διανομής και φωτίζεται στην πινακίδα πάνω από το κατάστημα.

Κάθε σημείο έχει τους δικούς του περιορισμούς. Στα 16 pixel οι λεπτές γραμμές και τα μικρά γράμματα εξαφανίζονται. Στο βαν, ο οδηγός που περνά δίπλα έχει λίγα δευτερόλεπτα για να το διαβάσει. Στην πινακίδα, ο περαστικός το βλέπει από το απέναντι πεζοδρόμιο.

Γι' αυτό δεν σχεδιάζουμε ένα λογότυπο αλλά ένα μικρό σύστημα, όπου κάθε εκδοχή έχει τη δική της δουλειά:

• Πλήρες λογότυπο: σύμβολο, όνομα και, όπου χρειάζεται, μια περιγραφή όπως «Οικογενειακός φούρνος από το 1985». Για την πινακίδα, την κεφαλίδα της ιστοσελίδας και τα έντυπα.
• Συμπτυγμένο σήμα: σύμβολο και όνομα χωρίς την περιγραφή, σε οριζόντια ή κάθετη διάταξη. Για την οθόνη του κινητού, την υπογραφή του email και τη σφραγίδα.
• Εικονίδιο: μόνο το σύμβολο ή ένα αρχικό γράμμα. Για το favicon, το εικονίδιο εφαρμογής και τη φωτογραφία προφίλ.

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

Η απλότητα δεν είναι θέμα γούστου αλλά αντοχής. Ένα σήμα με πολλές λεπτομέρειες μπορεί να εντυπωσιάζει στα 1.000 pixel, στην οθόνη του σχεδιαστή, και να γίνεται μια θολή κουκκίδα στην καρτέλα του browser. Τα τεστ που το αποκαλύπτουν είναι απλά:

• Σιλουέτα: γεμίζουμε το σήμα με συμπαγές μαύρο. Αν αναγνωρίζεται μόνο από το περίγραμμά του, έχει γερή βάση.
• Μικρό μέγεθος: το κοιτάμε στα 16 και 32 pixel, σε πραγματική καρτέλα browser και όχι μεγεθυμένο.
• Απόσταση: το τυπώνουμε σε Α4, το κολλάμε στον τοίχο και απομακρυνόμαστε μερικά μέτρα. Ή απλώς μισοκλείνουμε τα μάτια.
• Φτηνή εκτύπωση: φωτοτυπία, απόδειξη, σφραγίδα. Αν τα κενά μέσα στα γράμματα κλείνουν, το σήμα χρειάζεται περισσότερο αέρα.

Ό,τι δεν περνά τα τεστ απλοποιείται: λιγότερες γραμμές, πιο χοντρά πάχη, χωρίς διαβαθμίσεις και σκιές στο βασικό σήμα. Η μεγάλη πινακίδα σπάνια είναι το πρόβλημα. Το μικρό μέγεθος είναι σχεδόν πάντα.

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

• Έγχρωμη εκδοχή για λευκό ή ανοιχτό φόντο.
• Μονόχρωμη εκδοχή, μόνο μαύρο, για απόδειξη, σφραγίδα, κέντημα, χάραξη ή αυτοκόλλητο βινυλίου ενός χρώματος.
• Αρνητική εκδοχή, λευκό σε σκούρο φόντο, για το footer της ιστοσελίδας, μια σκούρα συσκευασία ή τα γράμματα στη βιτρίνα.
• Εκδοχή για φωτογραφίες: σκέτο λευκό ή μαύρο, ανάλογα με την εικόνα, ώστε να διαβάζεται πάνω σε ένα post ή ένα banner.

Κάθε χρώμα χρειάζεται και τους σωστούς κωδικούς: HEX και RGB για οθόνες, CMYK για το τυπογραφείο και Pantone όταν ένα χρώμα πρέπει να μένει σταθερό σε διαφορετικά υλικά. Χωρίς αυτούς, το ίδιο πράσινο βγαίνει σε τρεις διαφορετικές αποχρώσεις στην κάρτα, στο αυτοκόλλητο και στην οθόνη.

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

Πρακτικά σημεία που αξίζει να ελέγξετε:

• Έχει η γραμματοσειρά σωστά ελληνικά; Πολλές γραμματοσειρές σχεδιάστηκαν για λατινικά, με τα ελληνικά να προστίθενται αργότερα ή να λείπουν εντελώς. Γράμματα όπως το Σ, το Ω και το Ψ δείχνουν γρήγορα αν ταιριάζουν με τα υπόλοιπα.
• Έχουν οι δύο εκδοχές το ίδιο βάρος; Η ελληνική και η λατινική εκδοχή πρέπει να έχουν ίδιο ύψος, πάχος και ύφος, ακόμη κι αν το ένα όνομα είναι μακρύτερο, ώστε καμία να μη μοιάζει με μετάφραση της άλλης.
• Τόνοι στα κεφαλαία: λέξεις γραμμένες εξ ολοκλήρου με κεφαλαία δεν παίρνουν τόνο. Ένα «ΚΑΦΈ» με τόνο σε λογότυπο είναι λάθος που θα τυπωθεί σε εκατοντάδες κάρτες.
• Άδεια χρήσης: η γραμματοσειρά πρέπει να επιτρέπει χρήση σε λογότυπο, σε έντυπα και στο web.

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

Το λογότυπο είναι δικό σας και τα αρχεία του πρέπει να βρίσκονται στα χέρια σας, όχι μόνο στον υπολογιστή του σχεδιαστή. Όταν ο τυπογράφος, ο επιγραφοποιός ή ο επόμενος developer ζητήσει «το λογότυπο σε καλή ανάλυση», πρέπει να έχετε έτοιμη απάντηση. Ζητήστε:

• SVG για κάθε εκδοχή και κάθε χρώμα. Είναι διανυσματικό, αλλάζει μέγεθος χωρίς απώλεια ποιότητας και στην ιστοσελίδα ζυγίζει ελάχιστα, κάτι που μετράει για την ταχύτητα της σελίδας.
• Διανυσματικό PDF ή EPS για το τυπογραφείο και τις επιγραφές.
• PNG με διάφανο φόντο σε μερικά πλάτη, για email, έγγραφα Word και παρουσιάσεις.
• Σετ favicon: favicon.ico, PNG 16×16 και 32×32, 180×180 για την αρχική οθόνη του iPhone, 192×192 και 512×512 για Android.
• Εικόνα προφίλ: τετράγωνη, με το εικονίδιο στο κέντρο, ώστε να μην κόβεται στον κύκλο.
• Σελίδα ταυτότητας (brand sheet): χρώματα με όλους τους κωδικούς, ονόματα γραμματοσειρών, ελάχιστο μέγεθος, ελεύθερο χώρο γύρω από το σήμα και παραδείγματα λάθος χρήσης.

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

Μπορεί το υπάρχον λογότυπό μου να προσαρμοστεί χωρίς να αλλάξει εντελώς;

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

Αρκεί ένα PNG σε μεγάλη ανάλυση;

Όχι. Ένα PNG θολώνει όταν μεγαλώσει για πινακίδα ή όχημα, και τα χρώματά του δεν αλλάζουν εύκολα. Χρειάζεστε το διανυσματικό αρχείο (SVG, PDF ή EPS) ως αφετηρία για όλα τα υπόλοιπα.

Γιατί το favicon μου φαίνεται θολό;

Συνήθως επειδή είναι ολόκληρο το λογότυπο σμικρυμένο στα 16 pixel. Το favicon θέλει το εικονίδιο, σχεδιασμένο και ελεγμένο σε αυτό το μέγεθος, όχι μια μικρογραφία του πλήρους σήματος.