Superlist
Öine tööruum korallide hõõguvate söega – vaikne baklažaanilaadne rakenduspind, kus iga tegevust annab märku üks soe oranž säde
Superlist kasutab kesköislillades toonides produktiivsuskeelt: sügav baklažaanikarva, soe korall ainsa põhivärvina ja suured sans-serif pealkirjad, mis haaravad kogu atmosfääri. Liides tekitab tunde hilisõhtusest keskendunud tööst – vaikne, kihiline ja enesekindel, kusjuures värve kasutatakse ainult funktsionaalsete kirjavahemärkidena üleskutsetes tegutsemisele, aktiivsetes olekutes ja põhipunktides. Pinnad on kihilised õrnades tumedates toonides lilla alatooniga (#181824 → #26253b), vältides puhast musta, et tagada sügavuse soe, mitte steriilne tunne. Komponentidel on helded ümarad kujundid (20px kaardid, tabletinupud), pehmed varjud ja need "hingavad" läbi mugavate 10–16px vahede, mitte tihedate ruudustike. Pealkirja hääl on kõik: 600-punktiline kaal 70–88px ja tihe tähevahe -0,02em käsitleb teksti pigem tüpograafilise kui kasutajaliidesena – see on pigem toimetuse tekstile kui SaaS-ile.
Tumedad sektsioonid katavad kogu lehe laiuse, tsentreeritud maksimaalse laiusega sisukonteineritega. Põhiosa on vertikaalselt tsentreeritud ja sisaldab pealkirja, allteksti ja kutset tegevusele (CTA), millele järgneb suur toote ekraanipilt, mis kattub järgmise sektsiooniga. Järgnevad sektsioonid vahelduvad tsentreeritud tekstiplokkide ja kaardiruudustiku vahel. Arvustuste sektsioonis kasutatakse kolmeveerulist ruudustikku arvustuskaartide ja 16 veeruga. Navigeerimine on üks ülemine riba, mille vasakul on logo, tsentreeritud lingid ja paremal sisselogimistoimingud – fikseeritud külgriba ega megamenüüd pole. Sektsioonidevahelised veerud on helded (16 veeruriba), luues avara ja toimetusliku rütmi tiheda tooteruudustiku asemel.
Visuaalses ruumis domineerivad toote ekraanipildid – põhi- ja lisaosa täidab suur ümarate nurkadega raam, mis näitab rakenduse tegelikku liidest. Fotosid on minimaalselt, neid kasutatakse ainult kasutaja avataride või rakendusesisese meedia eelvaadetena (näiteks kontserdi pilt toote maketi paremal paneelil). Usaldusriba logod on lamedad, summutatud valged tekstisümbolid. Puuduvad dekoratiivsed illustratsioonid, abstraktne graafika ega 3D-renderdused. Visuaalne strateegia on esitleda toodet skaalal, lasta tüpograafial teha emotsionaalne töö ja kasutada koralli ainsa aktsentvärvina.
Palett
Bränd
- Coral Ember
#ff4a36— Oranži kasutatakse dekoratiivsete detailide ja harvaesinevate vihjete esiletõstmiseks teisejärgulise aktsendina. Seda ei tohiks kasutada tegevusele kutsuvate tekstide põhivärvina.
Neutraalne
- Aubergine Canvas
#181824— Lehe taust, peamine lõuend, on soe, tume toon, mis asendab puhast musta, muutes kasutajaliidese pigem kihiliseks kui tasaseks. - Elevated Plum
#26253b— Kaardipinnad, sisestusväljad, navigeerimiskonteinerid – sügavuse loomine ilma nähtava piirita on sammu võrra lihtsam kui lõuendil. - Pure White
#ffffff— Pealkirjad, nuppude tekst ja ikoonide piirjooned – maksimaalne kontrastsus tumedal lõuendil. - Fog Text
#696f81— Põhiteksti, teisejärguliste pealkirjade ja summutatud ääriste kontrastsussuhe on kõik 7:1, et baklažaanivärvi taustal oleks mugav lugeda. - Ash Text
#8e8da0— Neutraalset värvi toetatakse kasutajaliidese sekundaarsete elementide, eraldajate ja summutatud siltide jaoks. Seda ei tohiks kasutada tegevusele kutsuvate tekstide põhivärvina. - Mist Highlight
#a3a3a7— Peened äärised, eraldajad ja mitteaktiivsed navigeerimiselemendid loovad peene neutraalse tooni, mis paistab lõuendi taustal siiski silma.
Tüpograafia
12-st 88 pikslini · 9 sammu
- sans-serif — asendamine: Inter · kontuurid 400 · sans-serif – leitud andmetest, kuid tehisintellekt seda ei kirjelda.
- Haffer XH SemiBold — asendamine: Inter Tight · kontuurid 400, 600 · Peamine font kuvamiseks ja pealkirjade jaoks. Seda kasutatakse suuruses 70–88 pikslit põhipealkirjade puhul, tähevahega -0,02em ja tähekaaluga 600. Kitsas tähevahe ja suur tähekõrgus annavad pealkirjadele toimetusliku kaalu, muutes tumeda liidese pigem ajakirjakaane kui armatuurlaua sarnaseks. Asendage see paksus kirjas Inter Tighti või General Sansiga.
- Jersey 10 — asendamine: Anybody · kontuurid 400 · Suur dekoratiivne font numbrite ja esiletõstmiste jaoks. Kasutatakse harva väga suurte suuruste puhul tüpograafiliste aktsentide loomiseks. Asendatav fontidega Anybody või Cabinet Grotesk.
Intervallid ja vorm
| Eesmärk | Tähendus |
|---|---|
| Tihedus | keskmine |
| Põhisamm | 10-16px |
| Nupu raadius | 100px |
| Kaardi raadius | 20px |
| Varjud | pehmed varjud |
| Sektsioonide vahel | 80px |
| Lehe laius | 1200px |
Tehisintellekt loob teie veebisaidi Superlist stiilis ja täidab selle
- Täida toodete ja postitustega lingi kaudu - Instagram, TikTok, Facebook.
- Kanna sisu oma vanalt saidilt üle – täpsusta lihtsalt aadress.
- Moodne disain parimal mootoril: React ( Next.js) koos serveri renderdamise ja SEO optimeerimisega koheselt.
- Täisautomaatne SEO optimeerimine otsingutulemuste ja närvivõrgu soovituste jaoks.
Sarnased stiilid
- DNA — Keskööobservatoorium osakesteläätse kaudu vaadatuna
- Abetterlou — Sparks on Saddle Leather – soe kreemjas font, mis helendab sügaval kohvimustal taustal, merevaigukollaste nuppudega, mis tunduvad nagu lehele surutud kuum metall.
- Galileo-ft — Süvakosmose juhtimistekk elektrisiniste signaalidega
- Decide AI — Observatoorium keskööl - rahapaja signaal
- Redis Agency — Toimetuse töötuba, mis on avatud ka pärast lahtiolekuaega, on kottpime koht, kus kogu brändingutöö tehakse ära serif-fontide ja ühe punase redise abil.
- Spellbook — Koralltindiga valgustatud kesköine kohtusaal – tume toimetuse pind, kus ainus heli on soe oranž pliiatsitõmme
- Linear — kesköö täppisinstrument
- Origin Financial — Kesköösel vaikse külluse galerii. Vaikne, peaaegu pime ruum, kus suured serif-fondid ja mõned valgustatud värvilised paneelid loovad tunde, et rahandus on hoolikalt kureeritud kunstiteos.
- Hyperstudio — Kujundus on kraabitud obsidiaani. Tekst ja peened jooned raamivad puhta musta valget ala, kus kohati on teed näitamas kuldsed kompassimärgid.
- Air — skulptuur "Kesköötaevas läbi klaasi"
- Raycast — Kesköö juhtimiskeskus, Coral Neon
- dope.security — Keskööterminal lillade majakatega