FRANKY'S
En retro spelkiosk på disken i en skatebutik
Frankys visuella språk är en kombination av retro-arkad och skateboardbutik: en varm krämfärgad duk (#f3e5df) inramad av stela pixelkanter, ett allestädes närvarande svartvitt schackbräde och ett enda pixeltypsnitt, Arcade, som används för varje ord på webbplatsen. Paletten är avsiktligt gles – endast två kromatiska färger återstår (signalorange #faa21f för skylten och djupt grönt #128e44 för köpknappen), där hela hierarkin uttrycks genom att öka Arcade-typsnittets vikt från 400 till 700 och genom att använda svart mot den krämfärgade bakgrunden. Ytorna förblir plana och monolitiska; djup uppnås endast genom den infogade 1px krämfärgade linjen på knapparna och schackbrädets tonala spel. Komponenterna påminner om 1990-talets butikssprites: tjocka svarta kanter, snäva 6-12px kantradier, kompakt 4-8px utfyllnad och 3D/AR-växlar som ser ut som pixelerade ikoner snarare än kromade element. De nya sidorna är avsedda att behålla den arkadliknande atmosfären: inga gradienter annat än en orange rullande text, inga mjuka skuggor, ingen dekorativ typografi – bara krämfärgat papper, svarta pixelerade linjer och en enda varm orange färg.
På datorer visar produktsidan en centrerad layout i full bredd med en maximal bredd på 1200 pixlar. Rytmen från topp till botten är: orange rullande text → krämfärgad rubrik med en svart linje → tvåkolumnsdelning (55 % schackruta på startsidan / 45 % tvåkolumnsrutnät med produktkort) → krämfärgad rand i sidfoten. På mobila enheter komprimeras startsidan till ett schackruta i full bredd, och rutnätet blir en layout med en kolumn. Korten är jämnt fördelade i ett tvåkolumnsrutnät med grå Pixel (#e5e7eb) avdelare mellan dem. Avståndet mellan avsnitten är minimalt (43–61 pixlar), och gränssnittet använder aldrig mörka ränder som sträcker sig över hela sidans bredd – den krämfärgade arbetsytan visas utan avbrott.
Ett fotografi av kepsar mot en ren krämfärgad bakgrund, centrerat och tätt beskuret, med en mjuk, kolsvart skugga under. Ingen livsstil, inga modeller, inget sammanhang – kepsen är stjärnan. Ett schackrutigt mönster bakom huvudelementet fungerar som grafisk yta. Inga illustrationer, inga 3D-renderingar förutom för förstärkt verklighet, inga dekorativa ikoner förutom det pixelerade korset i logotypen.
Palett
Stämpla
- Marquee Orange
#faa21f— Aviseringsfält högst upp på skärmen, accentelement, varumärke. - Buy Green
#128e44— Knappen "LÄGG TILL I VARUKORGEN" är ifylld – den enda köpåtgärden markerad med grönt.
Neutral
- Arcade Cream
#f3e5df— Sidbakgrund, produktkortsytor, knappinsatser. - Ink Black
#000000— Huvudtext, schackrutig layout, alla gränssnittskanter, kortkonturer, ikonkanter. - Pixel Gray
#e5e7eb— Tunna ramar, kortavdelare, strukturella regler mellan rutnätsceller. - Charcoal
#333333— Sekundär ytton, schackrutiga skuggrutor, skuggfärg - Carbon
#151515— Rika neutrala toner för fylliga illustrationer och de tätaste schackrutorna. - Muted Gray
#737373— Inaktiverad/avstängd text på knappar och i brödtext
Typografi
från 10 till 18px · 4 steg
- Arcade — ersättning: VT323 · konturer 400, 700 · Ett enda teckensnitt används i hela gränssnittet – alla rubriker, etiketter, priser, knappar, brödtext och ikoner finns i Arcade. Övergången från 400 till 700 är det enda verktyget för att skapa hierarki; att använda ett andra teckensnitt skulle förstöra kioskillusionen.
Intervaller och form
| Ändamål | Menande |
|---|---|
| Densitet | tät |
| Grundläggande steg | 4-8px |
| Knappradie | 6px |
| Kortradie | 12px |
| Skuggor | inga gränser istället för skuggor |
| Mellan sektioner | 43-61px |
| Sidbredd | 1200px |
AI kommer att bygga din webbplats i FRANKY'S -stil och fylla den
- Fyll på med produkter och inlägg via länken - Instagram, TikTok, Facebook.
- Överför innehåll från din gamla webbplats – ange bara adressen.
- Modern design på den bästa sökmotorn: React ( Next.js) med serverrendering och SEO-optimering direkt ur lådan.
- Helautomatisk SEO-optimering för sökresultat och rekommendationer för neurala nätverk.
Liknande stilar
- 099 SUPPLY — En gallerivägg fylld med svartvita föremål
- teenage engineering — Industriell katalog inom studiobelysning - produkten är det enda viktiga objektet på sidan, och allt annat diskuteras runt den.
- Custo — Ett galleri i pistolfärg med ett monolitiskt typsnitt. Ett utställningslokaler i dämpade grågröna toner, där ett enda mörkt objekt och ett 57px-typsnitt talar för sig själva.
- Walden — Skogsmarkens tystnad - varje produkt är en sten, varje pixel är mossa och tystnad
- Fiverr — Den digitala basarens mittpunkt är en vibrerande grön puls mot mörka teaterscener. En enda neongrön prick fungerar som ett ankare för logotypen; resten är monokrom, utformad för att framhäva attraktionskraften hos de erbjudna tjänsterna.
- Peloton — En röd fyr på en kolsvart catwalk. Ett fitnessshowroom där en enda klarröd CTA-skylt skär genom det stora, mörka utställningsutrymmet och leder till rena, vita produktrum.
- HOUSEPLANT — en bokhandel med nötter på linnepapper
- Adam Lippes — En monokrom redaktionell studio på krämfärgat papper – ett Vogue-uppslag där den enda dekorationen är layoutrutnätet, inte färgpaletten.
- Elektron — Utrustningens kontrollpanel vid midnatt är en nästan svart duk, där produktbilder lyser medan gränssnittet förblir praktiskt taget osynligt.
- Sigmaphoto — Det svartvita galleriet med precisionsinstrument är ett tyst vitt rum där den enda färgen som spelar roll är den som uppmanar dig till handling.
- Channel Studio — Ett fotolabb i studio med en korallfärgad lampskärm
- Specht Studio — En tavelvägg fylld av diskret nyfikenhet. Studions egen kromfinish är en vit yta och svart text; det visuella fyrverkeriet är helt koncentrerat i projektets kakelarbete.