Βασικές συμβουλές για τη μετατροπή ενός επιτραπέζιου χώρου σε κινητό
Δεδομένου ότι οι κινητές συσκευές έχουν πλέον ξεπεράσει την επιφάνεια εργασίας σε δημοτικότητα, είναι απαραίτητο να σχεδιάζουν οι σχεδιαστές με κινητό στο μυαλό. Το κινητό-πρώτο είναι δημοφιλές ως μια τεχνική, επειδή είναι ευκολότερο να κλιμακωθεί το κινητό μέχρι, από την κλίμακα desktop κάτω.
Ωστόσο, μερικές φορές η επιλογή αφαιρείται από τα χέρια σας. Συνήθως οι σχεδιαστές βρεθούν να προσαρμόζουν τα υπάρχοντα σχέδια επιφάνειας εργασίας σε κινητά. Και επειδή ορισμένα στοιχεία δεν μεταφράζουν καλά, είναι απαραίτητο οι σχεδιαστές να καταλάβουν τι συγκεκριμένες προσαρμογές πρέπει να κάνουν κατά το σχεδιασμό για τη μικρή οθόνη. Εδώ είναι πώς ...
Αγκαλιάστε τον μινιμαλισμό
Ο μινιμαλισμός είναι δημοφιλής στον σχεδιασμό ιστοσελίδων εδώ και χρόνια, απλώς και μόνο επειδή συχνά βοηθά τη χρηστικότητα και μοιάζει ωραίο. Όσον αφορά την κινητή τηλεφωνία, όμως, ο μινιμαλισμός είναι λιγότερο αισθητικής επιλογής, καθώς βασίζεται αποκλειστικά στη χρηστικότητα.
Σύμφωνα με τον Όμιλο Nielsen Norman, τα χαρακτηριστικά κοπής είναι μια αναγκαιότητα σε κινητό σχεδιασμό. Τι σημαίνει αυτό για τους σχεδιαστές καθώς προσπαθούν να δημιουργήσουν έναν ιστότοπο για κινητά από μια ήδη καθιερωμένη επιφάνεια εργασίας;
Αυτό σημαίνει ότι πρέπει να καταργήσετε αυτό που δεν είναι απαραίτητο για την εμπειρία των κινητών χρηστών. Για παράδειγμα, εάν μεταβαίνετε σε ένα κατάστημα ηλεκτρονικού εμπορίου από επιφάνεια εργασίας σε κινητό, διατηρήστε την ίδια ποσότητα προϊόντων που εμφανίζεται στον ιστότοπο του κινητού. έχει νόημα μόνο επειδή οι αγοραστές θέλουν να βρουν τα πάντα που ένα ηλεκτρονικό κατάστημα έχει να προσφέρει, ακριβώς όπως το ηλεκτρονικό κατάστημα θέλει να δείξει ό, τι έχει να πουλήσει στους επισκέπτες του site. Ένα μεγάλο διαφημιστικό καρουζέλ για τις τελευταίες προσφορές, ωστόσο, θα μπορούσε εύλογα να μειωθεί κάπως.
Απόκρυψη πλοήγησης
Ένα από τα πιο κοινά χαρακτηριστικά στις κινητές οθόνες είναι το μενού χάμπουργκερ, το σχεδόν πανταχού παρόν μικρό εικονίδιο με τρία οριζόντια τμήματα γραμμής συσσωρευμένα το ένα πάνω στο άλλο. Αυτή είναι μια άλλη ιδανική περίπτωση όπου το μικρότερο μέγεθος οθόνης των σχεδιαστών κινητών δυνάμεων να αλλάξει γύρω από τα στοιχεία που αναμένεται να φανούν ορισμένο τρόπο στους επιτραπέζιους υπολογιστές.
Παρά τη διχασμένη άποψη για την παρουσία του μενού του χάμπουργκερ, είναι σχεδόν πανταχού παρούσα σε κινητές οθόνες απλώς και μόνο επειδή αυτή είναι η καλύτερη λύση που έχουν βρει οι σχεδιαστές για να μειώσουν το μενού πλοήγησης από επιτραπέζιους υπολογιστές σε κινητές συσκευές.
Ελέγξτε την φημισμένη ιστοσελίδα του σεφ του Bobby Flay για την αλυσίδα του που ονομάζεται Burger Palace του Μπόμπι. Όπως αναμενόταν, το μενού πλοήγησης είναι οριζόντια τοποθετημένο στην κορυφή της αρχικής σελίδας, αλλά όταν πηγαίνετε στην έκδοση για κινητά του ιστότοπου, το οριζόντιο μενού εξαφανίζεται. Στη θέση του είναι το καθαρό και τακτοποιημένο μενού χάμπουργκερ, ακριβώς στην ίδια θέση της οθόνης, όπου το μεγαλύτερο οριζόντιο μενού θα ήταν στην έκδοση desktop.
Η Walmart κάνει επίσης χρήση του μενού χάμπουργκερ στη μετάβαση από το γραφικό σε κινητό.
Στην επιφάνεια εργασίας της, το Walmart εμφανίζει την αναπτυσσόμενη λίστα "Όλα τα Τμήματα" που ανοίγει ένα δεύτερο επίπεδο επιλογών πλοήγησης, όλα στην ίδια σελίδα. Ωστόσο, στην περιοχή του κινητού δεν είναι δυνατή η λειτουργία λόγω του μικρού μεγέθους οθόνης, οπότε έχει σχεδιαστεί μια αντικατάσταση: το δεύτερο στρώμα επιλογών πλοήγησης είναι στο μενού του χάμπουργκερ και αυτές ανοίγουν όλο και περισσότερες επιλογές πλοήγησης με κάθε επιλογή -Όπως στρέφοντας τις σελίδες ενός βιβλίου από αριστερά προς τα δεξιά.
Μεταβείτε σε μια στήλη
Σύμφωνα με το γεγονός ότι το απλούστερο είναι ακριβώς καλύτερο όταν πρόκειται για κινητό σχεδιασμό, θα κάνετε καλά για τους πελάτες σας, αν θυμάστε ότι μια διάταξη μιας στήλης είναι καθαρότερη και ευκολότερη για τους χρήστες να λειτουργούν σε μια μικρότερη οθόνη. Το μεγάλο πλεονέκτημα μιας διάταξης μιας στήλης είναι ότι απομακρύνετε την οριζόντια κύλιση, σαν να είχατε πολύ κείμενο σε μια σελίδα και ήθελε οι αναγνώστες σας να σπρώξουν την οθόνη από αριστερά προς τα δεξιά για να διαβάσουν.
Όταν εισάγετε μια διάταξη μιας στήλης, βελτιώνετε την εμπειρία των χρηστών, ενθαρρύνοντας τους χρήστες να κάνουν απλά κύλιση προς τα κάτω για να διαβάσουν ή να κάνουν κλικ σε έναν σύνδεσμο που θέλουν να δουν σε μια νέα σελίδα. Αυτό χτυπά τους αναγκάζοντας τους να σπρώξουν από αριστερά προς τα δεξιά, κάτι που είναι πιο δύσκολο από απλώς να μετακινηθείτε προς τα κάτω, ειδικά όταν θεωρείτε τη θέση του αντίχειρα του χρήστη σε σχέση με τον τρόπο που κατέχουν μια κινητή συσκευή.
Ο ιστότοπος της επιφάνειας εργασίας της εφημερίδας The New York Times διαθέτει πολλές στήλες. Αυτό είναι εύκολο στη χρήση σε μια επιφάνεια εργασίας, όταν οι χρήστες του πελάτη σας μπορούν απλά να μετακινήσουν τον κέρσορα από τα αριστερά προς τα δεξιά χωρίς προβλήματα σε ένα trackpad ή ποντίκι.
Φυσικά, ο κινητός ιστότοπος The New York Times κατανοεί πώς πρέπει να αλλάξουν τα πράγματα σε μικρότερες οθόνες, οπότε εισάγει ένα καθαρό και αποτελεσματικό σχεδιασμό μονής στήλης που ενισχύει την εμπειρία των χρηστών, καθώς οι αναγνώστες μπορούν απλά να μετακινηθούν προς τα κάτω για περισσότερο περιεχόμενο με τους αντίχειρές τους .
Προβληματισμοί για κινητά
Λόγω της επιρροής του κινητού στους χρήστες σήμερα, οι σχεδιαστές πρέπει πάντα να σχεδιάζουν για κινητά. Δεν είναι αρκετά καλό να σχεδιάσετε απλά έναν ιστότοπο για κινητά μαζί με τον ιστότοπο της επιφάνεια εργασίας και να καλέσετε ότι σχεδιάζετε για κινητά, όμως!
Ο σχεδιασμός για κινητά σημαίνει πραγματικά να είστε προσεκτικοί για τις συγκεκριμένες προσαρμογές που θα πρέπει να κάνετε για τον ιστότοπο του πελάτη σας όταν σχεδιάζετε για τη μικρή οθόνη. Αυτό περιλαμβάνει όλα όσα μιλήσαμε παραπάνω, από τον μινιμαλισμό στο σχεδιασμό έως το κρύψιμο της γραμμής πλοήγησης για τη μετάβαση σε μια μονή στήλη διάταξη.
Με την υιοθέτηση αυτών των βέλτιστων πρακτικών στο σύνολο δεξιοτήτων σας, θα δημιουργήσετε ιστότοπους που είναι ιδανικοί για κινητά.