Organizar sua loja

As coleções estruturam seu Shopping App e organizam seus produtos. Se seu app fosse uma loja física, as coleções seriam seus corredores.

Elas também decidem o que seu cliente consegue alcançar. Um produto associado a nenhuma coleção existe na sua loja, e vende, mas é alcançado pelo seu endereço direto: por um link que você envia, por uma busca, por um widget da tela inicial. Associar cada produto a pelo menos uma coleção é portanto o primeiro reflexo, antes mesmo de pensar na sua organização.

Elas são flexíveis em dois aspectos. No tempo, primeiro: uma coleção é criada, excluída, exibida ou escondida em um clique, o que torna possíveis as coleções temporárias. Na organização, depois: elas se cruzam, e o mesmo produto pertence a várias coleções ao mesmo tempo.

É esse caráter transversal que merece sua atenção quando você as cria. Veja nossa loja de decoração. Um cliente que procura um objeto decorativo pode pensar por três linhas diferentes: o cômodo em questão, o tipo de objeto, a tendência do momento. Criamos então nove coleções distribuídas nessas três linhas:

Por cômodo: Bedroom, Bathroom, Kitchen

Por tipo de objeto: Frames, Vases, Pillows

Por tendência: Big in Japan, Keep it Slow, Words matter

Cada produto pertence, portanto, a várias coleções. Ele tem mais chances de ser visto, e o cliente tem mais chances de encontrá-lo pelo caminho que lhe é natural.

A isso se acrescenta uma coleção de liquidação, que reúne os produtos com desconto. Ela muda com o tempo, e fica escondida fora da temporada de liquidação.

Vá em Products › Collections. Clique em Create a collection.

Em seguida você informa o título, uma imagem de ilustração, e a ordem de exibição dos produtos. O título é limitado a 32 caracteres, e é uma restrição útil: o nome de um corredor é lido em um menu, na tela de um celular, e os nomes curtos sempre ganham ali.

Para a ordem de exibição, a regra é sempre a mesma: pergunte-se o que seu cliente está procurando.

Seis ordens automáticas são oferecidas, em pares: data de criação, da mais recente à mais antiga ou o contrário, preço, do menor ao maior ou o contrário, e título, de A a Z ou de Z a A. O sétimo modo é manual.

• A data coloca as novidades na frente. É a escolha certa para uma loja de roupas reabastecida regularmente, ou para uma livraria cujos clientes voltam à procura de novas leituras.
• O preço crescente serve a uma mercearia, onde o cliente quer controlar o orçamento. O preço decrescente serve mais a uma coleção de alto padrão, onde o primeiro item define o nível.
• A ordem alfabética é para catálogos que as pessoas percorrem já sabendo o nome do que querem: peças de reposição, referências técnicas, vinhos.
• O modo manual permite empurrar para o topo o que você quer vender primeiro, e dá controle completo sobre a aparência da sua lista.

Essa ordem pertence à coleção, não à loja. Suas novidades podem então ser ordenadas por data enquanto sua seleção do mês continua arrumada à mão. É isso que torna o modo manual sustentável: as ordens automáticas se aplicam sozinhas aos produtos que você acrescenta depois, o modo manual pede que você volte nele, então reserve-o às coleções que merecem.

Não esqueça o SEO. Suas coleções são indexáveis assim como suas páginas de produto. Preencha as tags Title e Meta description, e personalize as URLs com suas palavras-chave.

Uma coleção chega ao menu do seu app de duas maneiras, e é aí que se decide a aparência da sua navegação.

Sozinha. Cada coleção traz seu bloco de visibilidade no menu, onde você marca a opção que lista a coleção no menu e escolhe seu lugar. Ela vira uma entrada por direito próprio, no mesmo nível de uma seção. Uma loja com três corredores os exibe assim, e seu cliente abarca o catálogo inteiro num olhar.

Agrupada. A seção Collection list reúne várias delas sob uma única entrada. O marcador útil: acima de cinco corredores, o menu ganha em ser agrupado.

No vocabulário do e-commerce, essa segunda maneira é a distinção entre categoria e subcategoria, com a lista sustentando a categoria e as coleções as subcategorias. Se você está chegando de outra plataforma, este é o gesto que você conhece com outro nome.

Voltemos à loja de decoração e às suas dez coleções. Sem agrupamento, o menu do app ficaria saturado.

Criamos então três listas, retomando as três linhas de busca, com três coleções cada uma:

• Rooms: Bedroom, Bathroom, Kitchen
• Objects: Frames, Vases, Pillows
• Trends: Big in Japan, Keep it Slow, Words matter

