FRANKY'S
Retro herný stánok na pulte skateshopu
Frankyho vizuálny jazyk je kombináciou retro arkády a skateboardového obchodu: teplé krémové plátno (#f3e5df) orámované pevnými pixelovými okrajmi, všadeprítomná čiernobiela šachovnica a jednopixelové písmo Arcade použité pre každé slovo na webovej stránke. Paleta je zámerne riedka – zostávajú iba dve chromatické farby (signálna oranžová #faa21f pre nápis a sýta zelená #128e44 pre tlačidlo kúpiť), pričom celá hierarchia je vyjadrená zvýšením hrúbky písma Arcade zo 400 na 700 a použitím čiernej farby na krémovom pozadí. Povrchy zostávajú ploché a monolitické; hĺbka sa dosahuje iba vloženou 1px krémovou čiarou na tlačidlách a tonálnou hrou šachovnice. Komponenty pripomínajú sprite výkladov z 90. rokov: hrubé čierne okraje, úzke polomery okrajov 6 – 12px, kompaktné odsadenie 4 – 8px a 3D/AR prepínače, ktoré vyzerajú skôr ako pixelované ikony než ako chrómové prvky. Nové stránky majú zachovať atmosféru arkády: žiadne prechody okrem oranžového posúvajúceho sa textu, žiadne mäkké tiene, žiadna dekoratívna typografia – iba krémový papier, čierne pixelované čiary a jedna teplá oranžová farba.
Na počítači sa stránka produktu zobrazuje v rozložení na celú šírku, vycentrovanom s maximálnou šírkou 1200 pixelov. Rytmus zhora nadol je: oranžový posúvajúci sa text → krémová hlavička s čiernou čiarou → rozdelenie na dva stĺpce (55 % šachovnica na domovskej stránke / 45 % dvojstĺpcová mriežka s kartami produktov) → krémový pruh v päte. Na mobilnom zariadení sa domovská stránka zbalí do šachovnice na celú šírku a mriežka sa zmení na jednostĺpcové rozloženie. Karty sú rovnomerne rozmiestnené v dvojstĺpcovej mriežke so sivými pixelovými (#e5e7eb) oddeľovačmi medzi nimi. Rozstupy medzi sekciami sú minimálne (43 – 61 pixelov) a rozhranie nikdy nepoužíva tmavé pruhy, ktoré by sa rozprestierali po celej šírke stránky – krémové plátno sa zobrazuje bez prerušenia.
Fotografia šiltoviek na čistom krémovom pozadí, vycentrovaná a ostro orezaná, s jemným, uhľovo-čiernym tieňom pod ňou. Žiadny životný štýl, žiadne modelky, žiadny kontext – hviezdou je šiltovka. Šachovnicový vzor za hlavným prvkom slúži ako grafický povrch. Žiadne ilustrácie, žiadne 3D rendery okrem prepínača rozšírenej reality, žiadne ozdobné ikony okrem pixelovaného kríža v logu.
Paleta
Značka
- Marquee Orange
#faa21f— Panel s upozorneniami v hornej časti obrazovky, zvýrazňovacie prvky, branding. - Buy Green
#128e44— Tlačidlo „PRIDAŤ DO KOŠÍKA“ je vyplnené – jediná akcia nákupu je označená zelenou farbou.
Neutrálny
- Arcade Cream
#f3e5df— Pozadie stránky, povrchy kariet produktov, vložené tlačidlá. - Ink Black
#000000— Hlavný text, šachovnicové rozloženie, všetky okraje používateľského rozhrania, obrysy kariet, okraje ikon. - Pixel Gray
#e5e7eb— Tenké okraje, deliče kariet, štrukturálne pravidlá medzi bunkami mriežky. - Charcoal
#333333— Tón sekundárneho povrchu, šachovnicové tieňové štvorce, farba tieňa - Carbon
#151515— Sýte neutrálne tóny na vyplnenie ilustrácií a najhustejšie šachovnicové dlaždice. - Muted Gray
#737373— Zakázaný/stlmený text na tlačidlách a v texte tela
Typografia
od 10 do 18px · 4 kroky
- Arcade — náhrada: VT323 · obrysy 400, 700 · V celom rozhraní sa používa jedno písmo – všetky nadpisy, popisky, ceny, tlačidlá, text a ikony sú v Arcade. Prechod zo 400 na 700 je jediný nástroj na vytvorenie hierarchie; použitie druhého písma by zničilo ilúziu kiosku.
Intervaly a forma
| Účel | Význam |
|---|---|
| Hustota | hustý |
| Základný krok | 4-8px |
| Polomer tlačidla | 6px |
| Polomer karty | 12px |
| Tiene | nie - okraje namiesto tieňov |
| Medzi sekciami | 43-61px |
| Šírka stránky | 1200px |
Umelá inteligencia vytvorí vašu webovú stránku v štýle FRANKY'S a naplní ju
- Doplňte produktmi a príspevkami cez odkaz - Instagram, TikTok, Facebook.
- Preneste obsah zo svojej starej stránky – stačí zadať adresu.
- Moderný dizajn na najlepšom engine: React ( Next.js) s vykresľovaním servera a SEO optimalizáciou hneď po vybalení.
- Plne automatizovaná SEO optimalizácia pre výsledky vyhľadávania a odporúčania neurónových sietí.
Podobné štýly
- 099 SUPPLY — Stena galérie plná čiernobielych predmetov
- teenage engineering — Priemyselný katalóg v štúdiovom osvetlení - produkt je jediným významným objektom na stránke a všetko ostatné sa rozoberá okolo neho
- Custo — Galéria v bronco-farbe s monolitickým písmom. Výstavná sieň v tlmených sivozelených tónoch, kde jeden tmavý objekt a písmo s veľkosťou 57px hovoria samy za seba.
- Walden — Ticho lesnej pôdy - každý produkt je kameň, každý pixel je mach a ticho
- Fiverr — Ústredným bodom digitálneho bazáru je žiarivý zelený pulz na pozadí tmavých divadelných pódií. Jediný neónovo zelený bod slúži ako kotva pre logo; zvyšok je monochromatický a navrhnutý tak, aby zdôraznil atraktivitu ponúkaných služieb.
- Peloton — Červený maják na čiernej dráhe. Fitness showroom, kde jediný jasne červený nápis CTA pretína rozsiahly, tmavý výstavný priestor a vedie do čistých, bielych miestností plných produktov.
- HOUSEPLANT — kníhkupectvo s orechmi na ľanovom papieri
- Adam Lippes — Monochromatické redakčné štúdio na krémovom papieri – roztiahnutie Vogue, kde jedinou dekoráciou je mriežka rozloženia, nie farebná paleta.
- Elektron — Ovládací panel zariadenia o polnoci je takmer čierne plátno, kde žiaria fotografie produktov, zatiaľ čo rozhranie zostáva prakticky neviditeľné.
- Sigmaphoto — Monochromatická galéria presných prístrojov je tichá biela miestnosť, kde jediná dôležitá farba je tá, ktorá vás vyzýva k akcii.
- Channel Studio — Štúdiové fotolaboratórium s jedným koralovým tienidlom na lampu
- Specht Studio — Galériová stena naplnená decentnou zvedavosťou. Chrómová povrchová úprava štúdia je biela a čierne písmo; vizuálny ohňostroj je úplne sústredený v rámci projektu.