E-commerce app
Uw shop indelen
Drie instrumenten geven uw catalogus structuur, en ze werken op verschillende niveaus. Collecties zijn de gangpaden van uw shop. Collectielijsten ruimen die gangpaden op zodat uw menu niet overloopt. Tags werken op de achtergrond, als onzichtbare secundaire collecties.
Hoofdstuk 1De collecties
Wat ze zijn
Collecties geven uw Shopping App structuur en ordenen uw producten. Was uw app een fysieke winkel, dan waren de collecties de gangpaden.
Ze bepalen ook wat uw klant kan bereiken. Een product dat aan geen enkele collectie hangt, bestaat wel degelijk in uw shop en verkoopt ook, maar het is alleen via zijn eigen adres te bereiken: via een link die u stuurt, via een zoekopdracht, via een widget op het startscherm. Elk product aan minstens één collectie koppelen is dus de eerste reflex, nog vóór u over uw indeling nadenkt.
Ze zijn op twee vlakken flexibel. Eerst in de tijd: een collectie voegt u toe, verwijdert u, toont of verbergt u in één klik, wat tijdelijke collecties mogelijk maakt. Daarna in de indeling: ze doorkruisen elkaar, en hetzelfde product hoort tegelijk bij meerdere collecties.
Dat doorkruisende karakter verdient uw aandacht wanneer u ze aanmaakt. Neem onze decoratiewinkel. Een klant die een decoratiestuk zoekt, kan langs drie verschillende lijnen denken: de kamer in kwestie, het type object, de trend van het moment. We maakten dus negen collecties over die drie lijnen:
Per kamer: Bedroom, Bathroom, Kitchen
Per type object: Frames, Vases, Pillows
Per trend: Big in Japan, Keep it Slow, Words matter
Elk product hoort dus bij meerdere collecties. Het heeft meer kans om gezien te worden, en de klant heeft meer kans om het te vinden langs de weg die hem vanzelf komt.
Daar komt nog een soldencollectie bij, die de afgeprijsde producten verzamelt. Ze verandert in de tijd, en staat verborgen buiten het soldenseizoen.
Hoe u ze aanmaakt
Ga naar Products › Collections. Klik op Create a collection.
Daarna voert u de titel in, een illustratiebeeld, en de weergavevolgorde van de producten. De titel is beperkt tot 32 tekens, en dat is een nuttige beperking: de naam van een gangpad leest u in een menu, op een telefoonscherm, en korte namen winnen daar altijd.
Voor de weergavevolgorde is de regel altijd dezelfde: vraag u af wat uw klant zoekt.
Er zijn zes automatische volgordes, in paren: aanmaakdatum, van recent naar oud of omgekeerd, prijs, van laag naar hoog of omgekeerd, en titel, van A tot Z of van Z tot A. De zevende modus is handmatig.
- De datum zet nieuwe artikelen vooraan. Dat is de juiste keuze voor een kledingzaak die regelmatig wordt aangevuld, of voor een boekhandel waarvan de klanten terugkomen voor nieuw leesvoer.
- Oplopende prijs past bij een buurtwinkel, waar de klant zijn budget wil bewaken. Aflopende prijs dient eerder een hoogwaardige collectie, waar het eerste artikel het niveau zet.
- Alfabetische volgorde is voor catalogi die mensen doorlopen terwijl ze de naam van wat ze zoeken al kennen: onderdelen, technische referenties, wijnen.
- De handmatige modus laat u naar boven duwen wat u eerst wilt verkopen, en geeft u volledige controle over hoe uw lijst eruitziet.
Die volgorde hoort bij de collectie, niet bij de shop. Uw nieuwe artikelen kunnen dus op datum staan terwijl uw maandselectie met de hand geordend blijft. Dat maakt de handmatige modus houdbaar: automatische volgordes passen zichzelf toe op producten die u later toevoegt, de handmatige modus vraagt dat u erop terugkomt, dus houd hem voor de collecties die het waard zijn.
Vergeet SEO niet. Uw collecties zijn net als uw productpagina's indexeerbaar. Vul de tags Title en Meta description in, en pas de URL's aan met uw zoekwoorden.


Hoofdstuk 2De collectielijsten
Waarvoor ze dienen
Een collectie bereikt het menu van uw app op twee manieren, en daar wordt het uitzicht van uw navigatie beslist.
Alleen. Elke collectie heeft een blok voor zichtbaarheid in het menu, waar u de optie aanvinkt die de collectie in het menu opneemt en haar plaats kiest. Ze wordt een volwaardig item, op gelijke voet met een sectie. Een shop met drie gangpaden toont ze zo, en de klant overziet de hele catalogus in één oogopslag.
Gegroepeerd. De sectie Collection list verzamelt er meerdere onder één item. Het nuttige richtpunt: boven vijf gangpaden wint het menu bij groeperen.
In het vocabulaire van e-commerce is die tweede manier het onderscheid tussen categorie en subcategorie, waarbij de lijst de categorie draagt en de collecties de subcategorieën. Komt u van een ander platform, dan is dit de handeling die u onder een andere naam kent.
Terug naar de decoratiewinkel en zijn tien collecties. Zonder groepering zou het menu van de app verzadigd zijn.
We maakten dus drie lijsten, volgens dezelfde drie zoeklijnen, met elk drie collecties:
- Rooms: Bedroom, Bathroom, Kitchen
- Objects: Frames, Vases, Pillows
- Trends: Big in Japan, Keep it Slow, Words matter
De soldencollectie blijft buiten elke lijst: we willen dat ze zo rechtstreeks mogelijk bereikbaar is. Dat is een beslissing om te onthouden, opruimen mag nooit begraven wat aan de oppervlakte moet blijven.


