Βασικές τάσεις σχεδιασμού, Μάιος 2017
Κάνοντας μια καλή πρώτη εντύπωση είναι ένα ζωτικό μέρος του σχεδιασμού της ιστοσελίδας. Η αρχική σελίδα είναι συχνά η πρώτη εμπειρία που έχει ένας χρήστης με μια επιχείρηση ή έναν οργανισμό και ένας εντυπωσιακός σχεδιασμός μπορεί να συμβάλει στη δημιουργία ενδιαφέροντος. Οι τάσεις αυτού του μήνα επικεντρώνονται αποκλειστικά στα στοιχεία σχεδιασμού της αρχικής σελίδας, τα οποία είναι λίγο διαφορετικά από αυτά που χρησιμοποιούνται για να βλέπουν οι χρήστες.
Από μια καθαρά αισθητική τάση στους ρηχούς κεφαλίδες ήρωας και τις διαγώνιες γωνιακές διευθετήσεις σε μια τάση αλληλεπίδρασης των χρηστών σε αυτό ή εκείνες τις προσκλήσεις για δράση, υπάρχουν πολλοί ενδιαφέροντες τρόποι για να προσελκύσουν την προσοχή των χρηστών.
Ας δούμε τι συμβαίνει στον σχεδιασμό αυτού του μήνα:
1. Μικρές κεφαλίδες ήρωας
Για μια στιγμή η τάση με εικόνες ήρωας ήταν μεγάλες, τολμηρές εικόνες και βίντεο που γεμίζουν την οθόνη, συχνά από την κορυφή της αρχικής σελίδας μέχρι δεξιά για το πού αρχίζει η μετακίνηση. Περισσότερα σχέδια αρχίζουν να αποτρέπουν αυτήν την υπερμεγέθη τάση εικόνας για ρηχύτερες εικόνες ήρωας.
Μεγάλο μέρος του σχεδιασμού εξακολουθεί να είναι το ίδιο. Οι κεφαλίδες των ηρώων εξακολουθούν να περιλαμβάνουν ωραίες εικόνες ή κείμενο με μια διαμόρφωση που έχει κατασκευαστεί για να εξεταστεί. Αλλά οι εικόνες είναι περίπου το μισό βαθύτερο.
Αυτό που είναι ωραίο για αυτή την ιδέα είναι ότι βοηθάει την μετακίνηση άλλων πληροφοριών επάνω στην οθόνη. Το αντίγραφο σώματος και οι κλήσεις προς δράση που δεν βρίσκονται στην εικόνα του ήρωα εμφανίζονται υψηλότερα στο σχεδιασμό, δίνοντας στους χρήστες κάτι να κάνουν ή να κάνουν κλικ αμέσως. Μπορεί να αποτρέψει την ακαταστασία της εικόνας, η οποία μπορεί να είναι πολύ σημαντική εάν η εικόνα είναι απασχολημένη ή δύσκολο να συνδυαστεί αποτελεσματικά με το κείμενο.
Αυτό το μοτίβο σχεδίασης μπορεί επίσης να προσθέσει περισσότερα κενά στο γενικό σχεδιασμό, καθιστώντας τον άνετο και πιο εύκολο στην πλοήγηση. Με πιο ελάχιστα στυλ ακόμα δημοφιλές, αυτή η έννοια μπορεί να είναι ένας από τους παράγοντες που οδηγεί αυτήν την απόφαση σχεδιασμού.
Το πιο σκληρό μέρος της χρήσης μιας πιο ρηχτής εικόνας ήρωας είναι η περικοπή. Είναι ένα από αυτά τα πράγματα που θα θέλετε να σκεφτείτε νωρίς στη διαδικασία σχεδιασμού, μέχρι το τέλος της ομιλίας σας με τον φωτογράφο για τις εικόνες. Επειδή το σχήμα δεν είναι το πρότυπο, ίσως χρειαστεί να εξηγήσετε πώς σχεδιάζετε να χρησιμοποιήσετε την εικόνα για να πάρετε μια φωτογραφία ή ένα βίντεο που θα φαίνονται καλά με αυτόν τον λόγο διαστάσεων.
2. Διάταξη γωνίας διαγωνίου
Ορισμένες τάσεις είναι απλά πάρα πολύ διασκεδαστικές για να αγνοήσετε. Οι διαγώνιες διατάξεις γωνιών είναι μία από αυτές τις έννοιες.
Αυτά τα σχέδια παρουσιάζονται με στοιχεία που συγκεντρώνονται σε μια γωνία της οθόνης - συχνά κάτω δεξιά - και ανεβαίνουν στον υπόλοιπο καμβά. Τα στοιχεία είναι συχνά τοποθετημένα για να μοιάζουν με αυτά που εκρήγνυνται στο σχέδιο.
Οι διαγώνιες διατάξεις γωνίας παρέχουν ένα διαφορετικό μοτίβο παρακολούθησης των οφθαλμών για τους χρήστες, δημιουργώντας ένα εστιακό σημείο στην κάτω γωνία ενός σχεδίου και όχι το πάνω αριστερό ή το κέντρο και δημιουργώντας ένα βάθος με την ιδέα των στοιχείων που φαίνεται να "εκραγούν" σε όλη την οθόνη. (Για ένα επιπλέον λάκτισμα στο σχεδιασμό, σκεφτείτε τα κινούμενα στοιχεία για να ενισχύσετε αυτό το αποτέλεσμα έκρηξης με κίνηση καθώς ο χρήστης κυλάει ή αιωρείται πάνω από συγκεκριμένα στοιχεία.)
Για να αξιοποιήσετε στο έπακρο αυτά τα στοιχεία, πολλά σχέδια "κρύβουν" περισσότερα στοιχεία κάτω από το κύλινδρο για να προσθέσουν αυτό το πρόσθετο στοιχείο της πραγματικότητας, έτσι ώστε τμήματα του σχεδίου που δεν μπορείτε να δείτε αισθάνονται αφής και υπάρχουν στο κύλινδρο.
Αν και αυτό το είδος σχεδίου δεν λειτουργεί με κάθε είδος περιεχομένου, μπορεί να είναι μια καλή ιδέα για σχέδια που δεν έχουν πολλά άλλα τέχνης και χρησιμοποιούν πολλά στοιχεία διεπαφής χρήστη για να τραβήξουν την προσοχή. Μπορεί επίσης να λειτουργήσει για σχέδια σε σχήμα χαρτοφυλακίου ή να χρησιμεύσει ως τρόπος να οργανωθούν πολλά μικρότερα οπτικά στοιχεία σε μια ενιαία μονάδα.
3. Αυτός ή εκείνος που καλεί στη δράση
Σχεδόν κάθε σχεδίαση ιστοσελίδων περιλαμβάνει κάποιους τύπους παρότρυνσης για δράση. Είτε πρόκειται για μια φόρμα για συμπλήρωση, είτε για σύνδεση με κλικ είτε για κατεύθυνση για να συνεχίσετε την κύλιση για περισσότερο περιεχόμενο, ο χρήστης θα σας ζητηθεί να κάνετε κάτι. (Και συχνά λαμβάνουν κάτι άλλο ως ανταμοιβή για αυτή την προσπάθεια.)
Περισσότερα σχέδια αρχίζουν να αναδύονται με καθρέφτη κλήση σε ενέργειες, οι οποίες επιτρέπουν στους χρήστες να κάνουν μια επιλογή από την αρχική σελίδα καθώς αποφασίζουν τι να κάνουν στη συνέχεια. Ο σχεδιασμός μπορεί να φαίνεται με διάφορους τρόπους, όπως η άμεση θα εξαπατούσατε ή να μη θέσετε ερωτήσεις Τα λόγια πονάνε στην επιλογή δύο παραθύρων από το Stoli στην πλοήγηση επιλογής κλικ για το Γεια σας Pointe Drive In .
Αυτό το στυλ σχεδίασης δίνει στους χρήστες τον έλεγχο του τι θέλουν να κάνουν και να δουν, το οποίο μπορεί να είναι ελκυστικό με το σωστό μείγμα περιεχομένου και επιλογών. Και τα τρία παρακάτω παραδείγματα κάνουν μια σπουδαία δουλειά να πλαισιώνουν τι μπορεί να κάνει ο χρήστης και τι θα συμβεί. (Υπάρχουν επίσης outs αν ο χρήστης κάνει λάθος επιλογή και πρέπει να επιστρέψει.)
Η πρόκληση εδώ είναι ότι χρειάζεστε ακριβώς το σωστό περιεχόμενο για να λειτουργήσει αυτό το σχέδιο σχεδίασης. Μερικοί χρήστες μπορούν να συγκλονιστούν από πολλαπλές επιλογές και απλά θέλουν μια μόνο κλήση για δράση με μία μόνο επιλογή - να ολοκληρώσουν τη δράση ή όχι. Εδώ, οι χρήστες έχουν δύο φορές περισσότερες επιλογές για να εξετάσουν. Για να αξιοποιήσετε στο έπακρο τις επιλογές, το περιεχόμενο πρέπει να είναι απόλυτα αφοσιωμένο.
συμπέρασμα
Σε αντίθεση με κάποιες από τις άλλες τάσεις που έχουμε διερευνήσει πρόσφατα, οι τάσεις αυτού του μήνα είναι καθαρά οπτικά στοιχεία που μπορείτε να προσθέσετε σε ένα υπάρχον σχέδιο στη μύγα. (Αν και μπορεί να έρθει κοντά αν είστε τυχεροί.)
Αυτά τα σχέδια σχεδιασμού βασίζονται λίγο περισσότερο στο σχεδιασμό του περιεχομένου και του σχεδιασμού για να ταιριάζουν, γνωρίζοντας ότι έχετε μια συγκεκριμένη ιδέα στο μυαλό. Χρειάζεται προγραμματισμό και σε ορισμένες περιπτώσεις απαιτεί ακόμη και μια μικρή HTML ή CSS μαγεία για να τα τραβήξει όλα μαζί.
Τι τάσεις αγαπάτε (ή μιλάτε) τώρα; Θα ήθελα πολύ να δω κάποιες από τις ιστοσελίδες που σας γοητεύει. Ρίξτε μου ένα σύνδεσμο στο Twitter . Θα ήθελα πολύ να σας ακούσω.