Web Design: Οι πρόσφατες σχεδιαστικές τάσεις που «ήρθαν για να μείνουν» - HDPM
Scroll
Go to Top

Web Design: Οι πρόσφατες σχεδιαστικές τάσεις που «ήρθαν για να μείνουν»

Web Design Web Trends

Minimal, UX, Mobile & Diversity (Πολυμορφία)…

Share it!

Όπως όλα, έτσι και το διαδίκτυο (περισσότερο από όλα) έχουν αλλάξει δραματικά.

Ζούμε στην εποχή του mobile.

Tα smartphones που πριν από μερικά χρόνια ήταν αναπόσπαστο κομμάτι της καθημερινότητας έχουν εξελιχθεί σε προέκταση του εαυτού μας.

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

Από την άλλη, νέες ορολογίες ήρθαν -για να μείνουν- όπως AR, VR, AI, AMP κ.α.

Όπως σε όλα λοιπόν έτσι και στις τάσεις του web design θα δούμε κάποιες σημαντικές αλλαγές -ίσως όχι τόσο κραυγαλέες- τις οποίες αξίζει να σημειώσουμε. Βλέπουμε -με χαρά- ας πούμε να εγκαταλείπεται σιγά – σιγά η τάση των stock photos (τι μάστιγα;…) οι πολύ ασύμμετρες διατάξεις γραμμών στους ιστότοπους (άλλη μάστιγα…) και η πανσπερμία χρωμάτων. Από την άλλη, η αναζήτηση μέσα στους ιστότοπους παίρνει χαρακτήρα πιο «βαθύ» και πιο «έξυπνο». Συν κάποιες τάσεις σχεδιασμού που επίσης -και λόγω mobile- «αγαπήθηκαν» (βλέπε hamburger menus)…

Επιγραμματικά λοιπόν για το σας παρουσιάζουμε έχουμε τις επικρατέστερες τάσεις σχεδιασμού για τους ιστότοπους:

  • Γραμματοσειρές Serif
  • Μαυρόασπρες παλέτες (Ναι! Είστε στο σωστό ιστότοπο)
  • Glitch art
  • Micro-interactions
  • Τα Chatbots εξελίσσονται
  • Περισσότερο περιεχόμενο μέσω Video
  • Μινιμαλισμός
  • Καλύτερη εμπειρία χρήσης
  • Diversity (Πολυμορφία)

Γραμματοσειρές Serif

Οι γραμματοσειρές Serif σχεδιάστηκαν για έντυπα ενώ οι Sans Serif είναι πιο web friendly…

Aς ξεχάσουμε την παραπάνω άποψη… Αρκετές από τις σύχρονες Serif είναι πραγματικά αριστουργήματα. Προσθέτουν κύρος και ομορφιά σε έναν ιστότοπο, διακοσμώντας το περιβάλλον του με διακριτικότητα και άποψη. (Εντάξει… δεν κάνουν για όλους τους ιστότοπους).

Serif Font Example
Παράδειγμα Serif Font του Mailchimp
Serif Font Example
Παράδειγμα Serif Font του Medium

Μαυρόασπρες παλέτες

Το χρώμα είναι πολύ σημαντικό για έναν ιστότοπο. Όταν επισκεπτόμαστε έναν ιστότοπο του οποίου η παλέτα βασίζεται στο μαυρόασπρο μας δημιουργούνται διαφορετικά συναισθήματα από ότι εάν βλέπαμε χρώματα. Το μαύρο είναι ισχυρό και δυναμικό ενώ το άσπρο καθαρό ή καλύτερα… ξεκάθαρο! Αν τα συνδυάσετε σωστά βγαίνει κάτι υπέροχο. Εάν όμως συνδυαστούν με λάθος τρόπο τότε μπορεί να έχουμε ακριβώς αντίθετα αποτελέσματα (έως και εχθρικά θα λέγαμε)…

Tip: Ένας καλοσχεδιασμένος ιστότοπος σε μαυρόασπρη παλέτα απογειώνει κάποιο Call to Action. Δημιουργεί στον χρήστη την τάση να … δρα!

NEW PROWEB About Page
Black & White @PROWEB

Glitch art

Το Glitch art είναι η πρακτική της χρήσης ψηφιακών ή αναλογικών «σφαλμάτων» για αισθητικούς σκοπούς. Οι «δυσλειτουργίες» και τα «σφάλματα» αυτά, εμφανίζονται στην τεχνη και στην επικοινωνία, όπως θα δει κανείς για παράδειγμα στην ταινία A Color Box (Len Lye).

