Organizar tu tienda

Las colecciones estructuran tu Shopping App y organizan tus productos. Si tu app fuera una tienda física, las colecciones serían sus pasillos.

También deciden a qué puede llegar tu cliente. Un producto que no está en ninguna colección existe en tu tienda, y se vende, pero se alcanza por su dirección directa: por un enlace que envías, por una búsqueda, por un widget de la pantalla de inicio. Vincular cada producto a al menos una colección es, por tanto, el primer reflejo, incluso antes de pensar en tu organización.

Son flexibles por dos motivos. En el tiempo, primero: una colección se añade, se elimina, se muestra o se oculta con un clic, lo que hace posibles las colecciones temporales. En la organización, después: se cruzan entre sí, y un mismo producto pertenece a varias colecciones a la vez.

Esa cualidad transversal es lo que merece tu atención al crearlas. Tomemos nuestra tienda de decoración. Un cliente que busca un objeto decorativo puede pensar en tres líneas distintas: la habitación en cuestión, el tipo de objeto, la tendencia del momento. Así que creamos nueve colecciones repartidas en esas tres líneas:

Por habitación: Bedroom, Bathroom, Kitchen

Por tipo de objeto: Frames, Vases, Pillows

Por tendencia: Big in Japan, Keep it Slow, Words matter

Cada producto pertenece, por tanto, a varias colecciones. Tiene más posibilidades de ser visto, y el cliente tiene más posibilidades de encontrarlo por el camino que le resulta natural.

A eso se añade una colección de rebajas, que reúne los productos con descuento. Cambia con el tiempo y se oculta fuera de la temporada de rebajas.

Ve a Products › Collections. Haz clic en Create a collection.

Después introduces el título, una imagen de ilustración y el orden de visualización de los productos. El título está limitado a 32 caracteres, y es una limitación útil: el nombre de un pasillo se lee en un menú, en la pantalla de un teléfono, y ahí los nombres cortos siempre ganan.

Para el orden de visualización, la regla es siempre la misma: pregúntate qué busca tu cliente.

Se ofrecen seis órdenes automáticos, por parejas: fecha de creación, de más reciente a más antiguo o al revés; precio, de menor a mayor o al revés; y título, de la A a la Z o de la Z a la A. El séptimo modo es manual.

• La fecha pone las novedades delante. Es la elección correcta para una tienda de ropa que se repone con regularidad, o para una librería cuyos clientes vuelven en busca de nuevas lecturas.
• El precio ascendente conviene a una tienda de alimentación, donde el cliente quiere controlar su presupuesto. El precio descendente sirve más bien a una colección de gama alta, donde el primer artículo marca el nivel.
• El orden alfabético es para los catálogos que se recorren sabiendo ya el nombre de lo que se quiere: piezas de recambio, referencias técnicas, vinos.
• El modo manual te permite subir arriba lo que quieres vender primero y te da el control completo del aspecto de tu lista.

Ese orden pertenece a la colección, no a la tienda. Así que tus novedades pueden ordenarse por fecha mientras tu selección del mes se queda ordenada a mano. Eso es lo que hace sostenible el modo manual: los órdenes automáticos se aplican solos a los productos que añades después, el modo manual te pide volver a él, así que resérvalo para las colecciones que lo merecen.

No olvides el SEO. Tus colecciones son indexables igual que tus fichas de producto. Rellena las etiquetas Title y Meta description, y personaliza las URL con tus palabras clave.

Una colección llega al menú de tu app de dos maneras, y ahí es donde se decide el aspecto de tu navegación.

Sola. Cada colección lleva su bloque de visibilidad en el menú, donde marcas la opción que la incluye en el menú y eliges su sitio. Se convierte en una entrada por derecho propio, al mismo nivel que una sección. Una tienda con tres pasillos los muestra así, y su cliente abarca todo el catálogo de un vistazo.

Agrupada. La sección de lista de colecciones reúne varias bajo una sola entrada. La referencia útil: a partir de cinco pasillos, el menú gana con la agrupación.

En el vocabulario del e-commerce, esa segunda manera es la distinción entre categoría y subcategoría: la lista sostiene la categoría y las colecciones las subcategorías. Si vienes de otra plataforma, este es el gesto que conoces con otro nombre.

Volvamos a la tienda de decoración y a sus diez colecciones. Sin agrupación, el menú de la app estaría saturado.

Así que creamos tres listas, retomando las tres líneas de búsqueda, con tres colecciones cada una:

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

La colección de rebajas se queda fuera de cualquier lista: queremos que sea lo más directamente accesible posible. Es una decisión que conviene recordar: ordenar nunca debe enterrar lo que tiene que quedarse en la superficie.

