Telegram, WhatsApp+380637610482
Βαλέρι Ντανιούκ
Βαλέρι ΝτανιούκπρογραμματιστήςΑνάπτυξη εργαλείων Τεχνητής Νοημοσύνης για επιχειρήσεις. Υψηλής ποιότητας. Προσιτό.Αποστολή μηνύματος στο Telegram
MAKR — μια προεπισκόπηση ενός ιστότοπου σε αυτό το στυλ

MAKR

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

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

Διάταξη από άκρη σε άκρη χωρίς μέγιστο όριο πλάτους περιεχομένου—οι εικόνες γεμίζουν ολόκληρο το παράθυρο προβολής. Το επάνω διαφημιστικό banner καταλαμβάνει το πλήρες πλάτος, ακολουθούμενο από πλοήγηση κεφαλίδας πλήρους πλάτους. Η κύρια περιοχή περιεχομένου χρησιμοποιεί ένα πλέγμα εικόνων πολλαπλών στηλών (2-3 στήλες στην επιφάνεια εργασίας) με μηδενικά ή ελάχιστα κενά, επιτρέποντας στις φωτογραφίες να δημιουργήσουν τη δική τους οπτική δομή. Το κείμενο και οι σύνδεσμοι τοποθετούνται σε λευκούς χώρους κάτω από τις εικόνες, χωρίς ποτέ να επικαλύπτονται. Οι ενότητες σύνταξης εναλλάσσονται μεταξύ πλεγμάτων προϊόντων και φωτογραφιών lifestyle πλήρους πλάτους. Ο κάθετος ρυθμός είναι γενναιόδωρος (80-1,5 κενά μεταξύ των ενοτήτων), δημιουργώντας την αίσθηση ότι περπατάτε σε μια γκαλερί. Η λειτουργία εγγραφής στο ενημερωτικό δελτίο είναι ένα σταθερό, κάτω αριστερά πλαίσιο. Ένα κλείσιμο πλαισίου εγγραφής τοποθετείται στο κάτω μέρος του παραθύρου προβολής. Η συνολική εντύπωση είναι αυτή ενός καταλόγου μουσείου ή ενός συντακτικού ανοίγματος, αντί για μια τυπική διάταξη ηλεκτρονικού εμπορίου.

Η φωτογραφία είναι το βασικό περιεχόμενο και η γλώσσα της μάρκας. Δύο στοιχεία συνυπάρχουν: (1) μεγάλες ασπρόμαυρες λήψεις του προϊόντος στο χέρι, τετράγωνες ή κομμένες σε αναλογία 3:4, με υψηλή αντίθεση, το αντικείμενο γεμίζει το κάδρο χωρίς να θίγει το lifestyle πλαίσιο· (2) έγχρωμες φωτογραφίες lifestyle σε ζεστό φυσικό φως, τοπία σε γήινους τόνους, μοντέλα εν κινήσει με τσάντες, γυρισμένες από χαμηλές γωνίες με μικρό βάθος πεδίου. Η εναλλαγή εικόνων σε κλίμακα του γκρι και έγχρωμων εικόνων δημιουργεί έναν ενιαίο οπτικό ρυθμό στη σελίδα. Χωρίς εικόνες, χωρίς τρισδιάστατες απεικονίσεις, χωρίς αφηρημένα γραφικά. Οι εικόνες καταλαμβάνουν ολόκληρη τη σελίδα ή εκτείνονται σε όλο το πλάτος της σελίδας, σε κελιά πλέγματος με μηδενική ακτίνα και χωρίς περιγράμματα. Τα εικονίδια απουσιάζουν ή είναι ελάχιστα—ένας απλός σταυρός για κλείσιμο, και τίποτα περισσότερο.

Παλέτα

Ουδέτερος

  • Obsidian Ink #1c1717 — Το κύριο κείμενο, όλοι οι σύνδεσμοι κειμένου, το κυρίως κείμενο, οι επικεφαλίδες, τα περιγράμματα των εικονιδίων και οι ανεπαίσθητες γραμμές περιγράμματος σε όλη τη διεπαφή χρήστη. Αυτό είναι το κύριο χρώμα—αναλογία 17,7:1 σε λευκό φόντο, που χρησιμοποιείται σε πάνω από 5.000 περιπτώσεις. Ο πολύ ανεπαίσθητος ζεστός τόνος του (όχι καθαρό μαύρο) δίνει σε ολόκληρη τη διεπαφή την αίσθηση ενός έντυπου καταλόγου και όχι μιας οθόνης.
  • Paper #ffffff — Λεπτά περιγράμματα, διαχωριστικά, περιγράμματα πεδίων εισαγωγής και άκρες καρτών σε ανοιχτόχρωμες επιφάνειες. Αποφύγετε τη χρήση αυτού του χρώματος ως κύριου χρώματος για κουμπιά παρότρυνσης για δράση.
  • Bone #f0f0f0 — Μια δευτερεύουσα επιφάνεια για εναλλασσόμενες ενότητες, δημιουργώντας διακριτικά φόντα πάνελ και εσωτερικά περιγράμματα/διαχωριστικά. Δημιουργεί μια διακριτική ζεστή γκρι απόχρωση ανάμεσα στο λευκό του χαρτιού και το ανοιχτό πράσινο της διαφήμισης.
  • Eucalyptus Mist #a9aea9 — Το φόντο της διαφήμισης banner στο επάνω μέρος της σελίδας, οι απαλές μεταβάσεις χρωμάτων μεταξύ των ενοτήτων και ένα τριτεύον πλαίσιο. Από μόνο του, φαίνεται σχεδόν γκρι, αλλά όταν χρησιμοποιείται σε όλο το πλάτος, αποκτά μια διακριτική φασκόμηλο απόχρωση—την μόνη χρωματική έμφαση στο μονόχρωμο σχήμα.

