Seline Analytics
Paper epelaren gaineko taula analitiko lasaia
Seline harrizko atzealde epel baten aurrean kokatzen da (#fafaf9), urdin biziko azentu bakarrarekin; gainerako kolore guztiak neutroak dira eta Tailwind harrizko kolore-paletatik hartuak dira. Titularrak 400eko pisuarekin eta letra-tarte negatibo estuarekin diseinatutako sans-serif letra-tipo geometriko pertsonalizatu batean (roobert) irudikatzen dira, testuari lasaitasun eta xuxurla baten antzeko konfiantza emanez, SaaS estilo ozen tipikoarekin kontrastatzen duena. UI gainazalak txartel zuri lauak dira, atzealde epelaren gainean flotatzen, 16px-ko lausotasun leun bakar batekin; ertzak harri-tonuko lerro meheekin sortzen dira, 1px-koak, egitura-elementu nagusi gisa erabiliak, banatzaile edo panel lodien ordez. Diseinuak arnasa hartzen du: zabalera osoko edukia erritmo bertikal eskuzabal batean zentratuta, pilula itxurako kontrol interaktiboekin, maskota baten ilustrazio batekin nortasunaren alde eta produktuaren froga gisa kontrol-paneleko pantaila-argazkiekin. Inpresio orokorra editorialki analitikoa da: lasaia, monokromoa, ziurra, ekintzarako dei urdina orrialdeko elementurik deigarriena izanik, gainerako guztiaren neurritasun nahitari esker.
Orrialdea zabalera maximokoa da, gutxi gorabehera 1200px-tan zentratuta eta espazio bertikal ugarirekin. Heroia bi lerroko testu-bloke bat da, ezkerrean lerrokatua, esaldi bakarra nabarmenduta ("sinplea eta eraginkorra") urdinez, ondoren bi ekintzarako dei dituen errenkada bat (pilula urdina + pilula mamua), gero bazkideen logotipoen errenkada bat eskala grisean, gero konfiantza-balorazioen errenkada bat, eta ondoren, hurrengo atalaren gainean apur bat gainjarrita, zabalera osoko aginte-paneleko aurrebista flotatzaile bat. Tolesturaren azpian testigantzen errenkada txandakatuak daude zutabe bakarreko sareta batean, eta ondoren zabalera osoko atalak funtzioen deskribapenekin, ezkerrean lerrokatutako testuarekin eta erdiratutako produktuen bisualekin. Nabigazioa goiko barra minimalista bat da —logotipoa ezkerrean, erdiratutako nabigazio-estekak, saioa hasteko aukera + ekintzarako dei urdina eskuinean—, nabigazioaren erdian avatar multzo flotatzaile batekin, identitatea egiaztatzeko balio duena. Atalen arteko espazioak zabalak dira (96px) informazio-nahasketa trinko bat baino erritmo editorial bat sortzeko.
Produktuaren erabiltzaile-interfazearen pantaila-argazkiek menderatzen dute hizkuntza bisuala: aginte-paneleko aurrebista eskala griseko (1) (0,94) kontraste-iragazki batekin errenditutako argazki bat da, datuen koloreak monokromo bihurtzen dituena. Giza irudi bakarra maskota-pegatina lineal bat da (kaputxadun pertsonaia bat), SVG estiloan marraztua, eskemekin soilik, atal bakoitzeko behin jarrita, eduki analitikoarekiko kontrapuntu jostalari gisa, itzal leun batekin sakontasun-pegatina efektua sortzeko. Markaren logotipoa eta glifoak txinparta/gar beltz txikiak dira. Ez dago argazkirik: ez bizimodu-argazkirik, ez talde-argazkirik, ez ingurumen-irudirik. Objektua (aginte-panela) da protagonista. Ikono apaingarri guztiak 1px-ko eskema-estilokoak dira, #0c0a09 edo #3ba6f1-en, inoiz ez beteta.
Paleta
Marka
- Cyan Signal
#3ba6f1— Ekintzarako dei nagusia, esteka aktiboak eta markaren ikonoen eskema dira orrialdeko kolore-azentu bakarrak, neurriz erabiltzen direnak ekintzara arreta erakartzeko. - Cyan Edge
#3398e1— Urdina ekintzen eskemak, esteken etiketak eta elementu interaktiboak nabarmentzeko erabiltzen da. Ez da erabili behar ekintzarako deietarako kolore nagusi gisa.
Neutroa
- Ink Black
#0c0a09— Izenburu nagusiak, nabarmendutako testua eta ikono adierazgarriak kolore beroan daude, ia beltzean. - Stone Canvas
#fafaf9— Orrialdearen atzeko planoa tonu epel eta krematsu bat da, pantaila baten zuria baino paperaren antzekoa. - Pure White
#ffffff— Mapa-gainazalak, panel irtenak eta sarrera-eremuen betegarriak lauak eta itzalik gabekoak dira lehenespenez. - Stone Border
#e8e6e5— Txartelen, nabigazioaren eta sarrera-eremuen ertz meheak dira egitura-elementu nagusia, ez bereizleak. - Stone Muted
#d6d3d1— Marko gehigarriak, atzeko planoaren itzal sotilak, banatzaile apaingarriak. - Ash Gray
#a8a29e— Laguntza testua, ikonoen eskemak, desgaitutako egoerak - irakurgarriak baina inaktiboak.
Tipografia
10etik 52px-ra · 5 urrats
- Roobert — ordezkapena: Inter Tight or Satoshi · eskemak 400, 500 · Izenburuen eta testuaren diseinuaren letra-tipoa sans-serif geometriko berezia da, letra-tarte negatibo minimoarekin (-0,025em 32px-tan, -0,021em 52px-tan). 400 x 52px-ko pisua da letra-tipoaren ezaugarri nagusia: ez-konbentzionala, sotila, baina autoritarioa, baina apaldua. Izenburuek beren lekua betetzen dute gehiegizkoak izan gabe.
- Inter — ordezkapena: Inter · eskemak 400, 500, 600 · Gorputz-testuaren, nabigazioaren, erabiltzaile-interfazearen eta goiburuen letra-tipo nagusia pantailatik kanpoko testu guztientzako letra-tipo neutro eta unibertsala da. 14px-ko tamaina, 400eko pisuarekin eta 1,64ko lerroartearekin da gorputz-testuaren tamaina nagusia (maiztasuna 1174). Tamaina txikietan letren arteko tarte positiboak (0,004em) erabiltzaile-interfaze trinkoaren irakurgarritasuna bermatzen du.
Tarteak eta forma
| Helburua | Esanahia |
|---|---|
| Dentsitatea | zabal |
| Oinarrizko urratsa | 8px |
| Botoiaren erradioa | 9999px |
| Txartelaren erradioa | 10px |
| Itzalak | itzal leunak |
| Atalen artean | 96px |
| Orriaren zabalera | 1200px |
Adimen artifizialak zure webgunea Seline Analytics 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
- Mollie — Kaxmirrezko mostradore bat, liburuxka ilun bat. Utzi leku zuri zabala testu beltzaren inguruan diseinu editorialerako, eta gero indartu produktuarekin lotutako puntuak krema beroekin, espresso marroiekin eta ordainketa-metodo errealen argazki ukigarriekin.
- Kagi — Irakurketa-gela bereizi bat. Sortu espazio zuri ireki bat grafitozko testu lodien inguruan, azentu more sotilak eta gainazal pastel epelak erabiliz lasaitasuna hausteko.
- Milanote — Milanote estudio sortzaile dedikatu bat da. Sortu galeria editorial estiloko orrialdeak taula bisual flotatzaileak erabiliz: marko ilunak dituzten hormak, pantaila-espazio zuria eta sakonera leuneko objektu errealen itxura duten pantaila-argazkiak.
- Co2 — Klima-atlas bat neguko argitan. Sortu orrialdeak aireko dokumentu-paisaia baten antzera, non serif goiburuek, kategoria-kodetutako datuek eta izotzezko irudiek ertz zuri zabalak nabarmentzen dituzten.
- GitButler — Turkesa testuaren amaieran. Kontraste handiko serif izenburuen konbinazioa, sare tekniko sotilekin, grafito gainazal beroekin eta turkesa azentu diskretu batekin.
- ElevenLabs — Krema koloreko tonu beroetako argazki-saiakera, izenburu sotilekin. Bauhaus estiloko koadernoa: arrautza-oskolaren koloreko papera, tinta beltza eta produktua erakusteko more eta laranja koloreko azentu bakarra.
- Awesomic — Konfetiaren antzeko puntuazio-markak laranja koloreko zink sare editoriala
- Monad — pergamino beroan argitaratutako aldizkari tekniko editoriala
- Dub — Link-en arroz-paper matearen kontrol-panela
- Notion — Eguerdiko eguzkitan paperezko koaderno epel bat
- Anthropic — Pergamino epelaren gaineko aldizkari zientifikoa: boli koloreko gainazal lasaiak, serifadun editorial-izenburuak eta ekintza beharrezkoa denean bakarrik agertzen den buztinezko azentu bakarra.
- Calendly — Tinta urdin iluna marmol hotzean