Una lista de colecciones es una sección de tu Shopping App. Se añade como cualquier sección, desde My App › Structure. Haz clic en Add a section y elige Collection list.

Dale un título a tu sección, asóciale una imagen y confirma.

Para meter tus colecciones dentro, dos métodos:

• haz clic en el icono «+» para seleccionar las colecciones que quieres incluir
• o arrastra las colecciones directamente bajo la sección de lista de colecciones

Tres layouts, uno de los cuales depende de tu modo de navegación.

Swipe Submenu coloca tus colecciones en un submenú, bajo la navegación principal de la app. Solo está disponible en el modo de navegación «Swipe», aquel en el que se pasa de una sección a otra deslizando la pantalla en horizontal. Es el layout por defecto del catálogo, pero está ligado a la navegación: elígelo solo si tu app se compromete con ese modo, nunca como simple recambio.

Classic presenta tus pasillos en filas, con una miniatura pequeña y el nombre en negrita, varios por pantalla. Es la postura del directorio: te conviene cuando tienes muchos pasillos, cuando el nombre importa más que la imagen, y cuando tiene que funcionar incluso sin visuales potentes. Es también el recambio natural de los otros dos.

Visual es un escaparate: tarjetas grandes a todo lo ancho, con la imagen del pasillo de fondo y el nombre encima. Elígelo cuando los pasillos se eligen con la vista, en moda, decoración o alimentación.

Una advertencia sobre este último: exige buenos visuales en todas tus colecciones. Si algunas no tienen, o son malos, vuelve a Classic.

La elección se hace en My App › Structure, en el menú de tu sección, Edit the design. Classic y Visual se aplican a cualquier modo de navegación. Si tu app no está en modo Swipe, el back office desactiva Swipe Submenu y te ofrece un enlace para cambiar tu menú.

No, y es un detalle que puede contar. Recomendamos mantener la coherencia de diseño en toda tu app, pero variar los layouts te permite señalar una jerarquía.

Tomemos una tienda de alimentación cuyo catálogo está organizado así:

• Alimentación
• Fresco: Frutas, Verduras
• A granel: Cereales, Arroz y pasta
• Salud y belleza: Cosmética, Aceites esenciales

Aquí, algunas listas de colecciones no contienen colecciones sino otras listas de colecciones. Hay, por tanto, dos niveles que distinguir. Aplicar un layout distinto al nivel 1 y al nivel 2 evita que el cliente se pierda en el árbol.

Un tag es una palabra clave asociada a un producto, como una marca. Puedes asociar varios al mismo producto.

Sirven, primero, para volver a encontrar tus productos en tu back office. Pero su valor principal está en otra parte: gobiernan lo que se muestra del lado del cliente.

• filtran los widgets de lista de productos de tu pantalla de inicio
• alimentan, junto con las colecciones, el bloque de productos similares de tus fichas de producto
• alimentan los resultados de la sección de búsqueda de tu tienda

Piensa en los tags como colecciones secundarias, invisibles en la navegación pero activas en la presentación. Se construyen normalmente sobre las características de tus productos: color, material, forma.

Un ejemplo. En una tienda de ropa, un jersey de cuello alto de lana marrón va a la lista de colecciones «Clothing», colección «Sweaters». Recibe los tags «cuelloalto», «marron», «lana».

De ahí salen dos usos inmediatos. Para mostrar todos tus artículos de lana en la pantalla de inicio, basta con filtrar por el tag «lana». Y el jersey puede aparecer como producto complementario bajo un pantalón marrón.

Esa es la diferencia fundamental con las colecciones: la colección organiza lo que el cliente recorre, el tag organiza lo que tú le presentas.

Se añaden al crear o al editar un producto. En el menú derecho de la página de edición del producto, escribe tus tags en el campo Tags. Publica para confirmar.

Dos reglas de escritura deciden la salud de tu vocabulario con el tiempo. Un tag se escribe en una sola palabra, sin espacio, y por eso el ejemplo de arriba dice «cuelloalto». Y las mayúsculas se ignoran: lana y Lana son el mismo tag, así que no tienes que vigilar tus mayúsculas.

El resto es disciplina, y el back office te da la herramienta: encima del campo, View all tags abre la lista de los que ya existen en tu tienda, con una búsqueda y una ordenación por orden alfabético o por frecuencia de uso. Acostúmbrate a elegir de ahí en lugar de volver a escribir. Un vocabulario que se dispersa en lana, lanas y puralana filtra tres veces menos productos de los que existen, y esa deriva se descubre después de doscientas fichas de producto.