Επίπεδη σχεδίαση: γιατί η σχεδίαση έγινε επίπεδη; Επίπεδη σχεδίαση και σχεδιασμός υλικού: Ποια είναι η διαφορά τους; Η επίπεδη σχεδίαση και η σχεδίαση υλικού διαφέρουν.

Η επανάσταση του «επίπεδου σχεδιασμού» συνέχισε να κερδίζει δυναμική από τότε που εισήχθη στην πλατφόρμα Windows Phone το 2010. Δεν είναι δύσκολο να καταλάβουμε γιατί: μια διεπαφή με αυτό το σχέδιο φαίνεται πιο διαισθητική, είναι κατάλληλη για προσαρμοστικά στοιχεία, μοντέρνα πλαίσια και φαίνεται ελκυστική όταν εκτελείται σωστά.
Η επίπεδη σχεδίαση ξεκίνησε ως αντίβαρο στο πανταχού παρόν σκευομορφικό στυλ, αλλά έκτοτε έχει γίνει πολύ περισσότερο από την απλή "Επιλογή Β".

Αρχικά, το flat ήταν αποκλειστικά δισδιάστατο με συνολική εστίαση στον μινιμαλισμό. Το σύγχρονο flat 2.o χρησιμοποιεί σκιές, κλίσεις και άλλα στοιχεία για να φαίνεται "σχεδόν επίπεδο".

5 Χαρακτηριστικά στοιχεία του Μοντέρνου Επίπεδου Σχεδιασμού:

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

2. Δυναμικά χρώματα
Η συμπλήρωση αραιών γραφικών είναι εύκολη με τα ενεργητικά χρώματα, ειδικά τις ανοιχτόχρωμες αποχρώσεις.
Τα διαφορετικά χρώματα φόντου σε αντίθεση με το βασικό χρώμα των στοιχείων κάνουν τη σελίδα με ένα μενού με πλακάκια πιο ζωντανή.
Ο ιστότοπος Flat UI Colors περιέχει τα πιο αποτελεσματικά χρωματικά μοτίβα για flat.

3. Απλή τυπογραφία
Η επιλογή της γραμματοσειράς σε επίπεδη βάση βασίζεται σε ένα κριτήριο: την αναγνωσιμότητα. Συνήθως χρησιμοποιούνται γραμματοσειρές Sans Serif με σταθερό πλάτος διαδρομής.

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

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

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

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

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

Βασισμένο στο βιβλίο τάσεων σχεδίασης ιστοσελίδων.

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

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

Σήμερα, όλο και περισσότεροι σχεδιαστές χρησιμοποιούν αυτήν την τάση στη δουλειά τους, αλλά το Flat style έχει αποκτήσει ιδιαίτερη δημοτικότητα με την εξάπλωση των σύγχρονων λειτουργικών συστημάτων για κινητά Windows Phone και iOS 7, καθώς είναι οπαδοί αυτής της τάσης, αν και δεν τηρούν το εντελώς.

Η εταιρεία μας έχει ήδη εμπειρία στη δημιουργία ιστοσελίδων σε στυλ Flat και θα χαρούμε να σας βοηθήσουμε να δημιουργήσετε μια επίπεδη ιστοσελίδα!

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

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

1. Καταργήστε όλα τα εφέ

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

Στο επίπεδο σχέδιο δεν θα βρείτε στοιχεία που προσπαθούν να φαίνονται ρεαλιστικά (σκευομορφισμός), τρισδιάστατα κινούμενα σχέδια, ρεαλιστικά εικονίδια κ.λπ. Ωστόσο, η ίδια η σχεδίαση προσπαθεί να παραμείνει παρόμοια με την παραδοσιακή, αλλά πλέον οι ετικέτες, τα κουμπιά και η πλοήγηση έρχονται στο προσκήνιο.

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

2. Χρησιμοποιήστε απλά στοιχεία

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

3. Ας επικεντρωθούμε στην τυπογραφία

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

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

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

4. Ας τραβήξουμε την προσοχή με το χρώμα

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

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

