Seline Analytics
Tichý analytický stůl na teplém papíře
Seline je zasazen do teplého kamenného pozadí (#fafaf9) s jediným zářivým modrým akcentem – všechny ostatní barvy jsou neutrální a převzaty z palety kamenných barev Tailwind. Nadpisy jsou vykresleny ve speciálně navrženém geometrickém bezpatkovém písmu (roobert) s gramáží 400 a úzkým negativním rozestupem písmen, což textu dodává poklidnou, téměř šeptající sebejistotu, která kontrastuje s typicky hlasitým stylem SaaS. Povrchy uživatelského rozhraní jsou ploché bílé karty, vznášející se nad teplým pozadím s jediným, měkkým rozostřením o tloušťce 16px; ohraničení jsou vytvořena tenkými čarami v kamenném odstínu o tloušťce 1px, které jsou hojně použity jako primární strukturální prvek místo těžkých oddělovačů nebo panelů. Rozvržení dýchá: obsah po celé šířce soustředěný na velkorysém vertikálním rytmu, s interaktivními ovládacími prvky ve tvaru pilulek, ilustrací maskota pro osobnost a snímky obrazovky z dashboardu jako důkaz produktu. Celkový dojem je redakčně analytický: klidný, monochromatický, sebevědomý, s modrou výzvou k akci, která je nejvýraznějším prvkem na stránce díky záměrnému omezení všeho ostatního.
Stránka má maximální šířku, je vycentrována na přibližně 1200 pixelů s dostatkem vertikálního prostoru. Hlavním bodem je dvouřádkový blok textu zarovnaný doleva s jedinou zvýrazněnou frází („jednoduché a efektivní“) modře, následovaný řádkem se dvěma výzvami k akci (modrá pilulka + pilulka duchů), dále řádkem log partnerů ve stupních šedi, řádkem hodnocení důvěryhodnosti a nakonec plovoucím náhledem řídicího panelu v celé šířce, který mírně překrývá další sekci. Pod ohybem se střídají řady referencí v mřížce s jedním sloupcem, následované sekcemi v celé šířce s popisy funkcí, textem zarovnaným doleva a vizuály produktů na střed. Navigace je minimalistický horní panel – logo vlevo, středové navigační odkazy, přihlášení + modrá výzva k akci vpravo – s plovoucím shlukem avatarů uprostřed navigace sloužícím k ověření identity. Mezery mezi sekcemi jsou široké (96 pixelů), aby vytvořily redakční rytmus spíše než hustou změť informací.
Vizuálnímu jazyku dominují snímky obrazovky uživatelského rozhraní produktu – náhled na dashboard je fotografie vykreslená s kontrastním filtrem ve stupních šedi (1) (0,94), který ztlumí barvy dat do monochromatického odstínu. Jedinou lidskou postavou je lineární samolepka maskota (postava s kapucí), nakreslená ve stylu SVG pouze s obrysy, umístěná jednou na sekci jako hravý kontrapunkt k analytickému obsahu, s jemným stínem, který vytváří efekt hloubky podobný samolepce. Logo značky a glyfy jsou malé černé jiskry/plameny. Nejsou zde žádné fotografie – žádné lifestylové snímky, žádné týmové fotografie, žádné obrázky prostředí. Objekt (dashboard) je protagonista. Všechny dekorativní ikony mají styl obrysu 1px a jsou buď #0c0a09, nebo #3ba6f1, nikdy nejsou vyplněné.
Paleta
Značka
- Cyan Signal
#3ba6f1— Hlavní výzva k akci, aktivní odkazy a obrysy ikon značek jsou jedinými barevnými akcenty na stránce, které se používají střídmě k upoutání pozornosti na akci. - Cyan Edge
#3398e1— Modrá se používá k zvýraznění obrysů akcí, popisků odkazů a interaktivních prvků. Neměla by se používat jako primární barva pro výzvy k akci.
Neutrální
- Ink Black
#0c0a09— Hlavní nadpisy, zvýrazněný text a výrazné ikony jsou v teplé, téměř černé barvě. - Stone Canvas
#fafaf9— Pozadí stránky je v teplém, krémovém odstínu, který působí spíše jako papír než jako bílá obrazovka. - Pure White
#ffffff— Povrchy mapy, vyčnívající panely a výplně vstupních polí jsou ve výchozím nastavení ploché a bez stínů. - Stone Border
#e8e6e5— Tenké okraje na kartách, v navigaci a vstupních polích jsou primárním strukturálním prvkem, nikoli oddělovače. - Stone Muted
#d6d3d1— Doplňkové rámečky, jemné odstíny pozadí, ozdobné dělicí příčky. - Ash Gray
#a8a29e— Text nápovědy, obrysy ikon, deaktivované stavy - čitelné, ale neaktivní.
Typografie
od 10 do 52 pixelů · 5 kroků
- Roobert — nahrazení: Inter Tight or Satoshi · obrysy 400, 500 · Písmo pro nadpisy a rozvržení textu je unikátní geometrické bezpatkové písmo s minimálními zápornými mezerami mezi písmeny (-0,025em při 32px, -0,021em při 52px). Váha 400 x 52px je charakteristickým znakem písma: je nekonvenční, decentní, přesto autoritativní a zároveň decentní. Nadpisy zaujímají své místo, aniž by byly dominantní.
- Inter — nahrazení: Inter · obrysy 400, 500, 600 · Primárním písmem pro text těla, navigaci, uživatelské rozhraní a nadpisy je neutrální, univerzální písmo pro veškerý text mimo obrazovku. Převládající velikost pro text těla je 14px s tloušťkou 400 a řádkováním 1,64 (frekvence 1174). Kladné řádkování písmen (0,004em) u malých velikostí zajišťuje čitelnost hustého uživatelského rozhraní.
Intervaly a forma
| Účel | Význam |
|---|---|
| Hustota | prostorný |
| Základní krok | 8px |
| Poloměr tlačítka | 9999px |
| Poloměr karty | 10px |
| Stíny | měkké stíny |
| Mezi sekcemi | 96px |
| Šířka stránky | 1200px |
Umělá inteligence vám vytvoří web ve stylu Seline Analytics a naplní ho
- Doplňujte produkty a příspěvky přes odkaz - Instagram, TikTok, Facebook.
- Přeneste obsah ze starého webu – stačí zadat adresu.
- Moderní design na nejlepším enginu: React ( Next.js) s renderováním na serveru a SEO optimalizací ihned po vybalení.
- Plně automatizovaná SEO optimalizace pro výsledky vyhledávání a doporučení neuronových sítí.
Podobné styly
- ElevenLabs — Fotoesej v teplých krémových tónech s decentními nadpisy. Zápisník ve stylu Bauhausu – papír barvy vaječné skořápky, černý inkoust a jeden fialovooranžový akcent pro vystavení produktů.
- Awesomic — Redakční zinková síťovina s oranžovými interpunkčními znaménky připomínajícími konfety
- Monad — redakční technický časopis na teplém pergamenu
- Dub — Ovládací panel Link z matného rýžového papíru
- Notion — Teplý papírový zápisník v polední slunci
- Anthropic — Vědecký časopis z oblasti teplého pergamenu – klidné slonovinové povrchy, patkové úvodní nadpisy a jediný hliněný akcent, který se objevuje pouze tehdy, když je potřeba něco udělat.
- Calendly — Tmavě modrý inkoust na studeném mramoru
- Augen Pro — Bílá prezentace společnosti Apple se vyznačuje klinickou, beztížnou, elektrickou modrou barvou jako jediným akcentem v monochromatickém prostoru.
- Antimetal — Redakční kronika na krémovém papíře – klidné dopoledne ve vědeckém časopise, kde zdrženlivost vyjadřuje sebevědomí a patky odvádějí těžkou práci.
- Perk — Elektrické vápno na teplém pergamenovém papíru
- Ditto — Sluncem zalitá dílna, kde se vytvářejí vzorky divokých květin. Teplé krémové povrchy, zářivá žlutá základní barva, tmavě tmavě modré inkousty, organické barevné formy rozkvétající za dílem.
- Officevibe — Redakční časopis na teplém krémovém papíře. Představte si promyšlenou esej o řízení lidských zdrojů, prezentovanou jako produkt – kurzivní patkové písmo šeptající skrz moderní modré rozhraní.