Call To Action Και Ψυχολογία Χρωμάτων

VN:F [1.9.22_1171]
Rating: 5.0/5 (3 votes cast)
FavoriteLoadingΠροσθήκη στα Αγαπημένα μου
17/02/2013 από
Zeoz

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

Ένα κουμπί CTA έχει 4 σημαντικά χαρακτηριστικά για την επίτευξη αυτού του στόχου: την τοποθέτηση, το σχήμα (και μέγεθος), το μήνυμα και το χρώμα. Σε αυτό το άρθρο θα μιλήσουμε για το θέμα του χρώματος.
Αλλά ας ξεκινήσουμε από την αρχή …

call-to-action-social-media

Τι είναι λοιπόν τα κουμπιά κλήσης-για-δράση;

Φανταστείτε ότι η ιστοσελίδα σας είναι μια ροή ενεργειών που οι χρήστες πρέπει να ακολουθήσουν για να βρουν αυτό που ψάχνουν. Για να τους διευκολύνετε, είναι απολύτως απαραίτητο να σχεδιάσετε αυτή την ακολουθία να είναι όσο το δυνατόν πιο ομαλή (δηλ. φιλική προς το χρήστη) και να τους καθοδηγήσετε προς τη σελίδα που επιθυμείτε χωρίς καμία παρέμβαση.
Επειδή ορισμένες από αυτές τις δράσεις είναι πιο σημαντικές από άλλες, θα πρέπει να ξεχωρίζουν από το υπόλοιπο περιβάλλον.Θέλετε να τραβήξετε την προσοχή του χρήστη, προσπαθώντας να τον πείσετε να κάνει μια ενέργεια(κλήση για δράση). Οι δράσεις αυτές πραγματοποιούνται κυρίως με τη βοήθεια μιας οπτικής σήμανσης, το κουμπί κλήσης-για-δράση. Μερικά παραδείγματα πιθανών δράσεων: η αγορά ενός προϊόντος, η εγγραφή σε ένα ενημερωτικό δελτίο, η δημιουργία ενός νέου λογαριασμού,η υποβολή μιας φόρμας, το κατέβασμα της τελευταίας έκδοσης ενός πακέτου λογισμικού, …

Αλλά γιατί είναι τα χρώματα τόσο σημαντικά;

Ψυχολογία των χρωμάτων

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

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

Η Susan Weinschenk, PhD.D. Ψυχολογίας και συγγραφέας του «Neuro Web Design: What Makes Them Click? (Voices That Matter), έγραψε ένα ενδιαφέρον κείμενο για αυτό.

Μην ξεχάσετε να μελετήσετε τον Τροχό Χρωμάτων του McCandless (McCandless Color Wheel).

culture

Η Kissmetrics έκανε επίσης ένα σπουδαίο infographic για το πώς τα χρώματα επηρεάζουν τις αγορές.

Λίγα πράγματα για τη θεωρία του χρώματος

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

color_wheel

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

resumator

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

Λοιπόν, τι χρώμα πρέπει να διαλέξω για το κουμπί μου;

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

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

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

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

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

Επίσης, σκεφτείτε τους ανθρώπους που έχουν αχρωματοψία. Η Ux Movement δημοσίευσε ένα ενδιαφέρον άρθρο σχετικά με αυτό.








Hide ↑

Xtnd.it Group | e-xtend your possibilities

Ripple Effects με SVG και Javascript ~ Material Design 

18 September 2015

Ενα σε βάθος tutorial για το πώς να οικοδομήσουμε  ripple effect  που περιγράφονται με βάση των προδιαγραφών σχεδιασμού της Google και να τις συνδυάσουμε[…]

Read more...

5η Έκθεση για τις Υπηρεσίες Internet Web World Expo 2015

18 September 2015

 24-25 Οκτωβρίου – Ζάππειο Μέγαρο|  

Η WebWorldExpo[…]

Read more...

WordPress Greek Community 3rd meetup

21 April 2015

Τρίτη 28/04/2015, 18:00
THE HUB EVENTS, Αλκμήνης 5, Κ. Πετράλωνα

Η ελληνική κοινότητα του WordPress είναι εδώ! Αρκετό καιρό μετά το προηγούμενο meetup[…]

Read more...






Σχόλια

dim.p

dim.p

16 March 2013


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


Αφήστε ένα σχόλιο

 






RSS για τα σχόλια σε αυτό το άρθρο.  |  TrackBack URL



 
 
 

Eταιρείες παροχής υπηρεσιών διαδικτύου




 

Το Όραμά Μας

3d2 3d2

Η νέα εποχή ξεκινάει…

Είστε έτοιμοι;

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

Ξεκινάμε μια νέα εποχή για τα Ελληνικά δεδομένα. Κοιτάμε μπροστά και οραματίζομαστε το μέλλον με αισιοδοξία σε μία πολύ δύσκολη εποχή!

Αν είστε digital artist (web designer. web developer, programmer, 3d animator, graphic designer κτλ)  δώστε λίγα λεπτά από τον χρόνο σας να διαβάσετε το παρακάτω άρθρο. Σίγουρα σας ενδιαφέρει

 
web design forum

  • Προσεγγίστε νέους αναγνώστες και φίλους
  • Αποκτήστε το δικαίωμα να προωθήστε την σελίδα σας μέσω διαφημιστικών banner στο web design forum
  • Αποκτήστε συνδέσμους και backlinks δωρεάν
  • Αυτόματη προωθηση του άρθρου σας, σε διάφορες ιστοσελίδες κοινωνικής δικτύωσης.