5. Μινιμαλισμός

Η επίπεδη σχεδίαση είναι απλή στη φύση και ταιριάζει καλά με μια μινιμαλιστική προσέγγιση.

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

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

Από τον συγγραφέα:Χαιρετισμούς, φίλοι! Σήμερα θα μιλήσουμε για το τι είναι επίπεδη σχεδίαση ή επίπεδη σχεδίαση ιστότοπου. Αυτός ο όρος έχει κερδίσει εδώ και καιρό τις καρδιές των σχεδιαστών ιστοσελίδων και εξακολουθεί να είναι με αυτοπεποίθηση τάση σήμερα. Οι μεγαλύτερες εταιρείες (Google, YouTube, Microsoft, Apple Inc., κ.λπ.) το χρησιμοποιούν για να σχεδιάσουν τις ιστοσελίδες και τις εφαρμογές τους. Δεν είστε ακόμα στην αίρεση των επίπεδων υποστηρικτών του σχεδιασμού ιστοσελίδων; Τότε πάμε σε εσάς!

Ποιος πιστεύετε ότι είναι ο λόγος για μια τέτοια άγρια ​​δημοτικότητα του flat design; Θα σου απαντήσω με λίγα λόγια: λειτουργεί πραγματικά! Σε αυτό το άρθρο, θα σας εξηγήσω τι είναι αυτό το στυλ, θα σας πω για τα πλεονεκτήματα και τα μειονεκτήματά του και θα σας δείξω μερικά εξαιρετικά παραδείγματα επίπεδης σχεδίασης ιστότοπου που σίγουρα θα σας εμπνεύσουν να κάνετε σπουδαία πράγματα. Λοιπόν πάμε!

Όλα ξεκίνησαν με σκευομορφισμό

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

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

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

«Το καλύτερο σχέδιο είναι όσο το δυνατόν λιγότερο σχέδιο»

Πώς κοίταξε ο Dieter Rams στο νερό - ένας διάσημος βιομηχανικός σχεδιαστής που αντιτίθεται στον παρεμβατικό σχεδιασμό, τα εφέ κινούμενων σχεδίων κ.λπ. Τον Ιούνιο του 2013, η Apple Inc. παρουσίασε το επαναστατικό iOS 7, το οποίο έλαβε όλα τα χαρακτηριστικά ενός επίπεδου στυλ σχεδίασης ιστοσελίδων. Ωστόσο, το αεροπλάνο δεν «νίκησε» αμέσως τον ρεαλισμό και τον όγκο.

Για πολύ καιρό, οι χρήστες δεν μπορούσαν να ξεχάσουν τη μαγεία του Steve Jobs και τα εικονίδια «που θέλετε να γλείψετε». Πολλοί αποχαιρέτησαν ακόμη και τους «φτωχούς επτά» και άλλαξαν στο «ακτινοβόλο Android». Λάδι στη φωτιά ήταν ο μεγάλος αριθμός σφαλμάτων που υπήρχαν στο iOS 7 και η υπόλευκη, ημιδιαφανής σχεδίαση με παράλλαξη και κινούμενα σχέδια "μύξας" κατά το άνοιγμα εφαρμογών.

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

Πλεονεκτήματα και μειονεκτήματα της επίπεδης σχεδίασης

Τα πλεονεκτήματα της χρήσης αυτού του στυλ περιλαμβάνουν:

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

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

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

Η επίπεδη σχεδίαση ιστοσελίδων έχει επίσης τα μειονεκτήματά της:

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

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

έλλειψη συγκεκριμένων σταθερών κανόνων.

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

Ξεχάστε τους "τουβλότοιχους" και τα φωτεινά φόντο. Η επίπεδη σχεδίαση ιστοσελίδων τείνει να χρησιμοποιεί απλές, ομαλές, απαλές εικόνες για το φόντο.

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

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

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

