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
- 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
- Augen Pro — Appleren aurkezpen zuriak urdin elektriko, kliniko eta arin bat du azentu bakar gisa espazio monokromo batean.
- Antimetal — Krema koloreko paperean argitaratutako kronika editoriala —goiz lasai bat aldizkari zientifiko batean, non neurritasunak konfiantza ematen duen eta serifek lan astuna egiten duten
- Perk — Limoi elektrikoa pergamino-paper epelaren gainean
- Ditto — Eguzki argitan dagoen tailer bat lore basatien laginak sortzen. Krema koloreko gainazal epelak, oinarrizko kolore hori bizia, itsas urdin ilunaren tintak, piezaren atzean loratzen diren kolore organikoen formak.
- Officevibe — Krema koloreko paper epel batean argitaratutako aldizkari editorial bat. Imajinatu Giza Baliabideen kudeaketari buruzko saiakera hausnarkor bat, produktu gisa aurkeztua: interfaze urdin moderno batetik xuxurlatzen den letra-tipo etzana.