Een winkel ontwerpen

Begin met een systeem of een recept en draai dan aan de knoppen. Elke wijziging is een echte thema-instelling.

Systemen

Een systeem is een compleet, samenhangend ontwerp: typografie, kleur, ruimte, hoeken, knoppen, beeldbehandeling, indelingen en functies. EverStorefront levert er drie — Foundry, Ledger en Signal — en elk project begint vanuit een daarvan, of vanuit een ontwerp uit je bibliotheek.

Het Patronenboek

Het Patronenboek is het geïndexeerde, doorzoekbare bereik: recepten (een systeem afgesteld op een branche en een sfeer), paletten en letterparen. Filter op branche, sfeer, basissysteem; pas alles met één klik toe op een project; sla je eigen op in de bibliotheek.

Het paneel

Open Ontwerp in een project. Links de groepen, rechts de live preview — home, collectie, product en winkelwagen, desktop of telefoon, en voor / na tegen de winkel zoals hij vandaag is.

  • Typografie — families voor koppen en tekst (47 gecontroleerde families, recente bij de hand), schaal, kopgewicht en letterspatiëring, regelafstand van de tekst.
  • Kleur — palet, of elke rol met de hand: achtergrond, vlak, tekst, gedempt, accent, rand.
  • Vorm — hoeken voor bedieningselementen, kaarten, afbeeldingen en knoppen, met exacte waarden.
  • Knoppen — grootte, hoofdletters, secundaire stijl.
  • Vlakken — kaartstijl, schaduw, randdikte, sterkte van scheidingslijnen, sectieruimte.
  • Indeling — drie varianten voor koptekst, hero, productkaarten, uitgelichte collectie, productpagina en voettekst.
  • Functies — winkelwagenpaneel, zoeksuggesties, filters, snel toevoegen, kleurstalen, vaste knop In winkelwagen, submenu's (uitklapmenu of megamenu).
  • Homepage — welke secties verschijnen en in welke volgorde, inclusief meerdere kolommen, klantenreacties, logobalk en veelgestelde vragen.

Elke knop schrijft een echte thema-instelling, zodat de winkelier dezelfde dingen later in de Shopify-editor kan wijzigen.

Vergelijken

Voor / na zet de live homepage van de winkel naast het nieuwe ontwerp, onder één sleepbare scheidslijn die beide kanten samen scrolt. Te vinden op de ontwerppagina, de probeerpagina en in beoordelingslinks.