Εστίαση στην τυπογραφία. Στην επίπεδη σχεδίαση, προτιμώνται οι φωτεινές, πρωτότυπες επιγραφές που δημιουργούν μια παρότρυνση για δράση και παρέχουν εύκολη πλοήγηση στον ιστότοπο. Και εδώ είναι σημαντικό να μην το παρακάνετε. Ξεχάστε τις «χειρόγραφες» και άλλες φανταχτερές γραμματοσειρές. Τα κεφαλαία γράμματα μπορούν να χρησιμοποιηθούν για την επισήμανση επικεφαλίδων.

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

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

Έτσι, με τα χρόνια, οι επίπεδες ιστοσελίδες έχουν γίνει το πρότυπο αποδεκτό από όλους. Κοιτάξτε τις περισσότερες σύγχρονες ιστοσελίδες - είναι επίπεδες μέχρι τον πυρήνα.

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

1. Ιστότοπος http://dunked.com.

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

2. Διεπαφή Microsoft.

Η Microsoft είναι μια από τις εταιρείες που έκαναν το flat style τόσο δημοφιλές. Ίσως θυμάστε το Zune player, έναν ανταγωνιστή του iPod, το οποίο κυκλοφόρησε η Microsoft στα μέσα της δεκαετίας του 2000; Έτσι, ο σχεδιασμός αυτού του προϊόντος ήταν πολύ διαφορετικός από τις περισσότερες εφαρμογές εκείνης της εποχής, σε μεγάλο βαθμό λόγω της μεγάλης τυπογραφίας, των επίπεδων εικονιδίων, των μεγάλων και φωτεινών σχημάτων.

Αυτή η διεπαφή, η οποία ονομάστηκε Metro, μεταφέρθηκε αργότερα σε προσωπικούς υπολογιστές (Windows 8 OS), στη διεπαφή Xbox 360 και σε άλλα προϊόντα λογισμικού της Mircosoft.

3. Ιστότοπος http://www.vox.com.

Λοιπόν, εμπνέεσαι; Κάτω η ψευδορεαλιστική τρισδιάστατη αισθητική!

Αυτό είναι όλο. Εγγραφείτε και μοιραστείτε τα άρθρα μας με φίλους στα κοινωνικά δίκτυα. Υψηλές μετατροπές σε εσάς!

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

Εισαγωγή στο επίπεδο σχέδιο

Στα ρωσικά, η επίπεδη σχεδίαση μεταφράζεται ως «επίπεδη σχεδίαση» και έγινε το απόλυτο αγαπημένο αφού η Apple παρουσίασε το λειτουργικό σύστημα iOS. Η εστίαση ήταν σε μια μινιμαλιστική προσέγγιση στο σχεδιασμό χρηστικότητας. Η εστίαση είναι στην άνεση του χρήστη. Αυτή είναι μια έντονη διαμαρτυρία ενάντια στον «squeformism» (οπτικοποίηση των αντικειμένων όπως στην πραγματικότητα). Η επιλογή έπεσε σε πιο απλουστευμένες και ταυτόχρονα πιο απλές αισθητικές λύσεις. Οι χρήστες, κουρασμένοι από ρεαλιστικές απεικονίσεις, χαιρέτησαν αυτήν την κατεύθυνση με χαρά και όλο και περισσότερα έργα ιστού μετακινούνται σε αυτήν τη μορφή.

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

Αρχή Νο. 1: Χωρίς περιττά αποτελέσματα

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

Αρχή #2: όσο πιο απλό τόσο το καλύτερο

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

Αρχή #3: Η τυπογραφία και η σημασία της

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

Αρχή #4: Έγχρωμοι τόνοι

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

Αρχή Νο 5: επιλογή μινιμαλισμού

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

Επίπεδη ή σχεδόν επίπεδη; Αναζητούμε συμβιβασμό!

Εν κατακλείδι, θα ήθελα να σημειώσω ότι σήμερα υπάρχει μια συνέργεια μεταξύ επίπεδης και μη επίπεδης σχεδίασης. Μιλάμε για ένα «σχεδόν επίπεδο» σχέδιο. Αυτή είναι η πιο κοινή εφαρμογή της περιγραφόμενης ιδέας, όταν, μαζί με απλά και συνοπτικά στοιχεία και δισδιάστατο χώρο, οι σχεδιαστές χρησιμοποιούν 1-2 τεχνικές για το βάθος και την προοπτική.

