Σύμφωνα με το Statista.com, το 2020, το 85% των καταναλωτών παγκοσμίως έκαναν τις αγορές τους online και το 2021 1 στους 4 ανθρώπους παγκοσμίως ψωνίζουν online. Λαμβάνοντας αυτά υπόψη, διαβάστε παρακάτω τα best practices στο ecommerce ux για να αξιολογήσετε και να βελτιώσετε το περιβάλλον του eShop σας, εισάγοντάς το στην νέα ψηφιακή εποχή αγορών. Χρησιμοποιώντας το παράδειγμα ενός πολύ καινούριου Magento eshop, δείχνουμε στην πράξη με παραδείγματα κάποια από τα points.
Η σχέση μεταξύ ανθρώπου και υπολογιστή
Οι υπολογιστές έχουν γίνει εδώ κι αρκετό διάστημα ένα σημαντικό κι ίσως πλέον αναπόσπαστο κομμάτι της καθημερινότητάς μας, γι’ αυτό άρχισαν από νωρίς να γίνονται πολλές μελέτες για τη σχέση που έχει ο άνθρωπος με τον υπολογιστή, τη διάδρασή τους, αλλά και πως επηρεάζεται αυτή μέσα από απλά παραδείγματα της καθημερινότητας, όπως την αύξηση των πωλήσεων ενός eShop με ένα καλό UX. Στο κέντρο των ερευνών βρίσκεται η διάδραση που γίνεται μέσω μιας διεπαφής, δηλαδή μέσω ενός κατάλληλου λογισμικού και υλικού. Φυσικά, σε αυτά περιλαμβάνονται η σχεδίαση, η υλοποίηση και η αξιολόγηση κάθε διεπαφής σε σχέση με την εργασία του χρήστη.
Πώς αξιολογείται και βελτιώνεται ένα περιβάλλον eShop;
Μέσα από αυτές τις έρευνες οι ειδικοί κλήθηκαν να βρουν έναν τρόπο αξιολόγησης των διεπαφών για να μπορούν να τις βελτιώσουν. Όλα ξεκινούν από κάποιους συγκεκριμένους όρους, αυτούς της χρηστικότητας, της ευχρηστίας και της χρησιμότητας μίας διεπαφής, που προκύπτει από τον συνδυασμό των δύο πρώτων όρων.
Ο πρώτος όρος, όπου αρχίζουν όλα, είναι αυτός της χρηστικότητας, που ορίζεται ως η δυνατότητα χρήσης ενός αντικειμένου, στη δική μας περίπτωση μιας διεπαφής, για την εκτέλεση μιας εργασίας. Με άλλα λόγια αν το αντικείμενο κάνει τη δουλειά για την οποία σχεδιάστηκε να κάνει. Για να καταφέρει, όμως, κάποιος να προσδιορίσει τον βαθμό χρηστικότητας μίας διεπαφής θα πρέπει να ανατρέξει στον όρο της ευχρηστίας.
Με τον όρο αυτό περιγράφεται η αποδοτικότητα, η αποτελεσματικότητα και η ικανοποίηση που παρέχεται από ένα υπολογιστικό περιβάλλον, μια διεπαφή, στους προκαθορισμένους χρήστες του στην προσπάθεια επίτευξης των πολύ συγκεκριμένων στόχων του. Πόσο εύκολη είναι δηλαδή μία διεπαφή για τον χρήστη του. Γι’ αυτό και ο βασικός στόχος της σχεδίασης διεπαφών είναι η βελτίωση της ευχρηστίας τους, κάτι που βλέπουμε συνεχώς να κάνουν οι εταιρείες.
Αυτό γίνεται μέσω της ευρετικής αξιολόγησης, μιας μεθόδου ανάλυσης της ευχρηστίας, όπου σε έναν αριθμό αξιολογητών παρουσιάζεται ένα σχέδιο διεπαφής και γίνεται βάσει αυτών η αξιολόγηση της ευχρηστίας του.
Οι 10 Αρχές του Nielsen για τη βελτίωση ενός eShop
Πιο συγκεκριμένα, για τη μέτρηση της ευχρηστίας μίας ιστοσελίδας δημιουργήθηκαν από τον Jakob Nielsen έναν δανό σύμβουλο διαδικτυακής ευχρηστίας, οι 10 ευρετικές αρχές ευχρηστίας, αλλά και οι 5 δείκτες ευχρηστίας μιας διεπαφής. Μέσα από αυτά είναι εύκολο να εντοπίσει αν μια ιστοσελίδα είναι φιλική προς τον χρήστη, ώστε να δούμε το κατά πόσο τον βοηθάει να παραμείνει σε αυτήν και να τη χρησιμοποιήσει.
Για να γίνει πιο κατανοητή η εφαρμογή θα παρουσιάσουμε αυτές τις αρχές μέσα από μια πρόσφατη συνεργασία μας με την εταιρεία Ivy Space για τη δημιουργία του Magento eShop της.
1. Ορατότητα της κατάστασης του συστήματος
Κατά την πλοήγηση μέσα στην ιστοσελίδα και την εναλλαγή των σελίδων ο χρήστης μπορεί να εντοπίσει και να καταλάβει ότι μια σελίδα φορτώνει όταν εμφανίζεται ένας μικρός κύκλος στο κέντρο της σελίδας που περιστρέφεται. Από αυτόν τον κύκλο μπορεί ο χρήστης να καταλάβει ότι δεν υπάρχει σφάλμα στην ιστοσελίδα απλώς φορτώνει και πως η ιστοσελίδα είναι ενεργή χωρίς να έχει «πέσει». Σύμφωνα με το Interaction Design Foundation, ακόμα και το πόσο γρήγορα κινείται ο κύκλος (ή όποιο άλλο σύμβολο επιλέξετε), μπορεί να επηρεάσει την υποκειμενική αντίληψη του χρήστη για την ταχύτητα, και να θεωρήσει για παράδειγμα πως φορτώνει γρηγορότερα από ό,τι κανονικά. Αυτήν την τεχνική την εφαρμόζει και η Google στις σελίδες της.
2. Αντιστοίχιση μεταξύ συστήματος και πραγματικού κόσμου
Είναι πολύ σημαντικό να υπάρχει αντιστοίχιση του συστήματος με τον πραγματικό κόσμο για να σιγουρευτεί ο χρήστης για κάποια επιλογή του και προχωρήσει στην αγορά. Γι’ αυτό όταν σε αυτήν την ιστοσελίδα ο χρήστης σύρει τον κέρσορά του πάνω από ένα προϊόν μπορεί να δει, είτε μια φωτογραφία δείγματος του προϊόντος σε πραγματική μορφή, είτε μια φωτογραφία από ένα τελειωμένο project, όπου χρησιμοποιήθηκε σε άλλον πελάτη.
3. Έλεγχος από τον χρήστη και ελευθερία
Μία ακόμα σημαντική αρχή είναι να δίνεται στον χρήστη η ελευθερία να επιλέξει πώς θέλει να έχει το προϊόν κι όχι να του υποδεικνύει η ιστοσελίδα μία και μόνο επιλογή. Είναι καλό να δίνονται επιλογές ώστε να προσαρμοστεί το προϊόν στα μέτρα του πελάτη, όπως το χρώμα ενός ρούχου, η επιλογή να βάλει ζάχαρη ή μέλι στο τσάι που θα παραγγείλει, ή ακόμα και το πιο συνηθισμένο αν θα πληρώσει με κάρτα ή μετρητά.
Ακόμα, είναι πολύ σημαντικό να δίνονται στον χρήστη όλα τα απαραίτητα στοιχεία για να είναι σίγουρος ότι έκανε την κατάλληλη επιλογή που ήθελε. Στην Ivy Space αυτό γίνεται με την ακριβή τοποθέτηση των διαστάσεων και των πολλών φωτογραφιών που δίνονται.
4. Συνέπεια και πρότυπα
Για να είναι εύκολη η χρήση μίας ιστοσελίδας από τον χρήστη, είναι απαραίτητο θα έλεγε κανείς τα στοιχεία της ιστοσελίδας να βρίσκονται σε αναμενόμενα σημεία, όπως το καλάθι αγορών πάνω δεξιά μαζί με την επιλογή της αναζήτησης και το μενού κάπου στο κέντρο και λίγο αριστερά. Ακόμα είναι καλό να υπάρχουν και κουμπιά με ενέργειες πλοήγησης που διευκολύνουν την εμπειρία του χρήστη. Τέτοια είναι το λογότυπο που συνήθως βρίσκεται αριστερά και πάνω στη σελίδα, να οδηγεί στην κεντρική σελίδα ή το κουμπί του επαναφέρει τον χρήστη στο πάνω μέρος της σελίδας αφού κάνει scroll προς τα κάτω.
5. Πρόληψη σφάλματος
Πολύ σημαντικό για την καλύτερη χρήση της ιστοσελίδας αλλά και της επιτυχίας eShop ως προς τις αγορές του είναι η πρόληψη σφαλμάτων. Για παράδειγμα, όταν όλοι οι σύνδεσμοι οδηγούν εκεί που υποδεικνύουν ότι οδηγούν ή όταν οι λειτουργίες κάνουν αυτό ακριβώς που θα πρέπει να κάνουν, χωρίς κολλήματα και κενές σελίδες.
6. Αναγνώριση αντί για ανάκληση
Κάτι ανάλογο με τη συνέπεια και τα πρότυπα είναι και αυτή η αρχή, καθώς ο χρήστης δεν είναι ανάγκη να θυμάται συνεχώς πληροφορίες για το πως να χρησιμοποιήσει το περιβάλλον, όπως εδώ το σε ποιο σημείο θα μπει το πλάτος ή ύψος ενός προϊόντος, γιατί αυτές θα του παρέχονται συνεχώς. Είναι καλό να είναι εύκολα προσβάσιμες και ξεκάθαρες ώστε να μην δυσκολευτεί όποιος θα χρησιμοποιήσει την ιστοσελίδα.
7. Ευελιξία και Αποτελεσματικότητα χρήσης
Για να μην χρειάζονται πάρα πολλά βήματα και άσκοπα clicks, ώστε να κουράζεται ο χρήστης να κάνει την αγορά του, πρέπει να δοθεί ιδιαίτερη σημασία στην ευκολία χρήσης του eShop, ώστε να μπορεί να χρησιμοποιηθεί κι από τον πιο άπειρο χρήστη. Αυτό ισχύει, τόσο για την πρόσβαση από υπολογιστή, όσο κι από κινητό.
8. Αισθητικός και μινιμαλιστικός σχεδιασμός
Μία ακόμα πολλή σημαντική αρχή είναι κι αυτή του σχεδιασμού που δίνει και την πρώτη εντύπωση για την ιστοσελίδα στον χρήστη, μόλις την επισκεφτεί πρώτη φορά. Γι’ αυτό είναι ανάγκη να είναι όσο πιο μινιμαλιστικός και ταιριαστός αισθητικά με το brand γίνεται χωρίς μακροσκελή κείμενα που θα κουράσουν όποιον τα διαβάσει, αλλά με μία αίσθηση που θα ταιριάζει με το προϊόν. Εδώ, για παράδειγμα, κυριαρχούν τα γήινα χρώματα που παραπέμπουν στο μάρμαρο και τα πλακίδια πορσελάνης, τα βασικά προϊόντα της.
9. Βοήθεια στους χρήστες για την αναγνώριση, διάγνωση και επαναφορά από σφάλματα
Όλες οι μικρές, αλλά καθόλου ασήμαντες, λεπτομέρειες που χτίζουν μία καλή σχέση μεταξύ του χρήστη και της ιστοσελίδας είναι σε αυτήν την αρχή. Από το να μπορεί να διαγράψει ή να μετατρέψει ένα προϊόν από το καλάθι μέχρι τα ξεκάθαρα μηνύματα σφάλματος που θα κατατοπίσουν σωστά τον χρήστη. Έτσι κι εδώ θα μπορούσε κάποιος να βάλει τα τετραγωνικά μέτρα που θέλει, αλλά χωρίς να επιλέξει ποιες διαστάσεις του προϊόντος. Στην περίπτωση αυτή βγαίνει ένα pop-up μήνυμα που λέει ότι υπάρχει σφάλμα και πρέπει να γίνει μία επιλογή, ενώ ο κόκκινος αστερίσκος στη λέξη «Dimensions» υποδεικνύει την υποχρεωτικότητά του.
10. Βοήθεια και τεκμηρίωση
Είναι απαραίτητα να μπορεί να κάποιος να χρησιμοποιήσει το σύστημα χωρίς τη βοήθεια τεκμηρίωσης, ότι έχει κάνει για παράδειγμα σωστά μια παραγγελία ή ότι ξέρει πως να βρει το προϊόν που θέλει, αλλά σε κάθε περίπτωση χρειάζεται να είναι διαθέσιμες οι πληροφορίες επικοινωνίας ή όποιες άλλες πληροφορίες για τη χρήση της ιστοσελίδας. Γενικά, κάθε πληροφορία είναι καλό να είναι εύκολα προσβάσιμη, αλλά όχι ογκώδης. Γι’ αυτό τις περισσότερες φορές μπορούμε να βρούμε τέτοιου είδους πληροφορίες -email, social media, τηλέφωνο επικοινωνίας ή καρτέλα επικοινωνίας- στο κάτω μέρος της κεντρικής ή κάθε σελίδας.
Θέλετε κι άλλους τρόπους βελτίωσης;
Εκτός από τις ευρετικές αρχές ευχρηστίας, ο Nielsen ανέπτυξε και 5 σύντομους δείκτες ευχρηστίας, ώστε εφαρμόζοντας κι αυτούς στην ιστοσελίδα του κάποιος να μπορεί να έχει μια πιο ολοκληρωμένη ευρετική αξιολόγηση της ευχρηστίας.
1. Ευκολία και ταχύτητα εκμάθησης
Η ιστοσελίδα δεν χρειάζεται να έχει πολλά στοιχεία για να είναι εύκολο στον χρήστη να την μάθει, αντί να μπερδεύεται από τα πολλά της στοιχεία. Είναι σημαντικό να μην κουράζει τον χρήστη κι αυτό σχετίζεται, τόσο με τον σχεδιασμό της, όσο και με τη λειτουργία της.
To-Do: Μια φράση, μια ιδέα: K.I.S.S. (keep it simple stupid). Ο περίφημος «κανόνας των 3 click» (ο χρήστης να βρίσκει αυτό που θέλει σε max 3 clicks) έγινε τάση για κάποιο λόγο.
2. Υψηλή απόδοση εκτέλεσης λειτουργιών
Ένα βασικό στοιχείο της εποχής μας είναι μπορεί ο χρήστης να τη χρησιμοποιήσει γρήγορα. Δηλαδή, να μην κολλάει η σελίδα, αλλά και οι διαδικασίες της να μην χρειάζονται πολύ χρόνο για να εκτελεστούν. Αν δεν γίνονται γρήγορα είναι πολύ πιθανό ένας πιθανός πελάτης που έχει «ψηθεί» να αγοράσει, να εγκαταλείψει την όλη διαδικασία.
To-Do: Με αφετηρία τα εργαλεία μέτρησης ταχύτητας, εντοπίστε ποιες σελίδες είναι αργές, αλλά μη μείνετε εκεί. Ελέγξτε το site σε πραγματικές συνθήκες για να εντοπίσετε πιθανά «κολλήματα»
3. Χαμηλή συχνότητα σφαλμάτων εκτέλεσης – πλοήγηση και ευκολία ανάνηψης από αυτά
Άλλο ένα σχετικό στοιχείο με την καλή εμπειρία του χρήστη είναι και τα σφάλματα που μπορούν να προκύψουν κατά την πλοήγηση και τη χρήση της ιστοσελίδας. Αν είναι εμφανίζονται συχνά ή δεν είναι εύκολη η ανάνηψη από αυτά θα αποτελέσουν κι αυτά έναν παράγοντα για να εγκαταλείψει ο χρήστης την ιστοσελίδα.
To-Do: Χρησιμοποιήστε το Google Analytics και το HotJar για να εντοπίσετε τα συνηθισμένα προβλήματα που ανακύπτουν στην πλοήγηση και πού χάνει χρόνο ο χρήστης για να σκέφτεται την επόμενη κίνηση.
4. Διατήρηση της ικανότητα χρήσης από ευκαιριακούς χρήστες, μετά από την πάροδο κάποιου χρόνου
Επιπλέον, είναι πολύ θετικό όταν η σχεδίαση της ιστοσελίδας επιτρέπει σε έναν χρήστη που δεν είναι τακτικός επισκέπτης της να μπορεί να τη χρησιμοποιήσει κι ας έχει να τη χρησιμοποιήσει για ένα μεγάλο διάστημα.
To-Do: Μην κάνετε συχνά δομικές αλλαγές (πχ. Τοποθέτηση μενού), ώστε ο χρήστης να νιώσει οικεία όταν ξαναμπεί
5. Υποκειμενική ικανοποίηση χρήση
Τελευταίο και πιο γενικό είναι η συνολική εμπειρία που έχει ο χρήστης από την ιστοσελίδα σας να του αφήνει μια καλή «επίγευση», ώστε να θέλει να τη χρησιμοποιήσει ξανά και να σας επιλέξει στο μέλλον πιθανότητα από έναν ανταγωνιστή σας. Αυτό θα γίνει εάν δεν αντιμετωπίσει προβλήματα, εάν έχει απρόσκοπτη εμπειρία αλλά και εάν του προσφέρετε κάτι ξεχωριστό στην εμπειρία, το λεγόμενο Sizzle effect, που στα ελληνικά αποδίδεται ως «Τσιτσίρισμα» 😊
To-Do: Προσφέρετε στον χρήστη κάτι απρόσμενο που θα τον εκπλήξει και θα τον ευχαριστήσει. Σκεφτείτε πέρα από τα τετριμμένα. Για παράδειγμα, σε ένα eShop ενός petshop, μπορεί να είναι ότι σε κάποιο σημείο του εμφανίζεται ένα funny gif με σκυλάκι.
Πώς αξιολογείται ένα eShop;
Μετά από την εφαρμογή των αρχών και των δεικτών για τη βελτίωση του eShop της, μια επιχείρηση μπορεί να επαληθεύσει την αλλαγή με διάφορους τρόπους. Αυτοί μπορεί να είναι συνηθισμένοι, όπως ερωτηματολόγια, focus groups ή συνεντεύξεις, που δεν σημαίνει όμως ότι είναι και απλοί ή ότι η διαδικασία τους δε θέλει προσοχή. Εκτός από αυτούς υπάρχουν και λιγότερο διαδεδομένοι τρόποι επαλήθευσης, όπως οι θερμικοί χάρτες (heatmaps) ή μέσω εξοπλισμού οφθαλμικής εστίασης (Eyetracking), ώστε να εξεταστεί με το πρώτο ποια σημεία μιας ιστοσελίδας συγκεντρώνουν τα περισσότερα clicks και με το δεύτερο σε ποιο σημείο εστιάζει πρώτα και «μένει» περισσότερη ώρα το βλέμμα του χρήστη.
Βιβλιογραφία
Majid, E. S. A., Kamaruddin, N., & Mansor, Z. (2015, August). Adaptation of usability principles in responsive web design technique for e-commerce development. In 2015 International Conference on Electrical Engineering and Informatics (ICEEI) (pp. 726-729). IEEE.
Molich, R., & Nielsen, J. (1990). Improving a human-computer dialogue. Communications of the ACM, 33(3), 338-348.
Nielsen, J. (2005). Ten usability heuristics.
Nielsen, J., & Molich, R. (1990, March). Heuristic evaluation of user interfaces. In Proceedings of the SIGCHI conference on Human factors in computing systems (pp. 249-256).
Shneiderman, B., Plaisant, C., Cohen, M. S., Jacobs, S., Elmqvist, N., & Diakopoulos, N. (2016). Designing the user interface: strategies for effective human-computer interaction. Pearson.
