FRANKY'S
Retro žaidimų kioskas ant riedlenčių parduotuvės prekystalio
Franky vizualinė kalba – tai retro žaidimų automatų salono ir riedlenčių parduotuvės derinys: šilta kreminė drobė (#f3e5df), įrėminta standžių pikselių rėmelių, visur esanti nespalvota šachmatų lenta ir vieno pikselio šriftas „Arcade“, naudojamas kiekvienam svetainės žodžiui. Paletė tyčia skurdi – liko tik dvi chromatinės spalvos (signalinė oranžinė #faa21f ženklui ir sodri žalia #128e44 pirkimo mygtukui), o visa hierarchija išreikšta padidinus „Arcade“ šrifto svorį nuo 400 iki 700 ir naudojant juodą spalvą kreminiame fone. Paviršiai išlieka plokšti ir monolitiniai; gylis pasiekiamas tik įterpus 1 pikselio kreminę liniją ant mygtukų ir šachmatų lentos toninį žaismą. Komponentai primena 10-ojo dešimtmečio vitrinų спрайtus: storos juodos rėmeliai, griežti 6–12 pikselių rėmelių spinduliai, kompaktiškas 4–8 pikselių užpildymas ir 3D/AR jungikliai, kurie atrodo kaip pikselių sujungtos piktogramos, o ne chromo elementai. Naujieji puslapiai skirti išlaikyti arkadinę atmosferą: jokių gradientų, išskyrus oranžinį slenkantį tekstą, jokių švelnių šešėlių, jokios dekoratyvinės tipografijos – tik kreminės spalvos popierius, juodos pikseliuotos linijos ir viena šilta oranžinė spalva.
Darbalaukio versijoje produkto puslapis rodomas per visą plotį, centruotai, o maksimalus plotis yra 1200 pikselių. Ritmas iš viršaus į apačią yra toks: oranžinis slenkantis tekstas → kreminės spalvos antraštė su juoda linija → dviejų stulpelių padalijimas (55 % šachmatų lentos pagrindiniame puslapyje / 45 % dviejų stulpelių produktų kortelių tinklelis) → kreminės spalvos juostelė poraštėje. Mobiliuosiuose įrenginiuose pagrindinis puslapis sutraukiamas į viso pločio šachmatų lentą, o tinklelis tampa vieno stulpelio išdėstymu. Kortelės tolygiai paskirstytos dviejų stulpelių tinklelyje su pilkais pikseliais (#e5e7eb) tarpais tarp jų. Tarpai tarp sekcijų yra minimalūs (43–61 pikselis), o sąsajoje niekada nenaudojamos tamsios juostelės, apimančios visą puslapio plotį – kreminės spalvos drobė rodoma be pertrūkių.
Kepuraičių nuotrauka švariame kreminiame fone, centre ir griežtai apkirpta, su švelniu, anglies juodumo šešėliu apačioje. Jokio gyvenimo būdo, jokių modelių, jokio konteksto – kepuraitė yra žvaigždė. Už pagrindinio elemento esantis šachmatų lentos raštas tarnauja kaip grafinis paviršius. Jokių iliustracijų, jokių 3D vizualizacijų, išskyrus papildytos realybės perjungiklį, jokių dekoratyvinių piktogramų, išskyrus pikseliuotą kryžių logotipe.
Paletė
Prekės ženklas
- Marquee Orange
#faa21f— Pranešimų juosta ekrano viršuje, akcento elementai, prekės ženklo dizainas. - Buy Green
#128e44— Mygtukas „ĮDĖTI Į KREPŠELĮ“ užpildytas – tai vienintelis pirkimo veiksmas, pažymėtas žalia spalva.
Neutralus
- Arcade Cream
#f3e5df— Puslapio fonas, produkto kortelės paviršiai, mygtukų įdėklai. - Ink Black
#000000— Pagrindinis tekstas, šachmatų lentos išdėstymas, visos vartotojo sąsajos rėmeliai, kortelių kontūrai, piktogramų rėmeliai. - Pixel Gray
#e5e7eb— Plonos rėmeliai, kortelių skirtukai, struktūrinės taisyklės tarp tinklelio langelių. - Charcoal
#333333— Antrinis paviršiaus tonas, šachmatų lentos šešėlių kvadratai, šešėlio spalva - Carbon
#151515— Sodrūs neutralūs tonai iliustracijoms ir tankiausioms šachmatų lentos formos plytelėms užpildyti. - Muted Gray
#737373— Išjungtas / nutildytas tekstas ant mygtukų ir tekste
Tipografija
nuo 10 iki 18 pikselių · 4 žingsniai
- Arcade — pakeitimas: VT323 · kontūrai 400, 700 · Visoje sąsajoje naudojamas vienas šriftas – visos antraštės, etiketės, kainos, mygtukai, pagrindinis tekstas ir piktogramos yra „Arcade“ stiliaus. Perėjimas nuo 400 iki 700 yra vienintelė priemonė hierarchijai sukurti; antro šrifto naudojimas sugadintų kiosko iliuziją.
Intervalai ir forma
| Tikslas | Reikšmė |
|---|---|
| Tankis | tankus |
| Pagrindinis žingsnis | 4-8px |
| Mygtuko spindulys | 6px |
| Kortelės spindulys | 12px |
| Šešėliai | ne – rėmeliai vietoj šešėlių |
| Tarp sekcijų | 43-61px |
| Puslapio plotis | 1200px |
Dirbtinis intelektas sukurs jūsų svetainę FRANKY'S stiliumi ir ją užpildys
- Užpildykite produktais ir įrašais per nuorodą – Instagram, TikTok, Facebook.
- Perkelkite turinį iš senos svetainės – tiesiog nurodykite adresą.
- Modernus dizainas geriausiame variklyje: React ( Next.js) su serverio atvaizdavimu ir SEO optimizavimu iš karto.
- Visiškai automatizuotas SEO optimizavimas paieškos rezultatams ir neuroninių tinklų rekomendacijoms.
Panašūs stiliai
- 099 SUPPLY — Galerijos siena, pilna juodai baltų objektų
- teenage engineering — Pramoninis katalogas studijiniame apšvietime – produktas yra vienintelis reikšmingas objektas puslapyje, o visa kita aptariama aplink jį
- Custo — Pistoleto metalo spalvų galerija su monolitiniu šriftu. Parodų salė prislopintuose pilkai žaliuose tonuose, kur vienas tamsus objektas ir 57 pikselių šriftas kalba patys už save.
- Walden — Miško paklotės tyla – kiekvienas produktas yra akmuo, kiekvienas pikselis yra samanos ir tyla
- Fiverr — Skaitmeninio turgaus akcentas – ryškiai žalia spalva pulsuojanti tamsių teatro scenų fone. Vienas neoninės žalios spalvos taškas tarnauja kaip logotipo inkaras; likusi dalis yra vienspalvė, skirta pabrėžti siūlomų paslaugų patrauklumą.
- Peloton — Raudonas švyturys ant juodo kaip anglis tako. Sporto salės salonas, kuriame vienas ryškiai raudonas CTA ženklas kirsti didžiulę, tamsią parodų erdvę ir veda į švarias, baltas gaminių sales.
- HOUSEPLANT — knygynas su riešutais ant lininio popieriaus
- Adam Lippes — Monochrominė redakcinė studija ant kreminio popieriaus – „Vogue“ atvartas, kuriame vienintelė puošmena yra maketo tinklelis, o ne spalvų paletė.
- Elektron — Įrangos valdymo skydelis vidurnaktį yra beveik juoda drobė, kurioje spindi gaminių nuotraukos, o sąsaja išlieka praktiškai nematoma.
- Sigmaphoto — Tiksliųjų instrumentų monochrominė galerija – tai tylus baltas kambarys, kuriame svarbi tik ta spalva, kuri skatina veikti.
- Channel Studio — Studijinė fotolaboratorija su vienu koraliniu šviestuvo gaubtu
- Specht Studio — Galerijos siena, alsuojanti diskretišku smalsumu. Studijos chromo apdaila – baltas paviršius ir juodos raidės; vizualinis fejerverkas visiškai sutelktas projekto plytelėse.