A coleção de liquidação fica fora de qualquer lista: queremos que ela seja o mais diretamente acessível possível. É uma decisão que vale guardar, arrumar nunca deve enterrar o que precisa ficar na superfície.

Uma lista de coleções é uma seção do seu Shopping App. Ela é adicionada como qualquer seção, em My App › Structure. Clique em Add a section, e depois escolha Collection list.

Dê um título à sua seção, associe uma imagem a ela, e confirme.

Para colocar suas coleções dentro, dois métodos:

• clique no ícone "+" para selecionar as coleções a incluir
• ou arraste as coleções diretamente para baixo da seção de lista de coleções

Três layouts, um dos quais depende do seu modo de navegação.

Swipe Submenu coloca suas coleções em um submenu, abaixo da navegação principal do app. Ele só está disponível no modo de navegação "Swipe", aquele em que você passa de seção em seção deslizando a tela horizontalmente. É o layout padrão do catálogo, mas ele está preso à navegação: só o escolha se seu app assumir esse modo, nunca como simples alternativa.

Classic apresenta seus corredores em linhas, com uma pequena miniatura e o nome em negrito, vários por tela. É a postura de diretório: ele serve quando você tem muitos corredores, quando o nome importa mais que a imagem, e quando precisa funcionar mesmo sem visuais fortes. É também a alternativa natural aos outros dois.

Visual é uma vitrine: cartões grandes em toda a largura, a imagem do corredor como fundo e o nome por cima. Escolha-o quando os corredores forem escolhidos pelo olho, em moda, decoração ou alimentação.

Uma ressalva sobre este último: ele exige bons visuais em todas as suas coleções. Se algumas não tiverem, ou tiverem visuais ruins, volte para o Classic.

A escolha é feita em My App › Structure, no menu da sua seção, Edit the design. Classic e Visual se aplicam a qualquer modo de navegação. Se seu app não estiver no modo Swipe, o back office deixa o Swipe Submenu em cinza e oferece um link para mudar seu menu.

Não, e é um detalhe que pode importar. Recomendamos manter a coerência de design em todo o app, mas variar os layouts permite sinalizar uma hierarquia.

Veja uma mercearia cujo catálogo é organizado assim:

• Food
• Fresh: Fruit, Vegetables
• Bulk: Cereals, Rice & Pasta
• Health & Beauty: Cosmetics, Essential oils

Aqui, algumas listas de coleções contêm não coleções, mas outras listas de coleções. Há então dois níveis a distinguir. Aplicar um layout diferente ao nível 1 e ao nível 2 evita que o cliente se perca na árvore.

Uma tag é uma palavra-chave associada a um produto, como um marcador. Você pode associar várias ao mesmo produto.

Elas servem primeiro para reencontrar seus produtos no seu back office. Mas seu principal valor está em outro lugar: elas comandam o que é exibido do lado do cliente.

• elas filtram os widgets de lista de produtos da sua tela inicial
• elas alimentam, junto com as coleções, o bloco de produtos similares das suas páginas de produto
• elas alimentam os resultados da seção de busca da sua loja

Pense nas tags como coleções secundárias, invisíveis na navegação mas ativas na exibição. Elas geralmente são construídas sobre as características dos seus produtos: cor, material, forma.

Um exemplo. Em uma loja de roupas, um suéter de gola alta de lã marrom vai para a lista de coleções "Clothing", coleção "Sweaters". Ele recebe as tags "golaalta", "marrom", "lã".

Daí saem dois usos imediatos. Para exibir todos os seus artigos de lã na tela inicial, basta filtrar pela tag "lã". E o suéter pode aparecer como produto complementar sob uma calça marrom.

É essa a diferença fundamental com as coleções: a coleção organiza o que o cliente percorre, a tag organiza o que você apresenta a ele.

Elas são adicionadas na criação ou na edição de um produto. No menu à direita da página de edição do produto, informe suas tags no campo Tags. Publique para confirmar.

Duas regras de escrita decidem a saúde do seu vocabulário ao longo do tempo. Uma tag se escreve como uma só palavra, sem espaço, e é por isso que o exemplo acima diz "golaalta". E as maiúsculas são ignoradas, lã e Lã são a mesma tag, então você não precisa vigiar suas maiúsculas.

O resto é disciplina, e o back office dá a ferramenta: acima do campo, View all tags abre a lista das que já existem na sua loja, com uma busca e uma ordenação por ordem alfabética ou por frequência de uso. Ganhe o hábito de escolher nela em vez de redigitar. Um vocabulário que deriva para lã, lanoso e puralã filtra três vezes menos produtos do que existem, e é uma deriva que você descobre depois de duzentas páginas de produto.