Superlist
Un spațiu de lucru nocturn cu jar de coral - o suprafață liniștită de culoarea vinetei, unde o singură scânteie portocalie caldă semnalează fiecare acțiune
Superlist folosește un limbaj de productivitate în tonuri de violet închis la miezul nopții: vinete închise, coral cald ca unică culoare primară și titluri mari sans-serif care surprind întreaga atmosferă. Interfața evocă senzația de muncă concentrată pe timpul nopții - liniștită, stratificată și încrezătoare, culoarea fiind folosită doar ca punctuație funcțională pentru îndemnurile la acțiune, stările active și punctele cheie. Suprafețele sunt stratificate în tonuri subtile închise, cu o nuanță violetă (#181824 → #26253b), evitând negrul pur pentru a asigura că profunzimea se simte caldă, mai degrabă decât sterilă. Componentele prezintă forme rotunjite generoase (carduri de 20px, butoane tip pastilă), umbre delicate și „respiră” prin spații confortabile de 10-16px, mai degrabă decât prin grile strânse. Vocea titlului este totul: o pondere de 600 de puncte la 70-88px, cu o spațiere strânsă între litere de -0.02em, tratează textul ca fiind tipografic, mai degrabă decât ca interfață cu utilizatorul - este mai aproape de textele editoriale decât de SaaS.
Secțiunile întunecate se întind pe întreaga lățime a paginii, cu containere de conținut centrate, cu lățime maximă. Secțiunea principală este centrată vertical și conține un titlu, un subtext și un îndemn la acțiune (CTA), urmate de o captură de ecran mare a produsului care se suprapune peste secțiunea următoare. Secțiunile ulterioare alternează între blocuri de text centrate și grile de carduri. Secțiunea de recenzii folosește o grilă cu trei coloane, cu carduri de recenzii și 16 margini laterale. Navigarea se face printr-o singură bară superioară, cu un logo în stânga, linkuri centrate și acțiuni de conectare în dreapta - fără bară laterală fixă sau mega-meniu. Marginile laterale dintre secțiuni sunt generoase (16 margini laterale), creând un ritm editorial spațios, mai degrabă decât o grilă densă a produsului.
Spațiul vizual este dominat de capturi de ecran ale produselor - o ramă mare cu colțuri rotunjite, care prezintă interfața reală a aplicației, umple secțiunile principale și secundare. Fotografiile sunt minimaliste, folosite doar ca avatare ale utilizatorilor sau previzualizări ale conținutului media din aplicație (de exemplu, imaginea concertului din panoul din dreapta al machetei produsului). Logo-urile de pe bara de încredere sunt simboluri text plate, albe, estompate. Nu există ilustrații decorative, grafică abstractă sau randări 3D. Strategia vizuală este de a prezenta produsul la scară largă, de a lăsa tipografia să facă treaba emoțională și de a folosi coralul ca unică culoare de accent.
Paletă
Marca
- Coral Ember
#ff4a36— Portocaliul este folosit ca accent secundar pentru detalii decorative și pentru a evidenția indicii rare. Nu ar trebui folosit ca și culoare principală pentru îndemnuri la acțiune.
Neutru
- Aubergine Canvas
#181824— Fundalul paginii, pânza principală, este o nuanță caldă și închisă care înlocuiește negrul pur, făcând ca interfața cu utilizatorul să pară stratificată, mai degrabă decât plată. - Elevated Plum
#26253b— Suprafețe de card, câmpuri de introducere a datelor, containere de navigare - cu un pas mai ușor decât să folosești pânza pentru a crea profunzime fără o limită vizibilă. - Pure White
#ffffff— Titluri principale, text butoane și contururi pictograme - contrast maxim pe o pânză întunecată. - Fog Text
#696f81— Textul principal, titlurile secundare și marginile estompate - un raport de contrast de 7:1 pentru o citire confortabilă pe un fundal de culoarea vinetei. - Ash Text
#8e8da0— O culoare neutră este acceptată pentru elementele secundare ale interfeței utilizator, separatoare și etichete cu aspect estompat. Nu ar trebui utilizată ca și culoare principală pentru îndemnurile la acțiune. - Mist Highlight
#a3a3a7— Bordurile subtile, separatoarele și elementele de navigare inactive creează un ton neutru subtil care iese în evidență pe pânză.
Tipografie
de la 12 la 88px · 9 pași
- sans-serif — înlocuire: Inter · contururi 400 · sans-serif - găsit în datele extrase, dar nedescris de AI.
- Haffer XH SemiBold — înlocuire: Inter Tight · contururi 400, 600 · Fontul principal pentru afișare și titluri. Este folosit la o dimensiune de 70–88px pentru titlurile principale, cu o spațiere între litere de -0.02em și o grosime de 600. Spațierea îngustă a literelor și înălțimea mare a literelor conferă titlurilor o greutate editorială, făcând ca interfața întunecată să arate mai mult ca o copertă de revistă decât ca un tablou de bord. Înlocuiți cu Inter Tight sau General Sans cu o grosime îngroșată.
- Jersey 10 — înlocuire: Anybody · contururi 400 · Un font mare, decorativ, pentru numere de accent și evidențieri. Folosit cu moderație la dimensiuni foarte mari pentru a crea accente tipografice. Poate fi înlocuit cu Anybody sau Cabinet Grotesk.
Intervale și formă
| Scop | Sens |
|---|---|
| Densitate | medie |
| Pasul de bază | 10-16px |
| Raza butonului | 100px |
| Raza cardului | 20px |
| Umbre | umbre moi |
| Între secțiuni | 80px |
| Lățimea paginii | 1200px |
Inteligența artificială vă va construi site-ul web în stilul Superlist și îl va completa
- Completează cu produse și postări prin link - Instagram, TikTok, Facebook.
- Transferați conținut de pe vechiul site - specificați doar adresa.
- Design modern pe cel mai bun motor: React ( Next.js) cu randare pe server și optimizare SEO gata de utilizare.
- Optimizare SEO complet automatizată pentru rezultatele căutării și recomandări de rețele neuronale.
Stiluri similare
- DNA — Observatorul de la Miezul Nopții văzut printr-o lentilă de particule
- Abetterlou — Scântei pe piele de șa - Un font cremos cald, strălucitor pe un fundal negru intens de cafea, cu butoane aurii-chihlimbar care se simt ca metalul fierbinte apăsat în pagină.
- Galileo-ft — O punte de comandă în spațiul profund cu semnale albastru electric
- Decide AI — Observator la miezul nopții - semnal de mentă
- Redis Agency — Atelierul editorial, deschis după orele de program, este un loc întunecat ca smoala, unde toată munca de branding se face cu ajutorul fonturilor serif și al unei singure ridichi roșii.
- Spellbook — O sală de judecată de la miezul nopții, luminată cu cerneală coral - o suprafață editorială întunecată unde singurul sunet este tușa caldă și portocalie a stiloului
- Linear — instrument de precizie la miezul nopții
- Origin Financial — O galerie de opulență liniștită, ca de obicei în miezul nopții. O cameră liniștită, aproape întunecată, unde fonturi mari cu serife și câteva panouri colorate iluminate creează senzația că finanțele sunt o operă de artă atent selecționată.
- Hyperstudio — Designul este zgâriat în obsidian. Textul și liniile fine încadrează un spațiu alb de un negru pur, cu ocazionale urme aurii de busolă care indică drumul.
- Air — sculptura „Cerul de la miezul nopții prin sticlă”
- Raycast — Centrul de comandă de la miezul nopții, Coral Neon
- dope.security — Terminal de la miezul nopții cu balize mov