
Nike
Μια μονόχρωμη συλλογή αθλητικών επιτευγμάτων – λευκοί τοίχοι, το προϊόν ως έργο τέχνης, χρώμιο διαλυμένο στο φόντο
Το Nike.com λειτουργεί ως μια μονόχρωμη γκαλερί με προτεραιότητα το προϊόν: η διεπαφή χρήστη είναι σχεδόν αόρατη, επιτρέποντας στις φωτογραφίες προϊόντων να καταλαμβάνουν κάθε οθόνη. Ολόκληρη η διεπαφή είναι κατασκευασμένη από μαύρο, λευκό και τρεις αποχρώσεις του γκρι - χωρίς χρώματα έμφασης, χωρίς διακοσμητικές διαβαθμίσεις, χωρίς ζεστό, χαρακτηριστικό χρώμιο. Το χαρακτηριστικό στυλ της Nike βρίσκεται στο λογότυπο της γκαλερί και στις φωτογραφίες, αλλά ποτέ στην ίδια τη διεπαφή χρήστη. Η τυπογραφία είναι συμπαγής και χρηστική, βασιζόμενη σε μια ειδικά σχεδιασμένη οικογένεια γραμματοσειρών Helvetica Now στα 12-20px, με ένα μόνο, υπερμεγέθες λογότυπο Nike Futura ND στα 76px για τις επικεφαλίδες. Τα στοιχεία είναι μινιμαλιστικά: κουμπιά σε σχήμα χαπιού με ακτίνα 30px, επίπεδες κάρτες προϊόντων, λεπτά περιγράμματα και σχεδόν μηδενικές διαφορές ύψους. Η σελίδα εναλλάσσεται μεταξύ καθαρά λευκών επιφανειών προϊόντων και εντυπωσιακών, σκούρων τμημάτων σύνταξης, δημιουργώντας ρυθμό μέσω της αντίθεσης παρά της διακόσμησης.
Η σελίδα ακολουθεί έναν έντονο συντακτικό ρυθμό: μια εντυπωσιακή, πλήρους πλάτους, σκούρα κεφαλίδα που περιλαμβάνει ένα μόνο προϊόν και έναν μεγάλο τίτλο, ακολουθούμενη από ένα πλέγμα κατηγοριών 2x2 πλήρους πλάτους, ένα οριζόντια κυλιόμενο πλέγμα καρτών προϊόντων σε 3 στήλες και τέλος ένα πυκνό, πολυστηλικό υποσέλιδο. Όλα τα μπλοκ περιεχομένου καταλαμβάνουν το πλήρες πλάτος του παραθύρου προβολής χωρίς μέγιστο πλάτος κοντέινερ. Ένας περιορισμός μέγιστου πλάτους ισχύει μόνο για το πλέγμα συνδέσμων πλοήγησης και υποσέλιδου. Οι μεταβάσεις μεταξύ των ενοτήτων είναι ευκρινείς: μαύρη κεφαλίδα → λευκό πλέγμα κατηγοριών → λευκό πλέγμα προϊόντων → λευκό υποσέλιδο, με στενά γκρι περιγράμματα που χρησιμεύουν ως η μόνη οπτική ραφή. Η πλοήγηση είναι μια μινιμαλιστική, δίβαθμη γραμμή (βοηθητικοί σύνδεσμοι στην κορυφή, κύριες κατηγορίες στο κέντρο) χωρίς καρφίτσωμα, χωρίς γέμισμα φόντου και χωρίς σκιά. Η πυκνότητα περιεχομένου είναι συμπαγής στα πλέγματα προϊόντων (μικρή απόσταση μεταξύ καρτών) και ευρύχωρη στην κεφαλίδα (παράθυρο προβολής πλήρους πλάτους).
Η φωτογραφία είναι το κυρίαρχο οπτικό στοιχείο και καθορίζει ολόκληρη την ταυτότητα της μάρκας. Το σύστημα χρησιμοποιεί φωτογραφίες προϊόντων υψηλής ποιότητας, πλήρους καρέ: αθλητικά παπούτσια φωτογραφημένα μεμονωμένα σε σκούρο ή ντεγκραντέ φόντο, κομμένα για να γεμίσουν το κάδρο, χωρίς να θίγονται τα συμφραζόμενα του τρόπου ζωής. Οι εικόνες lifestyle εμφανίζονται εντός κατηγοριών, παρουσιάζοντας τα πόδια και τις κνήμες των αθλητών σε κίνηση. Χρησιμοποιείται ένα κορεσμένο χρωματικό σχήμα υψηλής αντίθεσης - κόκκινα παπούτσια σε μαύρο φόντο, νέον πινελιές σε λευκές σόλες και ζεστός και ψυχρός φωτισμός για να δραματοποιηθούν τα υλικά. Δεν χρησιμοποιούνται εικόνες, αφηρημένα γραφικά ή τρισδιάστατες απεικονίσεις. Οι εικόνες έχουν πάντα καθαρές άκρες (όχι στρογγυλεμένες γωνίες σε δοχεία φωτογραφιών), καταλαμβάνουν πάντα ολόκληρο τον χώρο μέσα στα μπλοκ τους και συνοδεύονται πάντα από ελάχιστη επικάλυψη κειμένου. Η εικονογραφία είναι καθαρά λειτουργική: εικονίδια περιγράμματος για αναζήτηση, λίστα επιθυμιών, καλάθι αγορών και λογαριασμό σε χρώματα Obsidian ή Steel.
Παλέτα
Ουδέτερος
- Obsidian
#111111— Το σκούρο χρώμα συμπληρώνει το ουδέτερο κείμενο και τα εικονίδια και δημιουργεί έντονη αντίθεση. Αποφύγετε τη χρήση του ως κύριου χρώματος για παροτρύνσεις για δράση. - Paper White
#ffffff— Φόντο σελίδας, επιφάνεια κάρτας, κείμενο κουμπιού σε σκούρο φόντο, περίγραμμα εικονιδίου—ο προεπιλεγμένος καμβάς για πλέγματα προϊόντων και ενότητες κατηγοριών. - Concrete Gray
#e5e5e5— Περιγράμματα, διαχωριστικά, λεπτές γραμμές που χωρίζουν τα τμήματα του πλέγματος, διακριτικά περιγράμματα πεδίων εισαγωγής. - Soft Mist
#f5f5f5— Διακριτικό χρώμα φόντου για δευτερεύουσες επιφάνειες, συμπλήρωση πεδίου αναζήτησης στην πλοήγηση, φόντο ετικέτας. - Steel
#707072— Δευτερεύον κείμενο, κείμενο βοήθειας σε σίγαση, μειωμένα περιγράμματα εικονιδίων, ετικέτες δυναμικής διαδρομής, διαχωριστικά συνδέσμων υποσέλιδου. - Faint Gray
#9e9ea0— Τα περιγράμματα εικονιδίων, τα δευτερεύοντα στοιχεία του περιβάλλοντος εργασίας χρήστη και τα περιγράμματα με ελάχιστη επισήμανση είναι απενεργοποιημένα.
Τυπογραφία
από 12 έως 76px · 6 βήματα
- Helvetica Now Text Medium — αντικατάσταση: Inter · περιγράμματα 500 · Γραμματοσειρά Helvetica Now Text Medium - βρέθηκε στα δεδομένα που έχουν συλλεχθεί αλλά δεν περιγράφεται από την Τεχνητή Νοημοσύνη.
- Helvetica Now Text — αντικατάσταση: Inter or Helvetica Neue · περιγράμματα 400, 500 · Το κύριο κείμενο της διεπαφής χρήστη - σύνδεσμοι πλοήγησης, ετικέτες κουμπιών, τίτλοι καρτών, ονόματα προϊόντων, λίστες υποσέλιδων, όλο το κείμενο του σώματος.
- Helvetica Now Display Medium — αντικατάσταση: Inter Medium or Helvetica Neue Medium · περιγράμματα 500 · Επικεφαλίδες ενοτήτων, ετικέτες κατηγοριών καρτών, επικεφαλίδες μεσαίου μεγέθους - Η μεσαία γραμματοσειρά (20-24px) είναι ένα χαρακτηριστικό γνώρισμα των επικεφαλίδων της Nike που δεν αποτελούν μεγάλα στοιχεία σχεδίασης: ποτέ έντονη, πάντα συνοπτική.
Διαστήματα και μορφή
| Σκοπός | Εννοια |
|---|---|
| Πυκνότητα | πυκνός |
| Βασικό βήμα | 8px |
| Ακτίνα κουμπιού | 30px |
| Ακτίνα κάρτας | 0px |
| Σκιές | χωρίς περιγράμματα αντί για σκιές |
| Μεταξύ τμημάτων | 48px |
| Πλάτος σελίδας | 1440px |
Η Τεχνητή Νοημοσύνη θα δημιουργήσει τον ιστότοπό σας σε στυλ Nike και θα τον γεμίσει
- Συμπληρώστε με προϊόντα και αναρτήσεις μέσω του συνδέσμου - Instagram, TikTok, Facebook.
- Μεταφέρετε περιεχόμενο από τον παλιό σας ιστότοπο—απλώς καθορίστε τη διεύθυνση.
- Μοντέρνος σχεδιασμός στην καλύτερη μηχανή αναζήτησης: React ( Next.js) με απόδοση διακομιστή και βελτιστοποίηση SEO από την πρώτη στιγμή.
- Πλήρως αυτοματοποιημένη βελτιστοποίηση SEO για αποτελέσματα αναζήτησης και προτάσεις νευρωνικών δικτύων.
Παρόμοια στυλ
- Airbnb — Ένας ήσυχος λευκός τοίχος γκαλερί με έναν μόνο κοραλλιογενή σελιδοδείκτη
- Apple (España) — λευκή βιτρίνα γκαλερί
- Silencio — Ένα λευκό δωμάτιο με αιωρούμενα αντικείμενα. Μια γκαλερί από ζεστό χαρτί, όπου κάθε στοιχείο καταλαμβάνει τη θέση του σε ένα φόντο αρνητικού όγκου, και η σιωπή είναι μια σκόπιμη σχεδιαστική απόφαση.
- Oakâme — Ένα ηλιόλουστο εργαστήριο Προβηγκίας σκαλισμένο από ζεστή πέτρα
- Arc — βιομηχανική λευκή γκαλερί πάνω από το νερό των μεσάνυχτων
- Rivian — Ένας ηλεκτρικός μονόλιθος στον τσιμεντένιο τοίχο της γκαλερί. Η Rivian παρουσιάζει κάθε όχημα ως γλυπτό σε έναν απέραντο λευκό χώρο, με τυπογραφία τόσο μεγάλη που γίνεται αρχιτεκτονικό στοιχείο, και ένα μόνο ζεστό κίτρινο που σπάει τη μονοχρωματική ατμόσφαιρα, σαν ηλιακό φως σε μια ματ επιφάνεια.
- Analogue — Μαύρη προθήκη γκαλερί – τα αγαθά αιωρούνται στο κενό
- ddna — ζεστή μουσειακή προθήκη σε ακατέργαστο λινό
- Zellerfeld — Ένα εργαστήριο γλύπτη σε λευκό μάρμαρο—οι μονολιθικές επιφάνειες του βάθρου, μια μοναδική σπίθα κοβαλτίου, ένας ψίθυρος πεζών γραμμάτων από το δάπεδο μέχρι την οροφή
- UY Studio — Η πέτρινη στοά του μοναστηριού είναι ένας ήσυχος χώρος με τσιμεντένιους τοίχους, όπου μπουκάλια αρωμάτων στέκονται σε λευκές βάσεις, φωτισμένες από μία λάμπα 400 watt και τέσσερις ζεστές γκρι λάμπες.
- Basic.Space — επιμελητική γκαλερί σε λευκό μάρμαρο
- COS — μια μοντέρνα γκαλερί με λευκούς τοίχους