Superlist
Gaueko lan-eremu bat koralezko txingarrez beteta — berenjena koloreko gainazal lasai bat, non laranja koloreko txinparta epel bakar batek ekintza guztiak adierazten dituen.
Superlist-ek produktibitate-hizkuntza erabiltzen du gauerdiko more tonuetan: berenjena iluna, koral epela kolore nagusi bakar gisa, eta giro osoa jasotzen duten sans-serif titulu handiak. Interfazeak gaueko lanaren sentsazioa ekartzen du gogora: lasaia, geruzatua eta ziurra, kolorea ekintzarako deietan, egoera aktiboetan eta puntu gakoetan puntuazio funtzional gisa soilik erabiliz. Gainazalak tonu ilun sotiletan geruzatuta daude, azpiko more batekin (#181824 → #26253b), beltz hutsa saihestuz sakontasuna antzua baino beroa sentiarazteko. Osagaiak forma biribildu eskuzabalak dituzte (20px-ko txartelak, pilula botoiak), itzal leunak eta 10-16px-ko tarte erosoen bidez "arnas hartzen" dute, sareta estuen ordez. Titularren ahotsa da dena: 600 puntuko pisuak, 70-88px-tan eta -0.02em-ko letra-tarte estuarekin, testua tipografikotzat hartzen du UI baino gehiago; SaaS baino testu editorialaren antzekoagoa da.
Atal ilunek orriaren zabalera osoa hartzen dute, erdian dauden edukiontziekin, gehienezko zabalerarekin. Atal nagusia bertikalki erdian dago eta izenburua, azpitestua eta ekintzarako deia (CTA) ditu, eta ondoren produktuaren pantaila-argazki handi bat hurrengo atalaren gainean jartzen da. Ondorengo atalak erdiko testu-blokeen eta txartel-sareen artean txandakatzen dira. Iritzien atalak hiru zutabeko sareta bat erabiltzen du, iritzi-txartelekin eta 16 zutabe-lerroekin. Nabigazioa goiko barra bakarra da, ezkerrean logotipo bat, erdian dauden estekak eta eskuinean saioa hasteko ekintzak dituena; ez dago alboko barra finkorik edo mega-menurik. Atalen arteko zutabe-lerroak zabalak dira (16 zutabe-lerro), produktu-sare trinko baten ordez erritmo editorial zabala sortuz.
Espazio bisuala produktuen pantaila-argazkiek osatzen dute nagusiki: aplikazioaren interfazea erakusten duen ertz biribilduak dituen marko handi batek betetzen ditu atal nagusiak eta bigarren mailakoak. Argazkiak minimalistak dira, erabiltzaileen avatar edo aplikazio barruko multimediaren aurrebista gisa soilik erabiltzen dira (adibidez, produktuaren maketaren eskuineko panelean dagoen kontzertuaren irudia). Konfiantza-barrako logotipoak testu zuri lauak eta isilak dira. Ez dago ilustrazio apaingarririk, ez grafiko abstrakturik, ez 3D renderizaziorik. Estrategia bisuala produktua eskalan erakustea da, tipografiak lan emozionala egiten uztea eta korala erabiltzea azentu-kolore bakar gisa.
Paleta
Marka
- Coral Ember
#ff4a36— Laranja bigarren mailako azentu gisa erabiltzen da xehetasun apaingarrietarako eta ohikoak ez diren seinaleak nabarmentzeko. Ez da erabili behar ekintzarako deietarako kolore nagusi gisa.
Neutroa
- Aubergine Canvas
#181824— Orriaren atzeko planoa, mihise nagusia, beltz hutsa ordezkatzen duen tonu ilun eta bero bat da, erabiltzailearen interfazea laua baino geruzatan agerraraziz. - Elevated Plum
#26253b— Txartelen gainazalak, sarrera-eremuak, nabigazio-ontziak... mihisea baino urrats bat errazagoa da sakonera sortzeko mugarik gabe. - Pure White
#ffffff— Izenburu nagusiak, botoien testua eta ikonoen eskemak — kontraste maximoa mihise ilun batean. - Fog Text
#696f81— Testu nagusiak, bigarren mailako izenburuek eta ertz isilak 7:1eko kontraste-erlazioa dute, berenjena koloreko atzeko planoaren aurrean eroso irakurtzeko. - Ash Text
#8e8da0— Kolore neutroa onartzen da bigarren mailako UI elementuetarako, banatzaileetarako eta etiketa isilduetarako. Ez da erabili behar ekintzarako deietarako kolore nagusi gisa. - Mist Highlight
#a3a3a7— Ertz, banatzaile eta nabigazio elementu inaktibo sotilek mihisearen aurrean nabarmentzen den tonu neutro sotila sortzen dute.
Tipografia
12tik 88px-ra · 9 urrats
- sans-serif — ordezkapena: Inter · eskemak 400 · sans-serif - ateratako datuetan aurkitu da, baina ez du IA-k deskribatu.
- Haffer XH SemiBold — ordezkapena: Inter Tight · eskemak 400, 600 · Bistaratzeko eta goiburuetarako letra-tipo nagusia. 70–88px-ko tamainan erabiltzen da goiburu nagusietarako, -0.02em-ko letren arteko tartearekin eta 600eko pisuarekin. Letren arteko tarte estuak eta letren altuera handiak goiburuei pisu editoriala ematen diete, interfaze iluna aldizkari baten azal baten antza handiagoa izanik kontrol-panelean baino. Ordezkatu Inter Tight edo General Sans-ekin, loditasun lodian.
- Jersey 10 — ordezkapena: Anybody · eskemak 400 · Zenbaki eta nabarmenduretarako letra-tipo handi eta apaingarria. Tamaina oso handietan gutxitan erabiltzen da azentu tipografikoak sortzeko. Anybody edo Cabinet Grotesk-ekin ordezkatu daiteke.
Tarteak eta forma
| Helburua | Esanahia |
|---|---|
| Dentsitatea | batez bestekoa |
| Oinarrizko urratsa | 10-16px |
| Botoiaren erradioa | 100px |
| Txartelaren erradioa | 20px |
| Itzalak | itzal leunak |
| Atalen artean | 80px |
| Orriaren zabalera | 1200px |
Adimen artifizialak zure webgunea Superlist estiloan eraikiko du eta beteko du
- Bete produktu eta argitalpenekin estekaren bidez - Instagram, TikTok, Facebook.
- Transferitu edukia zure gune zaharretik: zehaztu helbidea.
- Diseinu modernoa motor onenean: React ( Next.js) zerbitzariaren errendatzearekin eta SEO optimizazioarekin hasieratik.
- Bilaketa-emaitzetarako eta sare neuronalen gomendioetarako SEO optimizazio guztiz automatizatua.
Estilo antzekoak
- DNA — Gauerdiko Behatokia partikula-lente baten bidez ikusita
- Abetterlou — Sparks on Saddle Larruzko txinpartak - kafe-beltz koloreko atzealde sakon baten gainean distiratzen duen letra-tipo krematsu epela, orrialdean sakatutako metal beroa balira bezala sentitzen diren anbar-urrezko botoiekin.
- Galileo-ft — Espazio sakoneko aginte-plataforma bat, seinale urdin elektrikoekin
- Decide AI — Behatokia gauerdian - seinale berria
- Redis Agency — Erredakzio tailerra, orduz kanpo irekita, leku ilun bat da, non marka-lan guztia serif letra-tipoekin eta errefau gorri bakar batekin egiten den.
- Spellbook — Gauerdiko epaitegi bat koral tintaz argiztatuta —editorial gainazal ilun bat, non soinu bakarra boligrafo laranja epelaren trazua den
- Linear — gauerdiko zehaztasun-tresna
- Origin Financial — Gauerdiko galeria oparoa eta isila. Gela isila eta ia iluna, non serif letra-tipo handiek eta koloretako panel argiztatu batzuek finantzak arretaz zaindutako artelan bat direlako sentsazioa sortzen duten.
- Hyperstudio — Diseinua obsidianan marraztuta dago. Testuak eta lerro finek beltz hutsezko espazio zuri bat inguratzen dute, noizean behin urrezko konpas markak bidea adierazten dutelarik.
- Air — eskultura "Gauerdiko zerua beiraren bidez"
- Raycast — Gauerdiko Komando Zentroa, Coral Neon
- dope.security — Gauerdiko terminala baliza moreekin