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

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

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

Και στα δύο οικόπεδα, ένα άτομο εισάγεται σε κάτι νέο και απροσδόκητο, η μόνη παραλλαγή είναι η άποψη από την οποία μιλάει η αφήγηση. Και στις δύο περιπτώσεις, το τόξο της ιστορίας είναι το άγνωστο που γίνεται γνωστό . Όταν ο Κλιντ Ίστγουντ βόλτες σε μια καταστραμμένη πόλη το 1800 του Αϊντάχο, η περιέργειά μας για την ταυτότητά του είναι αυτό που οδηγεί τη δέσμευσή μας. Όταν διαβάζουμε την τριλογία του Άρχοντας των Δαχτυλιδιών του Tolkien , δεν έχουμε καμία αμφιβολία ότι ο Φρόδο θα καταλήξει τελικά στο Mt Doom, το ενδιαφέρον είναι για το τι συμβαίνει στην πορεία.

Το κλειδί για την ιστορία λέει είναι ότι υπάρχει ένα άγνωστο, και ότι το άγνωστο θα γίνει γνωστό.

Οι σχεδιαστές δεν είναι ιστορικοί

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

Ο σχεδιασμός είναι στην πραγματικότητα πολύ πιο κοντά στην ποίηση. Η ποίηση τυπικά υπάρχει στα κομμάτια μεγέθους δαγκώματος και σε ποια θέματα διερευνάται τα οποία είναι ανοιχτά στην ερμηνεία.

Μακριά από την κατασκευή μιας ιστορίας, η δουλειά ενός σχεδιαστή είναι να διευκρινιστεί όσο το δυνατόν πιο απρόσκοπτα.

Χρησιμοποιώντας τα Spoilers σε Microinteractions

Ποιο είναι το πιο συναρπαστικό στοιχείο στα σαγιονάρες ; Μήπως ο Μπροντι υποστηρίζει με τον δήμαρχο; Είναι η Quint να λέει την ιστορία της Ινδιανάπολης; Είναι η υπόθεση του Hooper με την Ellen Brody (ναι, διαβάστε το βιβλίο!); Όχι. Είναι η μουσική. Μόλις ο καρχαρίας ξεκινά να παίζει τον τσέλο γνωρίζουμε ότι έρχεται, η άφιξή του κυριολεκτικά αποκαλύπτεται. [Παρεμπιπτόντως, το Jaws είναι ένα ενδιαφέρον παράδειγμα μιας ταινίας στην οποία τόσο ένας ξένος (ο καρχαρίας) έρχεται στην πόλη, και στη συνέχεια ένας άνθρωπος πηγαίνει σε ένα ταξίδι (στη θάλασσα).]

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

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

Μικρογραφίες

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

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

jackywinter

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

nacache

Bao είναι ένα ταϊβανέζικο εστιατόριο με τρεις τοποθεσίες στο Λονδίνο. Οι εικόνες τους για την τοποθεσία λειτουργούν σαν μικρογραφίες, γεγονός που υποδηλώνει όχι μόνο την εμφάνιση του εστιατορίου, αλλά και μια πιθανή εμπειρία.

bao

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

adayout

Η ανάγνωση 5 λεπτών

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

Με βάση την πρόσληψή του, ένα από τα πιο επιτυχημένα στοιχεία UI των τελευταίων ετών είναι ο χρήσιμος μικρός δείκτης που μας λέει πόσο χρόνο θα διαρκέσει ένα άρθρο για να διαβάσει. Δημοφιλή από ιστότοπους όπως το Medium, δεν υπάρχει παρακολούθηση των ματιών, ή υπολογίζεται η ταχύτητα ανάγνωσης, η εκτίμηση "5 λεπτά ανάγνωσης" βασίζεται στον αριθμό λέξεων - 125 λέξεις είναι αναμένεται να διαβαστεί σε 30 δευτερόλεπτα ή εκεί. Αλλά ακόμη και αυτά τα γενικευμένα γενικευμένα δεδομένα επαρκούν για να επιτρέπουν στους χρήστες να λαμβάνουν τεκμηριωμένες αποφάσεις σχετικά με τη δέσμευσή τους σε έναν ιστότοπο, ένα άρθρο ή ένα προϊόν.

Ο μονότονος του Αυστραλιανό ραδιόφωνο σχεδίασης είναι σπασμένο μόνο από το αντίθετο κόκκινο που χρησιμοποιείται για τις καταστάσεις του hover. Το μόνο στοιχείο που απασχολεί το κόκκινο χωρίς αλληλεπίδραση; Το playhead που διαθέτει θέση και συνολικό μήκος.

adr

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

sequoia

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

vimeo

Cinelli είναι η πιο όμορφη μάρκα ποδηλάτων της Ιταλίας. Ο ρυθμιστής προϊόντων τους διαθέτει αριθμημένα πλήκτρα «επόμενου» και «προηγούμενου». Μόνο τα βέλη θα αρκούσαν για να μεταφέρουν νόημα, αλλά οι σχεδιαστές έφεραν τα δεδομένα προς τα εμπρός με μια απλή προσθήκη στα κουμπιά.

cinelli

Προσαρμοσμένα δεδομένα

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

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

helpcout

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

γραμμή τρένων

Χάρτες και διαβεβαίωση

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

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

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

πλέγμα

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

thriva

Οι χρηματοοικονομικές συναλλαγές είναι τεχνικά περίπλοκες. Καρό ύφασμα προσφέρει μια ποικιλία προϊόντων API για προγραμματιστές. Το μενού τους δεν εξηγεί μόνο το βασικό χαρακτηριστικό κάθε προϊόντος, αλλά προεπισκόπηση δυο πιθανών λύσεων που βασίζονται σε συνδυασμούς προϊόντων.

καρό ύφασμα

Το κλειδί για την αποτελεσματική σχεδίαση UI είναι Spoilers

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

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

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