Επίσης τάση το 2017 ήταν το Semi Flat Design - semi-flat design. Επηρεασμένο από το Material Design, έχει γίνει λίγο πιο χωρικό. Εμφανίζονται ανοιχτόχρωμες σκιές που κάνουν το σχέδιο να φαίνεται ημι-επίπεδο. Το επίπεδο σχέδιο εξακολουθεί να είναι επίκαιρο σήμερα· λόγω των σκιών, έχει γίνει πιο βαθύ και πιο περίπλοκο, αλλά η βασική ιδέα δεν παραβιάζεται.

Επίπεδη σχεδίαση- μια σχετικά νέα τάση για την οποία συνεχίζει να μιλάει όλη η σχεδιαστική κοινότητα.

Σε κάποιους αρέσει, σε άλλους δεν μπορούν απολύτως να το συνηθίσουν και μάλιστα το μισούν.

Ένα καλό σχέδιο πρέπει πρώτα από όλα να λύσει το επιχειρηματικό πρόβλημα του πελάτη· με ποιον τρόπο θα επιτευχθεί αυτό είναι ένα δευτερεύον ερώτημα. Εάν ο σχεδιαστής έχει επιλέξει το "επίπεδο σχέδιο" ως στυλ ή εργαλείο - ας είναι! Αλλά μην ξεχνάτε ότι αυτό το στυλ δεν είναι κατάλληλο για όλα τα έργα.

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

Οι βασικές αρχές του επίπεδου σχεδιασμού είναι:

1. Χωρίς αποτελέσματα

2. απλά στοιχεία

3. Εστίαση στην τυπογραφία

4. Εστιάστε στο χρώμα

5. Μινιμαλιστική προσέγγιση

6. «Σχεδόν» επίπεδο σχέδιο

Τώρα ας δούμε κάθε μία από τις αρχές του επίπεδου σχεδιασμού με περισσότερες λεπτομέρειες:

Κανένα αποτέλεσμα

Η επίπεδη σχεδίαση συχνά δεν χρησιμοποιεί εφέ όπως σκιές, λοξοτμήσεις, ανάγλυφο, ντεγκραντέ ή άλλες τεχνικές που προσθέτουν βάθος και όγκο. Χωρίς 3D εφέ ή μεταφορά υλικού, σε αντίθεση με τον στυλιστικό αντίπαλο «Skemorphism». Κάθε στοιχείο πρέπει να παραμένει καθαρό, είτε είναι ένα εικονίδιο, μια γραμμή πλοήγησης ή ένα πλαίσιο, ένα κουμπί κ.λπ.

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

Απλά στοιχεία

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

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


Εστίαση στην τυπογραφία

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

Ο χαρακτήρας της γραμματοσειράς πρέπει να αντιστοιχεί στο συνολικό σχήμα και τη σύνθεση - μια υπερβολικά σύνθετη γραμματοσειρά μπορεί να φαίνεται περίεργη και επιτηδευμένη σε ένα υπερβολικά απλοποιημένο σχεδιαστικό μοντέλο. Είναι προτιμότερο να χρησιμοποιείτε μια απλή γραμματοσειρά sans-serif, έντονη ή έντονη. Το κείμενο πρέπει να είναι σε αρμονία με απλές φόρμες.

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


Έμφαση στο χρώμα

Το χρώμα είναι ένα σημαντικό μέρος του σχεδιασμού. Η επίπεδη παλέτα σχεδίασης είναι συχνά πολύ πιο φωτεινή και πιο πολύχρωμη από άλλα στυλ σχεδίασης. Σε σύγκριση με ένα κανονικό σχέδιο που εστιάζει σε 2-3 χρώματα, ένα επίπεδο σχέδιο μπορεί να περιλαμβάνει 6 ή και 8 χρωματικές αποχρώσεις.