FRANKY'S
Een retro gamekiosk op de toonbank van een skatewinkel.
Franky's visuele stijl is een combinatie van retro arcade en skateboardwinkel: een warm crèmekleurig canvas (#f3e5df) omlijst door strakke pixelranden, een alomtegenwoordig zwart-wit dambordpatroon en een lettertype van één pixel, Arcade, dat voor elk woord op de website wordt gebruikt. Het kleurenpalet is opzettelijk sober gehouden – er zijn slechts twee chromatische kleuren overgebleven (signaaloranje #faa21f voor het logo en rijk groen #128e44 voor de koopknop), waarbij de hele hiërarchie wordt uitgedrukt door de letterdikte van Arcade te verhogen van 400 naar 700 en door zwart te gebruiken tegen de crèmekleurige achtergrond. De oppervlakken blijven vlak en monolithisch; diepte wordt alleen bereikt door de ingevoegde crèmekleurige lijn van 1 pixel op de knoppen en het toonspel van het dambordpatroon. De componenten doen denken aan winkelgevels uit de jaren 90: dikke zwarte randen, strakke randen met een radius van 6-12 pixels, compacte opvulling van 4-8 pixels en 3D/AR-schakelaars die eruitzien als gepixelde iconen in plaats van chromen elementen. De nieuwe pagina's zijn bedoeld om de arcade-achtige sfeer te behouden: geen kleurovergangen behalve een oranje scrollende tekst, geen zachte schaduwen, geen decoratieve typografie – alleen crèmekleurig papier, zwarte pixelachtige lijnen en één enkele warme oranje kleur.
Op desktops wordt de productpagina weergegeven als een lay-out over de volledige breedte, gecentreerd en met een maximale breedte van 1200px. Het ritme van boven naar beneden is: oranje scrollende tekst → crèmekleurige header met een zwarte lijn → splitsing in twee kolommen (55% schaakbordpatroon op de homepage / 45% raster van productkaarten in twee kolommen) → crèmekleurige streep in de footer. Op mobiele apparaten wordt de homepage samengevouwen tot een schaakbordpatroon over de volledige breedte en wordt het raster een lay-out met één kolom. De kaarten zijn gelijkmatig verdeeld in een raster van twee kolommen met grijze Pixel (#e5e7eb) scheidingslijnen ertussen. De afstand tussen de secties is minimaal (43-61px) en de interface gebruikt nooit donkere strepen die de volledige breedte van de pagina beslaan – het crèmekleurige canvas wordt zonder onderbreking weergegeven.
Een foto van petten tegen een strakke crèmekleurige achtergrond, gecentreerd en strak uitgesneden, met een zachte, houtskoolzwarte schaduw eronder. Geen lifestyle, geen modellen, geen context – de pet is de ster. Een dambordpatroon achter het hoofdelement dient als grafisch oppervlak. Geen illustraties, geen 3D-renders behalve de augmented reality-schakelaar, geen decoratieve iconen behalve het gepixelde kruis in het logo.
Palet
Merk
- Marquee Orange
#faa21f— Notificatiebalk bovenaan het scherm, accentelementen, merkuitstraling. - Buy Green
#128e44— De knop "TOEVOEGEN AAN WINKELWAGEN" is ingevuld - de enige aankoopactie is groen gemarkeerd.
Neutrale
- Arcade Cream
#f3e5df— Pagina-achtergrond, productkaartoppervlakken, knopinzetstukken. - Ink Black
#000000— Hoofdtekst, schaakbordindeling, alle UI-randen, kaartcontouren, pictogramranden. - Pixel Gray
#e5e7eb— Dunne randen, kaartverdelers, structuurregels tussen rastercellen. - Charcoal
#333333— Secundaire oppervlaktetint, schaakbordpatroon met schaduwvierkanten, schaduwkleur - Carbon
#151515— Rijke, neutrale tinten voor het vullen van illustraties en de dichtste schaakbordpatronen. - Muted Gray
#737373— Uitgeschakelde/gedempte tekst op knoppen en in de hoofdtekst.
Typografie
van 10 tot 18px · 4 stappen
- Arcade — vervanging: VT323 · overzichten 400, 700 · Er wordt in de hele interface één lettertype gebruikt: alle koppen, labels, prijzen, knoppen, hoofdtekst en pictogrammen zijn in Arcade. De overgang van 400 naar 700 is het enige middel om hiërarchie te creëren; het gebruik van een tweede lettertype zou de illusie van een kiosk verstoren.
Intervallen en vorm
| Doel | Betekenis |
|---|---|
| Dikte | gespannen |
| Basisstap | 4-8px |
| Knopradius | 6px |
| Kaartradius | 12px |
| Schaduwen | geen randen in plaats van schaduwen |
| Tussen secties | 43-61px |
| Paginabreedte | 1200px |
AI bouwt je website in de stijl FRANKY'S en vult deze in.
- Vul het account aan met producten en berichten via de link - Instagram, TikTok, Facebook.
- Neem de inhoud van je oude website over; geef gewoon het adres op.
- Modern design op de beste engine: React ( Next.js) met server-side rendering en SEO-optimalisatie direct uit de doos.
- Volledig geautomatiseerde SEO-optimalisatie voor zoekresultaten en aanbevelingen op basis van neurale netwerken.
Vergelijkbare stijlen
- 099 SUPPLY — Een galeriewand gevuld met zwart-witte objecten.
- teenage engineering — Industriële catalogus voor studioverlichting - het product is het enige belangrijke object op de pagina, en alles wat er verder over wordt gezegd, wordt eromheen besproken.
- Custo — Een galerij in metaalkleur met een monolithisch lettertype. Een showroom in gedempte grijsgroene tinten, waar een enkel donker object en een lettertype van 57px voor zich spreken.
- Walden — De stilte van de bosbodem - elk product is een steen, elke pixel is mos en stilte.
- Fiverr — Het middelpunt van de digitale bazaar is een levendige groene puls tegen een donkere theaterachtergrond. Een enkele neon groene stip dient als ankerpunt voor het logo; de rest is monochroom, ontworpen om de aantrekkingskracht van de aangeboden diensten te benadrukken.
- Peloton — Een rode lichtbaken op een gitzwarte landingsbaan. Een fitnessshowroom waar een enkel felrood CTA-bord dwars door de immense, donkere tentoonstellingsruimte snijdt en leidt naar strakke, witte productruimtes.
- HOUSEPLANT — een boekhandel met noten op linnen papier
- Adam Lippes — Een monochrome fotoserie op crèmekleurig papier – een Vogue-spread waarbij de enige decoratie het lay-outraster is, en niet het kleurenpalet.
- Elektron — Het bedieningspaneel van de apparatuur is 's nachts een bijna zwart canvas, waarop productfoto's schitteren terwijl de interface vrijwel onzichtbaar blijft.
- Sigmaphoto — De Monochrome Gallery of Precision Instruments is een rustige, witte ruimte waar de enige kleur die ertoe doet, de kleur is die je tot actie aanzet.
- Channel Studio — Een fotostudio met één koraalkleurige lampenkap.
- Specht Studio — Een galeriewand vol subtiele curiositeiten. De chroomafwerking van de studio zelf bestaat uit een wit oppervlak met zwarte letters; het visuele spektakel is volledig geconcentreerd in het tegelwerk van het project.