FRANKY'S
Retro mängukiosk rulapoe letil
Franky visuaalne keel on retro arkaadi ja rulapoe kombinatsioon: soe kreemikas lõuend (#f3e5df), mida raamivad jäigad piksliäärised, kõikjal levinud mustvalge malelaud ja ühepiksline font Arcade, mida kasutatakse iga veebisaidi sõna jaoks. Palett on tahtlikult hõre – alles on jäänud vaid kaks kromaatilist värvi (signaaloranž #faa21f sildi jaoks ja sügavroheline #128e44 ostunupu jaoks), kusjuures kogu hierarhia väljendatakse Arcade'i fondi kaalu suurendamisega 400-lt 700-le ja musta kasutamisega kreemikal taustal. Pinnad jäävad tasaseks ja monoliitseks; sügavus saavutatakse ainult nuppudele lisatud 1px kreemika joone ja malelaua tonaalse mängu abil. Komponendid meenutavad 1990. aastate poe fassaadide спрайte: paksud mustad äärised, tihedad 6-12px ääriseraadiused, kompaktne 4-8px täiteava ja 3D/AR lülitid, mis näevad välja nagu pikslikujulised ikoonid, mitte kroomelemendid. Uute lehtede eesmärk on säilitada arkaadilaadne atmosfäär: pole muid gradiente peale oranži keriva teksti, pole pehmeid varje, pole dekoratiivset tüpograafiat – ainult kreemikas paber, mustad pikslitega jooned ja üks soe oranž värv.
Lauaarvutis kuvatakse tooteleht täislaiuses, tsentreeritud paigutusega, mille maksimaalne laius on 1200 pikslit. Ülalt alla rütm on järgmine: oranž keritav tekst → kreemikas päis musta joonega → kaheveeruline jaotus (55% ruudustik avalehel / 45% tootekaartide kaheveeruline ruudustik) → kreemikas triip jaluses. Mobiilseadmes variseb avaleht kokku täislaiuses ruudustikuks ja ruudustik muutub üheveeruliseks paigutuseks. Kaardid on ühtlaselt jaotatud kaheveerulisse ruudustikku, mille vahel on hallid Pixel (#e5e7eb) eraldajad. Sektsioonide vaheline kaugus on minimaalne (43–61 pikslit) ja liides ei kasuta kunagi tumedaid triipe, mis ulatuvad üle kogu lehe laiuse – kreemikas lõuend kuvatakse katkematult.
Puhtal kreemjal taustal olev foto mütsidest, keskelt tõmmatud ja tihedalt kärbitud, mille all on pehme süsimust vari. Ei elustiili, ei modelle, ei konteksti – müts on staar. Põhielemendi taga olev ruuduline muster toimib graafilise pinnana. Ei illustratsioone, ei 3D-renderdusi, välja arvatud liitreaalsuse lüliti, ega dekoratiivseid ikoone, välja arvatud logol olev pikslitega rist.
Palett
Bränd
- Marquee Orange
#faa21f— Teavitusriba ekraani ülaosas, aktsentelemendid, bränding. - Buy Green
#128e44— Nupp „LISA OSTUKORVI“ on täidetud – ainus rohelisega märgitud ostutoiming.
Neutraalne
- Arcade Cream
#f3e5df— Lehe taust, tootekaardi pinnad, nuppude sisestused. - Ink Black
#000000— Põhitekst, ruuduline paigutus, kõik kasutajaliidese äärised, kaardi kontuurid, ikoonide äärised. - Pixel Gray
#e5e7eb— Õhukesed äärised, kaardijagajad, struktuurireeglid ruudustiku lahtrite vahel. - Charcoal
#333333— Teisene pinnatoon, ruudukujulised varjuruudud, varju värv - Carbon
#151515— Rikkalikud neutraalsed toonid illustratsioonide ja tihedaimate ruuduliste plaatide täitmiseks. - Muted Gray
#737373— Keelatud/summutatud tekst nuppudel ja põhitekstis
Tüpograafia
10-st 18 pikslini · 4 sammu
- Arcade — asendamine: VT323 · kontuurid 400, 700 · Kogu liideses kasutatakse ühte fonti – kõik pealkirjad, sildid, hinnad, nupud, põhitekst ja ikoonid on Arcade'is. Üleminek 400-lt 700-le on ainus hierarhia loomise tööriist; teise fondi kasutamine rikuks kioski illusiooni.
Intervallid ja vorm
| Eesmärk | Tähendus |
|---|---|
| Tihedus | tihe |
| Põhisamm | 4-8px |
| Nupu raadius | 6px |
| Kaardi raadius | 12px |
| Varjud | ei - varjude asemel äärised |
| Sektsioonide vahel | 43-61px |
| Lehe laius | 1200px |
Tehisintellekt loob teie veebisaidi FRANKY'S stiilis ja täidab selle
- Täida toodete ja postitustega lingi kaudu - Instagram, TikTok, Facebook.
- Kanna sisu oma vanalt saidilt üle – täpsusta lihtsalt aadress.
- Moodne disain parimal mootoril: React ( Next.js) koos serveri renderdamise ja SEO optimeerimisega koheselt.
- Täisautomaatne SEO optimeerimine otsingutulemuste ja närvivõrgu soovituste jaoks.
Sarnased stiilid
- 099 SUPPLY — Mustvalgete objektidega täidetud galeriisein
- teenage engineering — Stuudiovalgustuse tööstuskataloog - toode on lehel ainus oluline objekt ja kõik muu arutatakse selle ümber
- Custo — Püssimetalli värvi galerii monoliitse fondiga. Summutatud hallikasrohelistes toonides esindusruum, kus üks tume objekt ja 57px font räägivad enda eest.
- Walden — Metsapõhja vaikus - iga toode on kivi, iga piksel on sammal ja vaikus
- Fiverr — Digitaalse basaari keskpunktiks on erkroheline pulss tumedate teatrilavade taustal. Üks neoonroheline täpp toimib logo ankruna; ülejäänu on ühevärviline, et rõhutada pakutavate teenuste atraktiivsust.
- Peloton — Punane majakas süsimustal rajal. Jõusaali esitlusruum, kus üksainus erkpunane CTA silt läbib tohutut ja pimedat näitusepinda ning viib puhaste ja valgete tooteruumideni.
- HOUSEPLANT — raamatupood, kus on linasel paberil pähkleid
- Adam Lippes — Mustvalge toimetuse stuudio kreemjal paberil – Vogue'i kujundus, kus ainsaks kaunistuseks on küljendusruudustik, mitte värvipalett.
- Elektron — Seadme juhtpaneel on keskööl peaaegu must lõuend, kus tootefotod säravad, samas kui liides jääb praktiliselt nähtamatuks.
- Sigmaphoto — Täppisinstrumentide mustvalge galerii on vaikne valge ruum, kus oluline on ainult see värv, mis kutsub sind tegutsema.
- Channel Studio — Stuudiofotolabor ühe korallist lambivarjuga
- Specht Studio — Diskreetse uudishimuga täidetud galeriisein. Stuudio enda kroomviimistlus on valge pind ja mustad kirjad; visuaalne ilutulestik on täielikult koondunud projekti plaatide sisse.