Το συναίσθημα που δημιουργεί στο Design η τάση του Glitch Art είναι μια ρετρό διάθεση όπου ο χρήστης έχει την αίσθηση πως απέναντι στο απόλυτο «ατσαλάκωτο» του digital υπάρχει κάτι ανθρώπινο και ελεγχόμενο. Το Glitch Art δημιουργεί έναν συμπαθέστατο αποπροσανατολισμό του χρήστη με τη «ζέστη» του «ανθρώπινου» (…προσοχή όμως να μην το παρακάνετε. Βρείτε την ισορροπία σε ανάμεσα σε glitch και καθαρού σχεδιασμού. Αλλιώς βγαίνει κάτι σε εμμονικό vintage και δημιουργεί αναξιοπιστία).

Glitch Art Web Example

Micro-interactions

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

Από την άλλη, ο χρήστης θα παραμείνει περισσότερο χρόνο στον ιστότοπό σας με αποτέλεσμα να αυξηθεί η εμπιστοσύνη του προς εσάς (προσοχή και πάλι… δεν το παρακάνουμε).

Micro Interactions Web Page Example
Πατήστε την παραπάνω εικόνα για να καταλάβετε τι εννοούμε.

Τα Chatbots εξελίσσονται

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

Γίνονται συνεχώς πιο «έξυπνα» και αυτό σίγουρα έχει ως αποτέλεσμα οι επαγγελματίες να δημιουργούν τις προϋποθέσεις εκείνες που κάνουν τις μετρήσεις τους πιο έγκυρες και πιο «to the point».

Αν δεν έχουν ενταχθεί ακόμα στον ιστότοπό σας δοκιμάστε τα! Θα εκπλαγείτε με το αποτέλεσμα.

Chatbots Example

Περισσότερο περιεχόμενο μέσω Video

Το video εδώ και αρκετά χρόνια αποτελεί αναπόσπαστο κομμάτι μεταφοράς πληροφορίας τόσο σε επίπεδο B2C όσο και σε επίπεδο B2B. Η Google όμως «λατρευει» πλέον το ανάμεικτο περιεχόμενο. Δηλαδή, «επιβραβεύει» έναν ιστότοπο ο οποίος δεν αρκείται σε κείμενα και φωτογραφίες μόνο.

Αυτό οδήγησε πολλά agencies να παράγουν video ως content τέτοιο, που θα στείλει το μήνυμα στον χρήστη – πελάτη ο οποίος με τη σειρά του δεν έχει χρόνο να διαβάζει (ή να σκανάρει με τα μάτια του) πληροφορίες που θα χρειαστεί.

Video as content example
Video ως content

Minimal Design

Ίσως η πιο κλασική και διαχρονική τάση σχεδιασμού και όχι μόνο σε επίπεδο web design. Ίσως, η ιδανικότερη επιλογή όταν μιλάμε για υψηλή αισθητική.

Στο web, όσο λιγότερο πρέπει να σκεφτεί ο χρήστης για να αντιληφθεί ή να βρει αυτό που ψάχνει τόσο το καλύτερο. Προσθέστε και μια καθαρή τυπογραφία και είστε έτοιμοι να «γοητεύσετε».

Το minimal έχει μόνο ένα μείον: Αντί για minimal μπορεί να βγει φτηνό και απλοϊκό εάν δεν έχει κανείς πλήρη επίγνωση του που θέλει να πάει και τι θέλει να δείξει! Άρα, ο web Designer οφείλει να είναι «διαβασμένος» και σε υψηλό επίπεδο.

Minimal Example

Καλύτερη εμπειρία χρήσης (UX)

Οι χρήστες (από 7 έως 107 ετών) είναι πλήρως εξοικειωμένοι με τη χρήση του αντίχειρά τους. To 2019 -λένε- πως θα είναι το πιο mobile έτος (μέχρι το επόμενο). Φανταστείτε πως έχουν γίνει σπουδαίες μελέτες στον τομέα του σωστού UX που βασίζει την ύπαρξή του στο mobile experience (Josh Clark: Designing for Touch) οι οποίες διερευνούν σχεδόν στο απόλυτο, τον τρόπο που οι χρήστες κρατούν τα κινητά τους τηλέφωνα και πως μετακινούν τον αντίχειρά τους πάνω στην οθόνη τους.

UX Mobile Example

UX Mobile Example

Diversity (Πολυμορφία)

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

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

Το 2019 δημιουργείται σχεδιαστικά αυτή η ανάγκη. Η ανάγκη δηλαδή της πολυμορφίας, της επιλογής και τελικά της πολιτισμικής διασύνδεσης που θέλει αυτό το mix & match περισσότερο από ποτέ.

Αν και ο κόσμος έχει πολύ δρόμο ακόμα να βαδίσει για να είναι δεκτικός στο διαφορετικό εν τούτοις, από τη στιγμή που το web design είναι μια Τέχνη (πιο εφήμερη από τις μεγάλες Τέχνες η αλήθεια είναι…) οι designers ως καλλιτέχνες θα πρέπει να δίνουν το παραπάνω στίγμα μέσα από τις δουλειές τους.

Diversity on the Web

Diversity on the Web