Calendly
Σκούρο μπλε μελάνι σε κρύο μάρμαρο
Το Calendly μοιάζει με έναν ήρεμο, σίγουρο χώρο εργασίας σχεδιασμού: ένας σχεδόν λευκός καμβάς με άφθονο χώρο για να αναπνεύσει κανείς, καθαρές λευκές κάρτες προϊόντων που αιωρούνται σε ένα ψυχρό γκρι φόντο και όλη η τυπογραφία αποδίδεται με σκούρο μπλε μελάνι αντί για καθαρό μαύρο. Το καθοριστικό στοιχείο είναι το σκούρο μπλε χρώμα (#0b3558), που χρησιμοποιείται παντού όπου εμφανίζεται κείμενο - τίτλοι, κουμπιά, εικονίδια, σύνδεσμοι - το οποίο μαλακώνει ολόκληρη τη διεπαφή, καθιστώντας την πιο ζεστή και κομψή από την τυπική σελίδα προορισμού SaaS. Ένα μόνο φωτεινό μπλε (#006bff) χρησιμοποιείται για όλες τις κύριες ενέργειες και διακοσμητικές ροζ και μπλε πιτσιλιές που εκτείνονται πέρα από τις διατάξεις των προϊόντων προσθέτουν ζεστασιά χωρίς να δημιουργούν ακαταστασία. Τα στοιχεία διατηρούνται διακριτικά: λεπτά περιγράμματα 1px, διακριτικές μπλε σκιές, μεγάλες ακτίνες καρτών 24px και γωνίες κουμπιών 8px φαίνονται σκόπιμα και όχι μονότονα.
Μέγιστο πλάτος 1200px, στο κέντρο, με μεγάλα περιθώρια στην επιφάνεια εργασίας. Η κύρια οθόνη χωρίζεται σε δύο στήλες: η αριστερή στήλη περιέχει μια κεφαλίδα 80px + κείμενο σώματος + στοιβαγμένα κουμπιά σύνδεσης, ενώ η δεξιά στήλη περιέχει μια κάρτα widget κράτησης με διακοσμητικά στοιχεία στο φόντο. Κάτω από την κύρια οθόνη υπάρχει μια ενιαία λωρίδα πλήρους πλάτους με το λογότυπο της Trust. Οι επόμενες ενότητες εναλλάσσονται μεταξύ κεντραρισμένων μπλοκ κεφαλίδας (H2 + δευτερεύον κείμενο + προαιρετική παρότρυνση για δράση), ακολουθούμενες από μπλοκ δύο στηλών που περιγράφουν χαρακτηριστικά (κείμενο αριστερά/προϊόν δεξιά ή προϊόν αριστερά/κείμενο δεξιά) με διακοσμητικά στοιχεία έμφασης πίσω από κάθε εικόνα προϊόντος. Τα πλέγματα καρτών σπάνια χρησιμοποιούνται—η διάταξη ευνοεί τα ζευγαρωμένα τμήματα τοποθετημένα δίπλα-δίπλα αντί για πλέγματα πολλαπλών στηλών. Η απόσταση μεταξύ των ενοτήτων κυμαίνεται από 48 έως 64px. Η πλοήγηση είναι μια σταθερή επάνω γραμμή 64px με το λογότυπο στα αριστερά, ένα κεντραρισμένο μενού και μια ομάδα παροτρύνσεων για δράση στα δεξιά.
Το κύριο οπτικό στοιχείο είναι στιγμιότυπα οθόνης προϊόντων—απλά μακέτες της διεπαφής χρήστη του ημερολογίου κρατήσεων, που αποδίδονται σε ευκρινείς λευκές κάρτες με φαρδιές, στρογγυλεμένες γωνίες. Διακοσμητικός σχεδιασμός: κάθε κάρτα προϊόντος περιβάλλεται από μια απαλή κηλίδα σε κοραλλιογενές μωβ (#e55cff) ή γαλάζιο μπλε (#0099ff), ελαφρώς μετατοπισμένη και θολή, δημιουργώντας ένα εφέ κολάζ αντί για ένα επίπεδο στιγμιότυπο οθόνης. Δεν υπάρχουν φωτογραφίες, δεν υπάρχουν εικόνες lifestyle—όλα τα οπτικά στοιχεία αντιπροσωπεύουν τη διεπαφή χρήστη του προϊόντος, αφηρημένα σχήματα έμφασης ή μονόχρωμα λογότυπα συνεργατών στη γραμμή εμπιστοσύνης. Τα εικονίδια είναι γραμμικά με πλάτος γραμμής 1,5–2px, μονόχρωμα, σε σκούρο μπλε (Ink Navy) ή μπλε (Signal Blue).
Παλέτα
Μάρκα
- Ink Navy
#0b3558— Κύριο κείμενο, επικεφαλίδες, εικονίδια, σκούρο φόντο για παροτρύνσεις για δράση, σύνδεσμοι πλοήγησης. - Signal Blue
#006bff— Κύρια παρότρυνση για δράση (CTA), ενεργή πλοήγηση, έμφαση συνδέσμου, επιλεγμένες καταστάσεις
Ουδέτερος
- Carbon
#0a0a0a— Κείμενο σε καθαρό μαύρο χρώμα (εφεδρικό), σύμβολο λογότυπου, γέμισμα εικονιδίου. - Slate Gray
#476788— Επιπλέον κύριο κείμενο, υποστηρικτικό κείμενο, ετικέτες σε σίγαση. - Mist Gray
#a6bbd1— Απενεργοποιημένο κείμενο, ετικέτες ανενεργών λειτουργιών, περιγράμματα φωτεινών εικονιδίων - Cloud
#f8f9fb— Καμβάς σελίδας, φόντο υποσέλιδου, επιπλέον επιφάνεια - Paper
#ffffff— Επιφάνειες καρτών, ανάγλυφα πάνελ, κείμενο κουμπιών σε σκούρο φόντο. - Pebble
#f0f3f8— Εικόνες φόντου για εικονίδια, σκίαση πεδίων εισαγωγής, διακριτικά διαχωριστικά, εφέ αιώρησης.
Τυπογραφία
από 12 έως 80px · 10 βήματα
- Gilroy — αντικατάσταση: Manrope · περιγράμματα 400, 500, 600, 700 · Όλο το κείμενο της διεπαφής. Το Gilroy είναι ένα γεωμετρικό ουμανιστικό sans-serif με μεγάλα ανοίγματα και ομοιόμορφη αντίθεση περιγράμματος. Τα έντονα βάρη του (700) χρησιμοποιούνται για επικεφαλίδες, ενώ τα 500–600 χρησιμοποιούνται για κουμπιά και υποεπικεφαλίδες. Αντικαταστήστε με Manrope ή Inter.
- Gilroy — αντικατάσταση: Inter · περιγράμματα 400 · Κείμενο σώματος και ετικέτες UI γενικής χρήσης - Το βάρος γραμματοσειράς 400 σημείων διασφαλίζει ότι τα μεγάλα κείμενα είναι ευανάγνωστα χωρίς να φαίνονται βαριά.
- Gilroy — αντικατάσταση: Inter · περιγράμματα 500 · Δευτερεύουσες επικεφαλίδες και επισημασμένο κείμενο σώματος - Η γραμματοσειρά 14/500 είναι το κύριο εργαλείο για επικεφαλίδες καρτών και ενσωματωμένες ετικέτες.
Διαστήματα και μορφή
| Σκοπός | Εννοια |
|---|---|
| Πυκνότητα | πυκνός |
| Βασικό βήμα | 8-16px |
| Ακτίνα κουμπιού | 8px |
| Ακτίνα κάρτας | 24px |
| Σκιές | χωρίς περιγράμματα αντί για σκιές |
| Μεταξύ τμημάτων | 48-64px |
| Πλάτος σελίδας | 1200px |
Η Τεχνητή Νοημοσύνη θα δημιουργήσει τον ιστότοπό σας σε στυλ Calendly και θα τον γεμίσει
- Συμπληρώστε με προϊόντα και αναρτήσεις μέσω του συνδέσμου - Instagram, TikTok, Facebook.
- Μεταφέρετε περιεχόμενο από τον παλιό σας ιστότοπο—απλώς καθορίστε τη διεύθυνση.
- Μοντέρνος σχεδιασμός στην καλύτερη μηχανή αναζήτησης: React ( Next.js) με απόδοση διακομιστή και βελτιστοποίηση SEO από την πρώτη στιγμή.
- Πλήρως αυτοματοποιημένη βελτιστοποίηση SEO για αποτελέσματα αναζήτησης και προτάσεις νευρωνικών δικτύων.
Παρόμοια στυλ
- ElevenLabs — Ένα φωτογραφικό δοκίμιο σε ζεστές κρεμ αποχρώσεις με διακριτικούς τίτλους. Ένα σημειωματάριο σε στιλ Bauhaus—χαρτί στο χρώμα του κελύφους του αυγού, μαύρο μελάνι και μία μόνο μωβ και πορτοκαλί πινελιά για την προβολή του προϊόντος.
- Awesomic — Συντακτικό πλέγμα ψευδαργύρου με πορτοκαλί σημεία στίξης που θυμίζουν κομφετί
- Monad — συντακτικό τεχνικό περιοδικό σε θερμή περγαμηνή
- Dub — Πίνακας ελέγχου από ματ ριζόχαρτο της Link
- Seline Analytics — Ένα ήσυχο αναλυτικό τραπέζι σε ζεστό χαρτί
- Notion — Ένα ζεστό χάρτινο σημειωματάριο στον μεσημεριανό ήλιο
- Anthropic — Ένα επιστημονικό περιοδικό πεδίου για τη ζεστή περγαμηνή - ήρεμες επιφάνειες σε χρώμα ελεφαντόδοντου, επικεφαλίδες με ραβδώσεις και μια μοναδική πινελιά από πηλό που εμφανίζεται μόνο όταν χρειάζεται δράση.
- Augen Pro — Η λευκή παρουσίαση της Apple διαθέτει ένα κλινικό, χωρίς βάρος, ηλεκτρικό μπλε ως τη μοναδική πινελιά σε έναν μονόχρωμο χώρο.
- Antimetal — Ένα συντακτικό χρονικό σε κρεμ χαρτί—ένα ήσυχο πρωινό σε ένα επιστημονικό περιοδικό, όπου η αυτοσυγκράτηση μεταδίδει αυτοπεποίθηση και οι σερίφηδες κάνουν τη δύσκολη δουλειά
- Perk — Ηλεκτρικό λάιμ σε ζεστή λαδόκολλα
- Ditto — Ένα ηλιόλουστο εργαστήριο δημιουργίας δειγμάτων αγριολούλουδων. Ζεστές κρεμ επιφάνειες, ένα έντονο κίτρινο βασικό χρώμα, βαθιά μπλε μελάνια, οργανικές χρωματικές μορφές που ανθίζουν πίσω από το έργο.
- Officevibe — Ένα εκδοτικό περιοδικό σε ζεστό κρεμ χαρτί. Φανταστείτε ένα στοχαστικό δοκίμιο για τη διαχείριση ανθρώπινου δυναμικού, που παρουσιάζεται ως προϊόν - μια καλλιγραφική γραμματοσειρά serif που ψιθυρίζει μέσα από μια μοντέρνα μπλε διεπαφή.