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

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

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

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

Πόσο σημαντικό είναι το χρώμα;

  • Το 85% των ανθρώπων ισχυρίστηκε ότι το χρώμα έχει μεγάλη επιρροή στο τι αγοράζουν.
  • Τα χρώματα ενισχύουν την αναγνώριση της μάρκας κατά μέσο όρο κατά 80%.
  • Η χρωματική εντύπωση ευθύνεται για το 60% της αποδοχής ή της απόρριψης ενός προϊόντος.

Κατά τον καθορισμό ενός συνδυασμού χρωμάτων για έναν ιστότοπο, υπάρχουν ορισμένα βήματα που περιγράφονται λεπτομερώς στο συνοδευτικό infographic:

  1. Πρωτογενές χρώμα – Επιλέξτε ένα χρώμα που ταιριάζει στην ενέργεια του προϊόντος ή της υπηρεσίας σας.
  2. Χρώματα δράσης – Αυτό λείπει από το παρακάτω infographic, αλλά ο προσδιορισμός ενός κύριου χρώματος δράσης και ενός δευτερεύοντος χρώματος δράσης είναι εξαιρετικά χρήσιμος. Εκπαιδεύει το κοινό σας να εστιάσει σε συγκεκριμένα στοιχεία διεπαφής χρήστη με βάση το χρώμα.
  3. Aεπιπλέον Χρώματα – Επιλέξτε επιπλέον χρώματα που συμπληρώνουν το βασικό σας χρώμα, ιδανικά χρώματα που κάνουν το βασικό σας χρώμα ποπ.
  4. Χρώματα φόντου – Επιλέξτε ένα χρώμα για το φόντο του ιστότοπού σας – πιθανώς λιγότερο επιθετικό από το βασικό σας χρώμα. Λάβετε επίσης υπόψη τη λειτουργία σκούρου και ανοιχτού φωτός.. Όλο και περισσότεροι ιστότοποι ενσωματώνουν συνδυασμούς χρωμάτων σε φωτεινή ή σκοτεινή λειτουργία.
  5. Χρώματα γραμματοσειράς – Επιλέξτε ένα χρώμα για το κείμενο που πρόκειται να υπάρχει στον ιστότοπό σας – θυμηθείτε ότι η μαύρη γραμματοσειρά είναι σπάνια και δεν συνιστάται.

Για παράδειγμα, η εταιρεία μου Highbridge ανέπτυξε μια διαδικτυακή επωνυμία για έναν κατασκευαστή φορεμάτων που ήθελε να δημιουργήσει έναν ιστότοπο ηλεκτρονικού εμπορίου απευθείας στον καταναλωτή όπου οι άνθρωποι θα μπορούσαν αγοράστε φορέματα online. Κατανοήσαμε το κοινό-στόχο μας, την αξία της επωνυμίας και – επειδή η επωνυμία ήταν κυρίως ψηφιακή αλλά είχε και ένα φυσικό προϊόν – εστιάσαμε σε συνδυασμούς χρωμάτων που λειτουργούσαν καλά σε όλες τις εκτυπώσεις (CMYK), παλέτες υφασμάτων (Pantone), καθώς και ψηφιακό (RGB και Hex).

Δοκιμή ενός συνδυασμού χρωμάτων με έρευνα αγοράς

Η διαδικασία επιλογής χρωμάτων μας ήταν εντατική.

  1. Κάναμε έρευνα μάρκετινγκ σε μια σειρά από βασικά χρώματα με το κοινό-στόχο μας που μας μείωσε σε ένα μόνο χρώμα.
  2. Κάναμε έρευνα μάρκετινγκ σε μια σειρά από δευτερεύοντα και τριτογενή χρώματα με το κοινό-στόχο μας, όπου περιορίσαμε ορισμένους συνδυασμούς χρωμάτων.
  3. Κάναμε μακέτες προϊόντων (συσκευασία προϊόντων, ετικέτες λαιμού και κρεμαστές ετικέτες) καθώς και μακέτες ηλεκτρονικού εμπορίου με τους συνδυασμούς χρωμάτων και παρέχαμε στον πελάτη καθώς και στο κοινό-στόχο για σχόλια.
  4. Επειδή η επωνυμία τους εξαρτιόταν σε μεγάλο βαθμό από την εποχικότητα, ενσωματώσαμε επίσης εποχιακά χρώματα στο μείγμα. Αυτό μπορεί να είναι χρήσιμο για συγκεκριμένες συλλογές ή γραφικά για διαφημίσεις και κοινοποιήσεις μέσων κοινωνικής δικτύωσης.
  5. Περάσαμε από αυτή τη διαδικασία περισσότερες από μισή ντουζίνα φορές πριν καταλήξουμε στο τελικό σχέδιο.

ντουλάπα52 χρωματικός συνδυασμός

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

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

Χρώματα, Λευκό Διάστημα και Χαρακτηριστικά Στοιχείων

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

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

Εδώ είναι ο ιστότοπος ηλεκτρονικού εμπορίου που προκύπτει με συνδυασμό χρωμάτων

  • Closet52 - Αγορά Φορέματα Online
  • Σελίδα συλλογών Closet52
  • Σελίδα προϊόντος Closet52

Επισκεφθείτε το Closet52

Χρωσιμότητα και Αχρωματοψία

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

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

Usability.gov

Η ομάδα του WebsiteBuilderExpert συνέταξε αυτό το infographic και το λεπτομερές συνοδευτικό άρθρο για Πώς να επιλέξετε ένα χρώμα για τον ιστότοπό σας αυτό είναι εξαιρετικά λεπτομερές.

Πώς να επιλέξετε ένα συνδυασμό χρωμάτων για τον ιστότοπό σας