Τυπογραφία

από 11 έως 32px · 5 βήματα

  • Sohne Web — αντικατάσταση: Inter · περιγράμματα 400 · Χρησιμοποιείται ολόκληρο το στυλ διεπαφής—το κύριο κείμενο, η πλοήγηση, οι σύνδεσμοι, οι επικεφαλίδες, τα κουμπιά, τα πεδία εισαγωγής, τα εικονίδια και οι λεζάντες εικόνων. Η γραμματοσειρά Sohne βάρους 400 (δεν βρέθηκαν έντονες παραλλαγές) δίνει στο MAKR την ήρεμη αλλά και γεμάτη αυτοπεποίθηση εκφραστικότητά του: οι πληροφορίες μεταφέρονται μέσω του μεγέθους και της απόστασης μεταξύ γραμμάτων, όχι μέσω της αντίθεσης πάχους. Εναλλακτικές: Inter, Söhne ή Untitled Sans.
  • CircularXXMonoWeb — αντικατάσταση: JetBrains Mono · περιγράμματα 400 · Χρησιμοποιείται μόνο για περιστασιακές τεχνικές οδηγίες ή προδιαγραφές προϊόντων—ένας ψίθυρος monospaced που σπάει τον νεο-γκροτέσκο ρυθμό. Χρησιμοποιήστε με φειδώ: κωδικό προϊόντος, προδιαγραφές υλικού, τίποτα περισσότερο. Αντικαταστήστε με: JetBrains Mono ή IBM Plex Mono.

Διαστήματα και μορφή

ΣκοπόςΕννοια
Πυκνότηταπυκνός
Βασικό βήμα5-8px
Ακτίνα κουμπιού0px
Ακτίνα κάρτας0px
Σκιέςχωρίς περιγράμματα αντί για σκιές
Μεταξύ τμημάτων80-120px

Η Τεχνητή Νοημοσύνη θα δημιουργήσει τον ιστότοπό σας σε στυλ MAKR και θα τον γεμίσει

  • Συμπληρώστε με προϊόντα και αναρτήσεις μέσω του συνδέσμου - Instagram, TikTok, Facebook.
  • Μεταφέρετε περιεχόμενο από τον παλιό σας ιστότοπο—απλώς καθορίστε τη διεύθυνση.
  • Μοντέρνος σχεδιασμός στην καλύτερη μηχανή αναζήτησης: React ( Next.js) με απόδοση διακομιστή και βελτιστοποίηση SEO από την πρώτη στιγμή.
  • Πλήρως αυτοματοποιημένη βελτιστοποίηση SEO για αποτελέσματα αναζήτησης και προτάσεις νευρωνικών δικτύων.

Παρόμοια στυλ

  • FARFETCH España — Μια γκαλερί μόδας σε στυλ «λευκού κύβου». Φανταστείτε έναν πολυτελές χώρο λιανικής πώλησης όπου οι τοίχοι, τα πατώματα και τα φωτιστικά είναι βαμμένα σε λευκό χρώμα και μόνο τα ρούχα και οι άνθρωποι που τα φορούν δημιουργούν κάθε απόχρωση, υφή και οπτική έκφραση.
  • Franco Maria Ricci Editore — Κατάλογος της Art Deco Gallery - Γυαλισμένες χρυσές γραμμές σε τραγανή λευκή περγαμηνή
  • Laura Monin — Τοίχος εκδοτικής γκαλερί, λευκό μάρμαρο, σφραγίδα μελανιού
  • OhDada — Τοίχος της εκδοτικής γκαλερί
  • Cursor — Ένα ζεστό εργαστήριο περγαμηνής, φωτισμένο από αναμμένα κάρβουνα
  • Structured — Αναγεννησιακή γκαλερί σε χαρτί σαν πλαστελίνη
  • MindMarket — Ένα ζεστό βιβλίο παραμυθιού σε κρεμ χαρτί - ένας φιλικός εκδοτικός καμβάς όπου μεγάλοι τίτλοι της Inter και κομμένοι χάρτινοι χαρακτήρες συνυπάρχουν σε μια ηλιόλουστη, μαλακή σαν αυτοκόλλητο επιφάνεια.
  • Airbnb — Ένας ήσυχος λευκός τοίχος γκαλερί με έναν μόνο κοραλλιογενή σελιδοδείκτη
  • Apple (España) — Η γκαλερί του μουσείου, σε απαλό φως ημέρας, είναι ένας ενιαίος, σαγηνευτικός, χωρίς βαρύτητα λευκός χώρος, με κάθε έκθεμα να φωτίζεται από έναν προβολέα σε έναν ελαφρώς φιμέ τοίχο.
  • Lamborghini — Μαύρο χρώμα αμαξώματος στην αίθουσα εκθέσεων, κάτω από τους προβολείς - ένα κίτρινο αυτοκίνητο
  • Amplemarket — Ένας ηλιόλουστος χώρος εργασίας γεμάτος κομφετί
  • Getharvest — Ένα γραφείο σε χρυσή ώρα – ένας ζεστός κρεμ καμβάς, λευκές καρτ ποστάλ κρεμασμένες στον καμβά και μια μόνο φωτεινή πορτοκαλί φλόγα