E-handelsapp
Organisera din butik
Tre verktyg strukturerar din katalog, och de arbetar på olika nivåer. Kollektionerna är din butiks gångar. Kollektionslistorna städar de gångarna så att din meny inte svämmar över. Taggarna arbetar i bakgrunden, som osynliga sekundära kollektioner.
Kapitel 1Kollektioner
Vad de är
Kollektionerna strukturerar din Shopping App och organiserar dina produkter. Om din app vore en fysisk butik skulle kollektionerna vara dess gångar.
De avgör också vad din kund kan nå. En produkt som inte hör till någon kollektion finns visserligen i din butik, och den säljs visserligen, men den nås via sin direkta adress: via en länk du skickar, via en sökning, via en widget på startskärmen. Att koppla varje produkt till minst en kollektion är alltså den första reflexen, redan innan du tänker på hur du ska organisera dig.
De är flexibla på två sätt. I tiden först: en kollektion läggs till, raderas, visas eller döljs med ett klick, vilket gör tillfälliga kollektioner möjliga. I organisationen sedan: de korsar varandra, och samma produkt hör hemma i flera kollektioner samtidigt.
Just det korsande draget förtjänar din uppmärksamhet när du skapar dem. Ta vår inredningsbutik. En kund som letar efter ett dekorationsföremål kan tänka längs tre olika linjer: rummet det gäller, typen av föremål, trenden för stunden. Vi skapade alltså nio kollektioner fördelade över de tre linjerna:
Per rum: Bedroom, Bathroom, Kitchen
Per typ av föremål: Frames, Vases, Pillows
Per trend: Big in Japan, Keep it Slow, Words matter
Varje produkt hör alltså hemma i flera kollektioner. Den har större chans att bli sedd, och kunden har större chans att hitta den längs den väg som faller sig naturlig för hen.
Ovanpå det kommer en reakollektion, som samlar de nedsatta produkterna. Den ändras över tid, och hålls dold utanför reasäsongen.
Skapa dem
Gå till Products › Collections. Klicka på Create a collection.
Sedan fyller du i titeln, en illustrationsbild, och visningsordningen för produkterna. Titeln är begränsad till 32 tecken, vilket är en nyttig begränsning: ett gångnamn läses i en meny, på en telefonskärm, och där vinner korta namn alltid.
För visningsordningen är regeln alltid densamma: fråga dig vad din kund letar efter.
Sex automatiska ordningar erbjuds, parvis: skapandedatum, nyast till äldst eller tvärtom, pris, lägst till högst eller tvärtom, och titel, A till Ö eller Ö till A. Det sjunde läget är manuellt.
- Datum sätter nyheterna först. Det är rätt val för en klädbutik som fylls på regelbundet, eller för en bokhandel vars kunder kommer tillbaka och letar efter något nytt att läsa.
- Stigande pris passar en livsmedelsbutik, där kunden vill hålla koll på sin budget. Fallande pris tjänar snarare en exklusiv kollektion, där den första varan sätter nivån.
- Bokstavsordning är till för kataloger som folk bläddrar i när de redan känner namnet på det de vill ha: reservdelar, tekniska referenser, viner.
- Manuellt läge låter dig skjuta upp det du vill sälja först, och ger dig full kontroll över hur din lista ser ut.
Den ordningen tillhör kollektionen, inte butiken. Dina nyheter kan alltså sorteras efter datum medan ditt månadsurval förblir ordnat för hand. Det är det som gör det manuella läget hållbart: automatiska ordningar tillämpar sig själva på produkter du lägger till senare, det manuella läget kräver att du kommer tillbaka till det, så spara det till de kollektioner som förtjänar det.
Glöm inte SEO. Dina kollektioner går att indexera precis som dina produktsidor. Fyll i taggarna Title och Meta description, och anpassa adresserna med dina nyckelord.


Kapitel 2Kollektionslistor
Vad de är till för
En kollektion når din apps meny på två sätt, och det är där utseendet på din navigering avgörs.
På egen hand. Varje kollektion bär sitt block för menysynlighet, där du kryssar för alternativet som listar kollektionen i menyn och väljer dess plats. Den blir en post i egen rätt, i nivå med ett avsnitt. En butik med tre gångar visar dem så, och dess kund tar in hela katalogen med en blick.
Grupperade. Avsnittet Collection list samlar flera av dem under en enda post. Det användbara riktmärket: bortom fem gångar vinner menyn på att grupperas.
I e-handelns vokabulär är det andra sättet skillnaden mellan kategori och underkategori, där listan är kategorin och kollektionerna underkategorierna. Om du kommer från en annan plattform är det här draget du känner under ett annat namn.
Låt oss återvända till inredningsbutiken och dess tio kollektioner. Utan gruppering skulle appens meny bli överfull.
Vi skapade alltså tre listor, som tar upp de tre söklinjerna, med tre kollektioner var:
- Rooms: Bedroom, Bathroom, Kitchen
- Objects: Frames, Vases, Pillows
- Trends: Big in Japan, Keep it Slow, Words matter
Reakollektionen står utanför alla listor: vi vill att den ska vara så direkt nåbar som möjligt. Det är ett beslut värt att hålla i minnet, städningen får aldrig begrava det som måste ligga kvar i ytan.


