Πώς να σχεδιάσετε κενές κρατικές σελίδες για ιστότοπους και εφαρμογές για κινητά

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

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

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

Η αξία των κενών κρατών

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

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

Τα κενά κράτη δίνουν επίσης μια αίσθηση “φρεσκάδα” με νέους λογαριασμούς που δεν έχουν υπάρχοντα δεδομένα.

Αυτή η δοκιμή που έγινε από τον Redditor Bambo_Ocha έλεγξε 20 διαφορετικές εφαρμογές για κενά σχέδια. Διάφορα στυλ σχεδιασμού προέκυψαν με κουμπιά CTA, δείγματα δεδομένων και ακόμη και σύντομες οδηγίες.

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

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

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

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

Στοιχεία ζωτικής σημασίας σελίδας

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

Και ενώ το κείμενο είναι το κύριο μέσο επικοινωνίας στον ιστό, δεν μπορείτε να παραβλέψετε την αξία των γραφικών και των εικονιδίων.

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

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

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

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

Ενθάρρυνση της δραστηριότητας των χρηστών

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

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

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

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

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

Άλλοι σύνδεσμοι στη σελίδα οδηγούν στους οδηγούς και τα στοιχεία επικοινωνίας. Όλα είναι απίστευτα εξορθολογισμένα και συνδέονται μεταξύ τους ωραία.

Εφαρμογές Web έναντι κινητού

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

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

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

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

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

Κενά παραδείγματα σχεδιασμού κράτους

Ίσως ο καλύτερος τρόπος για να μάθετε για το κενό σχέδιο σχεδιασμού είναι να μελετήσετε μερικά παραδείγματα. Η λαμπρή δικτυακή γκαλερί emptystat.es καθαρίζει κενές σελίδες κατάστασης από διάφορους ιστότοπους σε κινητές εφαρμογές.

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

Ψηφιακά IP δίκτυα