Airbnb
Ένας ήσυχος λευκός τοίχος γκαλερί με έναν μόνο κοραλλιογενή σελιδοδείκτη
Το Airbnb λειτουργεί σε στυλ «λευκού καμβά», όπου η φωτογραφία κυριαρχεί: σχεδόν κάθε οθόνη είναι ένα ήσυχο μονόχρωμο πλαίσιο, επιτρέποντας στις εικόνες πλήρους οθόνης των ακινήτων να μεταφέρουν τη συνολική εντύπωση, με μια μοναδική, πλούσια κοραλλιογενή κόκκινη πινελιά (Rausch) ως το μοναδικό χρωματικό σύνθημα που υποδηλώνει δράση. Η γραμματοσειρά είναι γεωμετρική sans-serif (Airbnb Cereal VF) -ως επί το πλείστον μικρά, αξιόπιστα μεγέθη- για το κυρίως κείμενο, τη διεπαφή και τις επικεφαλίδες ενοτήτων (22-22) - με περιορισμένο αρνητικό διάστιχο και γενναιόδωρο διάστιχο, καθιστώντας τις κάρτες με πυκνό κείμενο ευανάγνωστες. Η διεπαφή είναι επίπεδη, χωρίς πλαίσιο και στρογγυλεμένη: ακτίνες 12-3 σε κάρτες και χειριστήρια, στρογγυλά κουμπιά σε σχήμα χαπιού και απαλές, πολυεπίπεδες σκιές μόνο για εμφανή στοιχεία όπως η γραμμή αναζήτησης. Όλα τα άλλα - κάρτες, στοιχεία λίστας, σύνδεσμοι- βασίζονται σε λευκό χώρο και λεπτές γραμμές αντί για χρωμιωμένες πινελιές.
Μια διάταξη πλήρους πλάτους χωρίς σταθερό όριο μέγιστου πλάτους—το περιεχόμενο εκτείνεται από άκρη σε άκρη εντός της ορατής περιοχής, με περίπου 40px οριζόντιας επένδυσης σε κάθε πλευρά στην επιφάνεια εργασίας. Ο ήρωας είναι μια αιωρούμενη κάψουλα αναζήτησης, κεντραρισμένη σε έναν ουδέτερο λευκό καμβά χωρίς εικόνα ή τίτλο—η γραμμή αναζήτησης ΕΙΝΑΙ ο ήρωας. Κάτω από την αναζήτηση, η σελίδα μεταβαίνει σε κατακόρυφα στοιβαγμένες, οριζόντια κυλιζόμενες ενότητες (είναι ορατές τέσσερις σειρές: Προτεινόμενα Σπίτια, Υπέροχα Ξενοδοχεία, Άλλη Πόλη, Διαθέσιμο τον Επόμενο Μήνα), ύψους περίπου 320px η καθεμία, χωρισμένες από κάθετες υδρορροές 48px. Κάθε ενότητα χρησιμοποιεί ένα πλέγμα 7 καρτών με οριζόντια υπερχείλιση και πλοήγηση με βέλη. Το υποσέλιδο είναι ένα πλέγμα 3 στηλών συνδέσμων σε φόντο #f7f7f7, ακολουθούμενο από μια κάτω γραμμή με πληροφορίες πνευματικών δικαιωμάτων, επιλογές γλώσσας/νομίσματος και εικονίδια κοινωνικών μέσων. Η πλοήγηση είναι μια σταθερή επάνω γραμμή με κεντρική πλοήγηση καρτελών και χειριστήρια ευθυγραμμισμένα δεξιά.
Η φωτογραφία κυριαρχεί στο οπτικό σύστημα, με εικόνες πλήρους οθόνης από καταχωρίσεις ακινήτων να αποτελούν τον κύριο τύπο περιεχομένου. Όλες οι φωτογραφίες είναι ζεστές, καλά φωτισμένες εσωτερικές και εξωτερικές λήψεις πραγματικών σπιτιών και ξενοδοχείων, επεξεργασμένες με φυσική διόρθωση χρώματος (χωρίς βαριά φίλτρα ή διχρωμίες). Οι εικόνες είναι κομμένες με ακρίβεια με αναλογία διαστάσεων 1:1 για τις κάρτες καταχωρίσεων, γεμίζοντας την άκρη της κάρτας χωρίς περιθώρια κενού. Τα εικονίδια σε όλη τη διεπαφή έχουν μονόχρωμο περίγραμμα (πάχος γραμμής ~16–16), που χρησιμοποιείται με φειδώ για κατηγορίες πλοήγησης και στοιχεία ελέγχου διεπαφής χρήστη. Το λογότυπο είναι το μόνο πολύχρωμο γραφικό στοιχείο (Rausch). Χωρίς εικόνες, χωρίς τρισδιάστατες απεικονίσεις, χωρίς αφηρημένα γραφικά - η οπτική γλώσσα είναι καθαρή φωτογραφία και μινιμαλιστική μονόχρωμη εικονογραφία σε έναν απαλό λευκό καμβά.
Παλέτα
Μάρκα
- Rausch
#ff385c— Το κόκκινο χρησιμοποιείται ως διακοσμητικό στοιχείο για εικονίδια, πινακίδες και μικρές γραφικές λεπτομέρειες. Δεν πρέπει να χρησιμοποιείται ως το κύριο χρώμα για παροτρύνσεις για δράση. - Rausch 600
#e00b41— Μια πρεσσαριστή και σκούρα εκδοχή της βαφής Rausch για επιφάνειες που χρησιμοποιούνται ως διακοσμητικά στοιχεία μάρκας σε επιφάνειες που αιωρούνται/ενεργές επιφάνειες.
Ουδέτερος
- Hof
#222222— Το κύριο κείμενο, οι επικεφαλίδες, τα περιγράμματα των εικονιδίων και το ανεστραμμένο φόντο έχουν ουδέτερο χρώμα κοντά στο μαύρο, το οποίο χρησιμεύει ως βάση για ολόκληρο το αχρωματικό σύστημα. - Foggy
#6a6a6a— Δευτερεύον κείμενο, λεζάντες με σίγαση, βοηθητικό κείμενο, απενεργοποιημένο γέμισμα εικονιδίων και διακριτικά μεταδεδομένα κάτω από τους τίτλους καρτών. - Grey 500
#c1c1c1— Απενεργοποιημένο κείμενο, κείμενο κράτησης θέσης στα πεδία εισαγωγής και εικονίδια με σίγαση περιγράφουν τα σημεία όπου απαιτείται μείωση της έμφασης στην κατάσταση. - Bebe
#ebebeb— Λεπτά περιγράμματα, υπογραμμισμένα πεδία εισαγωγής, διαχωριστικά μεταξύ γραμμών λίστας και ανεπαίσθητες διαχωριστικές γραμμές. - Deco
#dddddd— Εικόνες φόντου κάρτας για ανενεργά κοντέινερ, σύμβολα κράτησης θέσης και απενεργοποιημένες καταστάσεις κάρτας. - Faint
#f7f7f7— Η εικόνα φόντου του καμβά σελίδας, η επιφάνεια υποσέλιδου και η κατάσταση κατάδειξης για τα διαδραστικά στοιχεία έχουν μια απαλή, κρεμ απόχρωση που διαφοροποιεί αυτήν τη σελίδα από τις καθαρά λευκές κάρτες.
Τυπογραφία
από 11 έως 28px · 5 βήματα
- Airbnb Cereal VF — αντικατάσταση: Circular · περιγράμματα 400, 500, 600, 700 · Μια προσαρμοσμένη γεωμετρική γραμματοσειρά sans-serif σχεδιασμένη για Airbnb. Το κείμενο στο κυρίως σώμα τοποθετείται στα 14px/400, οι ετικέτες UI στα 16px/500, οι επικεφαλίδες ενοτήτων στα 20px/600, 22px/500 με μικρή απόσταση μεταξύ των γραμμάτων -0,02em και οι επικεφαλίδες σελίδων στα 28px/700. Η αρνητική απόσταση μεταξύ των γραμμάτων μειώνεται με την αύξηση του μεγέθους, ένα χαρακτηριστικό των γεωμετρικών γραμματοσειρών sans-serif σε μεγαλύτερα μεγέθη οθόνης. Ενεργοποιεί τη λειτουργία εναλλακτικού γλύφου "salt".
Διαστήματα και μορφή
| Σκοπός | Εννοια |
|---|---|
| Πυκνότητα | πυκνός |
| Βασικό βήμα | 12px |
| Ακτίνα κουμπιού | 9999px |
| Ακτίνα κάρτας | 12px |
| Σκιές | απαλές σκιές |
| Μεταξύ τμημάτων | 48px |
| Πλάτος σελίδας | 1440px |
Η Τεχνητή Νοημοσύνη θα δημιουργήσει τον ιστότοπό σας σε στυλ Airbnb και θα τον γεμίσει
- Συμπληρώστε με προϊόντα και αναρτήσεις μέσω του συνδέσμου - Instagram, TikTok, Facebook.
- Μεταφέρετε περιεχόμενο από τον παλιό σας ιστότοπο—απλώς καθορίστε τη διεύθυνση.
- Μοντέρνος σχεδιασμός στην καλύτερη μηχανή αναζήτησης: React ( Next.js) με απόδοση διακομιστή και βελτιστοποίηση SEO από την πρώτη στιγμή.
- Πλήρως αυτοματοποιημένη βελτιστοποίηση SEO για αποτελέσματα αναζήτησης και προτάσεις νευρωνικών δικτύων.
Παρόμοια στυλ
- Apple (España) — λευκή βιτρίνα γκαλερί
- Silencio — Ένα λευκό δωμάτιο με αιωρούμενα αντικείμενα. Μια γκαλερί από ζεστό χαρτί, όπου κάθε στοιχείο καταλαμβάνει τη θέση του σε ένα φόντο αρνητικού όγκου, και η σιωπή είναι μια σκόπιμη σχεδιαστική απόφαση.
- Oakâme — Ένα ηλιόλουστο εργαστήριο Προβηγκίας σκαλισμένο από ζεστή πέτρα
- Nike — Μια μονόχρωμη συλλογή αθλητικών επιτευγμάτων – λευκοί τοίχοι, το προϊόν ως έργο τέχνης, χρώμιο διαλυμένο στο φόντο
- Arc — βιομηχανική λευκή γκαλερί πάνω από το νερό των μεσάνυχτων
- Rivian — Ένας ηλεκτρικός μονόλιθος στον τσιμεντένιο τοίχο της γκαλερί. Η Rivian παρουσιάζει κάθε όχημα ως γλυπτό σε έναν απέραντο λευκό χώρο, με τυπογραφία τόσο μεγάλη που γίνεται αρχιτεκτονικό στοιχείο, και ένα μόνο ζεστό κίτρινο που σπάει τη μονοχρωματική ατμόσφαιρα, σαν ηλιακό φως σε μια ματ επιφάνεια.
- Analogue — Μαύρη προθήκη γκαλερί – τα αγαθά αιωρούνται στο κενό
- ddna — ζεστή μουσειακή προθήκη σε ακατέργαστο λινό
- Zellerfeld — Ένα εργαστήριο γλύπτη σε λευκό μάρμαρο—οι μονολιθικές επιφάνειες του βάθρου, μια μοναδική σπίθα κοβαλτίου, ένας ψίθυρος πεζών γραμμάτων από το δάπεδο μέχρι την οροφή
- UY Studio — Η πέτρινη στοά του μοναστηριού είναι ένας ήσυχος χώρος με τσιμεντένιους τοίχους, όπου μπουκάλια αρωμάτων στέκονται σε λευκές βάσεις, φωτισμένες από μία λάμπα 400 watt και τέσσερις ζεστές γκρι λάμπες.
- Basic.Space — επιμελητική γκαλερί σε λευκό μάρμαρο
- COS — μια μοντέρνα γκαλερί με λευκούς τοίχους