Skapa dem
En kollektionslista är ett avsnitt i din Shopping App. Den läggs till som vilket avsnitt som helst, från My App › Structure. Klicka på Add a section, och välj sedan Collection list.
Ge ditt avsnitt en titel, koppla en bild till det, och bekräfta.
För att lägga in dina kollektioner i det, två metoder:
- klicka på ikonen ”+” för att välja kollektionerna att ta med
- eller dra kollektionerna direkt under avsnittet Collection list


Vilken layout du ska välja
Tre layouter, varav en beror på ditt navigeringsläge.
Swipe Submenu lägger dina kollektioner i en undermeny, under appens huvudnavigering. Den finns bara i navigeringsläget ”Swipe”, det där du går från avsnitt till avsnitt genom att svepa horisontellt över skärmen. Det är katalogens standardlayout, men den är bunden till navigeringen: välj den bara om din app satsar på det läget, aldrig som en enkel reservlösning.
Classic presenterar dina gångar i rader, med en liten miniatyrbild och namnet i fetstil, flera per skärm. Det är katalogens hållning: den passar dig när du har många gångar, när namnet betyder mer än bilden, och när det måste fungera även utan starka bilder. Den är också den naturliga reservlösningen från de två andra.
Visual är ett skyltfönster: stora kort i full bredd, gångens bild som bakgrund och namnet ovanpå. Välj den när gångarna väljs med ögat, inom mode, inredning eller mat.
En reservation kring den sista: den kräver bra bilder på samtliga dina kollektioner. Om vissa saknar bilder, eller har dåliga, ska du falla tillbaka på Classic.
Valet görs i My App › Structure, på ditt avsnitts meny, Edit the design. Classic och Visual gäller i alla navigeringslägen. Om din app inte är i Swipe-läge gråmarkerar back office Swipe Submenu och erbjuder dig en länk för att byta meny.




Ska du använda samma layout överallt
Nej, och den detaljen kan spela roll. Vi rekommenderar att du håller designen konsekvent genom hela din app, men att variera layouter låter dig markera en hierarki.
Ta en livsmedelsbutik vars katalog är upplagd så här:
- Food
- Fresh: Fruit, Vegetables
- Bulk: Cereals, Rice & Pasta
- Health & Beauty: Cosmetics, Essential oils
Här innehåller vissa kollektionslistor inte kollektioner utan andra kollektionslistor. Det finns alltså två nivåer att skilja åt. Att tillämpa en annan layout på nivå 1 och nivå 2 hindrar kunden från att gå vilse i trädet.

Kapitel 3Taggar
Vad de är
En tagg är ett nyckelord kopplat till en produkt, som en markör. Du kan koppla flera till samma produkt.
De tjänar först och främst till att hitta tillbaka till dina produkter i ditt back office. Men deras främsta värde ligger någon annanstans: de styr det som visas på kundens sida.
- de filtrerar produktlistewidgetarna på din startskärm
- de matar, tillsammans med kollektionerna, blocket med liknande produkter på dina produktsidor
- de matar resultaten i din butiks sökavsnitt
Hur du väljer dem
Se taggarna som sekundära kollektioner, osynliga i navigeringen men aktiva i visningen. De byggs i allmänhet på dina produkters egenskaper: färg, material, form.
Ett exempel. I en klädbutik hamnar en brun polotröja i ull i kollektionslistan ”Clothing”, kollektionen ”Sweaters”. Den får taggarna ”polokrage”, ”brun”, ”ull”.
Två användningar följer omedelbart. För att visa alla dina ullplagg på startskärmen filtrerar du helt enkelt på taggen ”ull”. Och tröjan kan dyka upp som kompletterande produkt under ett par bruna byxor.
Det är den grundläggande skillnaden mot kollektionerna: kollektionen organiserar det kunden bläddrar igenom, taggen organiserar det du lägger fram för hen.
Skapa dem
De läggs till när du skapar eller redigerar en produkt. I högermenyn på produktens redigeringssida fyller du i dina taggar i fältet Tags. Publicera för att bekräfta.
Två skrivregler avgör hur din vokabulär mår på sikt. En tagg skrivs som ett ord, utan mellanslag, och därför står det ”polokrage” i exemplet ovan. Och versaler ignoreras, ull och Ull är samma tagg, så du behöver inte hålla ordning på dina stora bokstäver.
Resten är disciplin, och back office ger dig verktyget: ovanför fältet öppnar View all tags listan över dem som redan finns i din butik, med en sökfunktion och en sortering efter bokstavsordning eller efter användningsfrekvens. Gör det till en vana att välja därifrån i stället för att skriva om. En vokabulär som driver iväg mot ull, ylle och rentull filtrerar tre gånger färre produkter än det finns, och det är en drift du upptäcker efter tvåhundra produktsidor.
Design