FRANKY'S
Un chioșc de jocuri retro pe tejgheaua unui magazin de skateboard-uri
Limbajul vizual al lui Franky este o combinație între jocuri arcade retro și magazine de skateboard: o pânză crem caldă (#f3e5df) încadrată de margini rigide de pixeli, o tablă de șah alb-negru omniprezentă și un font cu un singur pixel, Arcade, folosit pentru fiecare cuvânt de pe site. Paleta este intenționat rară - rămân doar două culori cromatice (portocaliu semnal #faa21f pentru semn și verde intens #128e44 pentru butonul de cumpărare), întreaga ierarhie fiind exprimată prin creșterea grosimii fontului Arcade de la 400 la 700 și prin utilizarea negrului pe fundalul crem. Suprafețele rămân plate și monolitice; adâncimea este obținută doar prin linia crem de 1px inserată pe butoane și jocul tonal al tablei de șah. Componentele amintesc de sprite-urile din vitrinele magazinelor din anii 1990: margini negre groase, raze de margini strânse de 6-12px, padding compact de 4-8px și comutatoare 3D/AR care arată ca pictograme pixelate, mai degrabă decât ca elemente cromate. Noile pagini sunt menite să mențină atmosfera de tip arcade: fără gradienți în afară de un text portocaliu care derulează, fără umbre delicate, fără tipografie decorativă - doar hârtie crem, linii negre pixelate și o singură culoare portocalie caldă.
Pe desktop, pagina produsului afișează un aspect centrat, pe lățime completă, cu o lățime maximă de 1200px. Ritmul de sus în jos este: text portocaliu derulant → antet crem cu o linie neagră → divizare pe două coloane (55% tablă de șah pe pagina principală / 45% grilă pe două coloane pentru fișele de produs) → dungă crem în subsol. Pe mobil, pagina principală se restrânge într-o tablă de șah pe lățime completă, iar grila devine un aspect pe o singură coloană. Fișele sunt distribuite uniform într-o grilă pe două coloane, cu separatoare gri de Pixeli (#e5e7eb) între ele. Spațierea dintre secțiuni este minimă (43–61px), iar interfața nu folosește niciodată dungi întunecate care să acopere întreaga lățime a paginii - pânza crem este afișată fără întrerupere.
O fotografie cu șepci pe un fundal crem curat, centrată și decupată strâns, cu o umbră neagră, moale, dedesubt. Fără stil de viață, fără modele, fără context - șapca este vedeta. Un model în carouri în spatele elementului principal servește drept suprafață grafică. Fără ilustrații, fără randări 3D, cu excepția comutatorului pentru realitate augmentată, fără pictograme decorative, cu excepția crucii pixelate din logo.
Paletă
Marca
- Marquee Orange
#faa21f— Bara de notificări în partea de sus a ecranului, elemente de accent, branding. - Buy Green
#128e44— Butonul „ADAUGĂ LA COȘ” este completat - singura acțiune de cumpărare marcată cu verde.
Neutru
- Arcade Cream
#f3e5df— Fundalul paginii, suprafețele fișelor de produs, inserțiile butoanelor. - Ink Black
#000000— Text principal, aspect în formă de tablă de șah, toate marginile interfeței, contururile cărților, marginile pictogramelor. - Pixel Gray
#e5e7eb— Borduri subțiri, separatoare din carton, reguli structurale între celulele grilei. - Charcoal
#333333— Ton de suprafață secundar, pătrate de umbră în carouri, culoarea umbrei - Carbon
#151515— Tonuri neutre bogate pentru ilustrații de umplere și cele mai dense plăci de șah. - Muted Gray
#737373— Text dezactivat/dezactivat pe butoane și în corpul textului
Tipografie
de la 10 la 18px · 4 pași
- Arcade — înlocuire: VT323 · contururi 400, 700 · În întreaga interfață se folosește un singur font - toate titlurile, etichetele, prețurile, butoanele, corpul de text și pictogramele sunt în Arcade. Trecerea de la 400 la 700 este singurul instrument pentru crearea ierarhiei; utilizarea unui al doilea font ar strica iluzia chioșcului.
Intervale și formă
| Scop | Sens |
|---|---|
| Densitate | dens |
| Pasul de bază | 4-8px |
| Raza butonului | 6px |
| Raza cardului | 12px |
| Umbre | fără - margini în loc de umbre |
| Între secțiuni | 43-61px |
| Lățimea paginii | 1200px |
Inteligența artificială vă va construi site-ul web în stilul FRANKY'S și îl va completa
- Completează cu produse și postări prin link - Instagram, TikTok, Facebook.
- Transferați conținut de pe vechiul site - specificați doar adresa.
- Design modern pe cel mai bun motor: React ( Next.js) cu randare pe server și optimizare SEO gata de utilizare.
- Optimizare SEO complet automatizată pentru rezultatele căutării și recomandări de rețele neuronale.
Stiluri similare
- 099 SUPPLY — Un perete de galerie plin de obiecte alb-negru
- teenage engineering — Catalog industrial în iluminatul de studio - produsul este singurul obiect semnificativ de pe pagină, iar orice altceva este discutat în jurul lui
- Custo — O galerie de culoarea bronzului, cu un font monolitic. Un showroom în tonuri estompate de gri-verzui, unde un singur obiect întunecat și un font de 57px vorbesc de la sine.
- Walden — Liniștea de pe podeaua pădurii - fiecare produs este o piatră, fiecare pixel este mușchi și liniște
- Fiverr — Punctul central al bazarului digital este un puls verde vibrant pe fundalul unor scene de teatru întunecate. Un singur punct verde neon servește drept ancoră pentru logo; restul este monocrom, conceput pentru a evidenția atractivitatea serviciilor oferite.
- Peloton — Un far roșu pe o pistă neagră ca tăciunele. Un showroom de fitness unde un singur semn roșu aprins, cu apel la apel, străbate vastul și întunecat spațiu de expoziție și duce spre săli de produse curate și albe.
- HOUSEPLANT — o librărie cu nuci pe hârtie de in
- Adam Lippes — Un studio editorial monocrom pe hârtie crem – o publicație Vogue unde singura decorațiune este grila de aspect, nu paleta de culori.
- Elektron — Panoul de control al echipamentului la miezul nopții este o pânză aproape neagră, unde fotografiile produselor strălucesc în timp ce interfața rămâne practic invizibilă.
- Sigmaphoto — Galeria Monocromă de Instrumente de Precizie este o cameră albă și liniștită, unde singura culoare care contează este cea care te cheamă la acțiune.
- Channel Studio — Un laborator foto de studio cu un abajur coral
- Specht Studio — Un perete galerie plin de o curiozitate discretă. Finisajul cromat propriu studioului este o suprafață albă și litere negre; artificiile vizuale sunt concentrate în întregime în gresia proiectului.