Hoe u ze aanmaakt
Een collectielijst is een sectie van uw Shopping App. U voegt ze toe zoals elke sectie, vanuit My App › Structure. Klik op Add a section, en kies daarna Collection list.
Geef uw sectie een titel, koppel er een beeld aan, en bevestig.
Om uw collecties erin te zetten, twee methodes:
- klik op het "+"-icoon om de collecties te selecteren die u wilt opnemen
- of sleep de collecties rechtstreeks onder de sectie met de collectielijst


Welke layout u kiest
Drie layouts, waarvan er één van uw navigatiemodus afhangt.
Swipe Submenu zet uw collecties in een submenu, onder de hoofdnavigatie van de app. Die layout is alleen beschikbaar in de navigatiemodus "Swipe", waarbij u van sectie naar sectie gaat door horizontaal over het scherm te vegen. Het is de standaardlayout van de catalogus, maar hij is aan de navigatie gebonden: kies hem alleen als uw app zich aan die modus houdt, nooit als eenvoudige terugvaloptie.
Classic toont uw gangpaden in rijen, met een kleine miniatuur en de naam in vet, meerdere per scherm. Dat is de gids-houding: hij past u wanneer u veel gangpaden hebt, wanneer de naam meer telt dan het beeld, en wanneer het ook zonder sterke beelden moet werken. Het is ook de natuurlijke terugvaloptie voor de twee andere.
Visual is een etalage: grote kaarten over de volle breedte, het beeld van het gangpad als achtergrond en de naam eroverheen. Kies hem wanneer gangpaden met het oog worden gekozen, in mode, decoratie of voeding.
Eén kanttekening bij die laatste: hij vraagt goede beelden bij al uw collecties. Hebben sommige er geen, of slechte, val dan terug op Classic.
De keuze maakt u in My App › Structure, via het menu van uw sectie, Edit the design. Classic en Visual gelden voor elke navigatiemodus. Staat uw app niet in Swipe-modus, dan zet het back office Swipe Submenu in het grijs en biedt het u een link om uw menu te wijzigen.




Gebruikt u overal dezelfde layout
Nee, en dat detail kan tellen. We raden aan de consistentie van het design in uw hele app te bewaren, maar layouts variëren laat u een hiërarchie aangeven.
Neem een buurtwinkel met een catalogus die zo is ingedeeld:
- Food
- Fresh: Fruit, Vegetables
- Bulk: Cereals, Rice & Pasta
- Health & Beauty: Cosmetics, Essential oils
Hier bevatten sommige collectielijsten geen collecties, maar andere collectielijsten. Er zijn dus twee niveaus te onderscheiden. Een andere layout toepassen op niveau 1 en niveau 2 voorkomt dat de klant verdwaalt in de boomstructuur.

Hoofdstuk 3De tags
Wat ze zijn
Een tag is een trefwoord dat aan een product hangt, als een markering. U kunt er meerdere aan hetzelfde product hangen.
Ze dienen eerst om uw producten in uw back office terug te vinden. Maar hun voornaamste waarde ligt elders: ze sturen wat er aan de kant van de klant wordt getoond.
- ze filteren de widgets met productlijsten op uw startscherm
- ze voeden, samen met de collecties, het blok met vergelijkbare producten op uw productpagina's
- ze voeden de resultaten van de zoeksectie van uw shop
Hoe u ze kiest
Zie tags als secundaire collecties, onzichtbaar in de navigatie maar actief in de weergave. Ze worden meestal gebouwd op de kenmerken van uw producten: kleur, materiaal, vorm.
Een voorbeeld. In een kledingzaak gaat een bruine wollen coltrui naar de collectielijst "Clothing", collectie "Sweaters". Hij krijgt de tags "coltrui", "bruin", "wol".
Daar volgen meteen twee toepassingen uit. Om al uw wollen artikelen op het startscherm te tonen, filtert u gewoon op de tag "wol". En de trui kan als aanvullend product verschijnen onder een bruine broek.
Dat is het fundamentele verschil met collecties: de collectie ordent wat de klant doorloopt, de tag ordent wat u hem voorlegt.
Hoe u ze aanmaakt
U voegt ze toe bij het aanmaken of bewerken van een product. In het menu rechts van de bewerkpagina van het product voert u uw tags in het veld Tags in. Publiceer om te bevestigen.
Twee schrijfregels bepalen de gezondheid van uw woordenschat op termijn. Een tag schrijft u als één woord, zonder spatie, en daarom staat er in het voorbeeld hierboven "coltrui". En hoofdletters worden genegeerd, wol en Wol zijn dezelfde tag, dus u hoeft niet op uw hoofdletters te letten.
De rest is discipline, en het back office geeft u het gereedschap: boven het veld opent View all tags de lijst van de tags die al in uw shop staan, met een zoekfunctie en een sortering op alfabet of op gebruiksfrequentie. Maak er een gewoonte van eruit te kiezen in plaats van opnieuw te typen. Een woordenschat die afdrijft naar wol, wollen en zuiverwol filtert drie keer minder producten dan er bestaan, en die afdrijving ontdekt u pas na tweehonderd productpagina's.
Ontwerp