Criar Bundles Editáveis em Regras de Merchandising Avançado

Este documento contém instruções para criar regras no Merchandising Avançado, permitindo aos retalhistas criar conjuntos específicos de recomendações. Para mais informações sobre o que o Merchandising Avançado pode fazer, consulte Merchandising Avançado Rules.

Note: O Merchandising Avançado deve ser ativado pela Algonomy para o site antes de poder começar.

Esta página destina-se a quem é responsável por criar e manter regras de Merchandising Avançado e que esteja familiarizado com o site e os placements, bem como com outras regras existentes.

Criar Bundles

Este guia explica como uma regra de Merchandising Avançado pode ser utilizada para devolver JSON adequado para programadores client-side apresentarem um bundle editável de produtos. O objetivo é facilitar a apresentação de um produto seed juntamente com produtos recomendados relacionados, e uma lista de alternativas potenciais para cada recomendação. Em última análise, o utilizador final deve conseguir "editar" o bundle selecionando entre um conjunto de alternativas e adicionar o bundle completo – item seed com os produtos selecionados – ao carrinho de compras.

Abaixo encontra-se um mockup de uma interface de utilizador baseada na web que apresenta um bundle dinâmico editável:

Neste exemplo, existem três passos para o Recommend criar e disponibilizar JSON para suportar este caso de utilização através do Merchandising Avançado:

Criar uma regra de Merchandising Avançado para devolver o item seed e as recomendações que compõem o bundle, incluindo o(s) item(ns) recomendados do bundle e respetivas alternativas.
Criar um Placement e um Layout JSON especial que disponibilize JSON num formato fácil de utilizar pelos programadores client-side.
Desenvolver o código client-side que apresenta e permite editar o bundle, por exemplo: JavaScript e HTML que permitam ao comprador selecionar quais os produtos do bundle que pretende adquirir e adicioná-los ao carrinho de compras. (A criação do código client-side deve ser da responsabilidade do cliente.)

Note: Integrações server-side também podem utilizar bundles, mas o controlo do Layout reside no lado do cliente. Os membros da equipa de CS Consulting da Algonomy podem e devem ser envolvidos para orientar estes clientes sobre como estruturar o Layout.

Construir a Regra de Merchandising Avançado para um Bundle

Uma regra de Merchandising Avançado para devolver os resultados necessários deve ter um único produto – o item seed – como contexto e, pelo menos, dois grupos de recomendações. O primeiro grupo de recomendações deve ter apenas um item, o próprio item seed. Ou seja, o critério para o grupo de recomendações deve ser um Produto, que é o mesmo que o produto seed de todo o bundle. Isto garante que o primeiro item devolvido pelo p13n é o item seed. O nome do primeiro grupo de recomendações não é relevante, assumindo que a regra será utilizada com o layout JSON de exemplo que acompanha este artigo. Os nomes dos grupos de recomendações aparecem no Experience Browser e noutros registos, pelo que devem ser facilmente identificáveis e diferenciáveis.

O segundo grupo de recomendações deve ter pelo menos dois (mas pode ter mais) itens recomendados. O primeiro item será o item proposto para o bundle (ou seja, o item recomendado para ser adquirido juntamente com o produto seed), e os itens adicionais serão alternativas a esse item. Abaixo encontra-se um exemplo de um grupo de recomendações com um item recomendado e respetivas alternativas.

No exemplo acima, existe apenas um item no bundle com um conjunto de alternativas, mas com o layout JSON utilizado neste exemplo é possível adicionar itens adicionais ao bundle e respetivas alternativas relacionadas. Por exemplo, um cliente pode querer sugerir aos seus compradores a aquisição de um bundle de portátil que inclua um portátil (item seed), um rato, um monitor externo e uma impressora.

Exemplo com múltiplos grupos de recomendações (amplie para ver melhor): http://rrcs.cachefly.net/clients/dynamic_bundle_ex/Dynamic_Bundle_Rule_Ex.png.

Placement e Layout JSON

Como um bundle é baseado num item (um único produto como contexto), deve ser utilizado um placement do tipo "Item Page" ou outro tipo de placement focado num único produto, em vez de "Category Page" ou de uma página que exija um tipo diferente de seed.

Em vez de disponibilizar o conjunto de recomendações numa lista não estruturada, como acontece com um layout JSON padrão, foi desenvolvido um layout JSON que disponibiliza JSON num formato mais estruturado e fácil de analisar para bundles. Abaixo encontra-se um exemplo da estrutura JSON final disponível para programadores client-side através da função callback JavaScript habitual após a conclusão da execução do p13n.

Copy

{
  "placements": [
    {
      "strategy": "AdvancedMerchandisingStrategy",
      "placement_name": "item_page.Dynamic_Bundle_Ex",
      "message": "Sample Electronics Bundle",
      "bundle": {
        "seed_item": {
          "id": "22610824",
          "name": "&quot;HP Winter Blue 15.6\\&quot; 2000-2b19wm Laptop PC with AMD E-300 Accelerated Processor and Windows 8 Operating System&quot;",
          "linkURL": "https:\/\/recs.richrelevance.com\/rrserver\/click?a=showcaseparent&vg=f4f171c5-056f-40f6-d16b-63598da9a03b&pti=1&pa=Dynamic_Bundle_Ex&hpi=12503&stn=AdvancedMerchandisingStrategy&stid=300&rti=2&sgs=&u=3242342342344&mvtId=-1&mvtTs=1538515565661&uguid=85ecdd0a-48f4-49b4-f682-f158fdeba836&channelId=WEB&s=3243268987675&pg=1802&amrId=31228&p=22610824&ind=0&ct=http%3A%2F%2Flabs.richrelevance.com%2Fstorre%2Fcatalog%2Fproduct%2Fview%2Fsku%2F22610824",
          "imageURL": "http:\/\/labs.richrelevance.com\/storre\/media\/catalog\/product\/h\/p\/hp-winter-blue-15.6quot-2000-2b19wm-laptop-pc-with-amd-e-300-accelerated-processor-and-windows-8-operating-system-39e44275558e22a52a1c9976e89ac170.jpg",
          "price": "0.01",
          "recommendation_group": "seed",
          "item_index": "0"
        },
        "recommendation_groups": [
          {
            "mice and keyboards": {
              "bundled_item": {
                "id": "11987393",
                "name": "Centon 32GB DataStick Pro USB 2.0 Flash Drive, Gray",
                "linkURL": "https:\/\/recs.richrelevance.com\/rrserver\/click?a=showcaseparent&vg=f4f171c5-056f-40f6-d16b-63598da9a03b&pti=1&pa=Dynamic_Bundle_Ex&hpi=12503&stn=AdvancedMerchandisingStrategy&stid=300&rti=2&sgs=&u=3242342342344&mvtId=-1&mvtTs=1538515565661&uguid=85ecdd0a-48f4-49b4-f682-f158fdeba836&channelId=WEB&s=3243268987675&pg=1802&amrId=31228&p=11987393&ind=1&ct=http%3A%2F%2Flabs.richrelevance.com%2Fstorre%2Fcatalog%2Fproduct%2Fview%2Fsku%2F11987393",
                "imageURL": "http:\/\/labs.richrelevance.com\/storre\/media\/catalog\/product\/c\/e\/centon-32gb-datastick-pro-usb-2.0-flash-drive-gray-c731c469fa41088a6e6633edd668a737.jpg",
                "price": "0.01",
                "recommendation_group": "mice and keyboards",
                "item_index": "1"
              },
              "alternate_items": [
                {
                  "id": "14301743",
                  "name": "Logitech Corded Mouse M100",
                  "linkURL": "https:\/\/recs.richrelevance.com\/rrserver\/click?a=showcaseparent&vg=f4f171c5-056f-40f6-d16b-63598da9a03b&pti=1&pa=Dynamic_Bundle_Ex&hpi=12503&stn=AdvancedMerchandisingStrategy&stid=300&rti=2&sgs=&u=3242342342344&mvtId=-1&mvtTs=1538515565661&uguid=85ecdd0a-48f4-49b4-f682-f158fdeba836&channelId=WEB&s=3243268987675&pg=1802&amrId=31228&p=14301743&ind=2&ct=http%3A%2F%2Flabs.richrelevance.com%2Fstorre%2Fcatalog%2Fproduct%2Fview%2Fsku%2F14301743",
                  "imageURL": "http:\/\/labs.richrelevance.com\/storre\/media\/catalog\/product\/l\/o\/logitech-corded-mouse-m100-6b576f6c74b4b24454c03d766b738224.jpg",
                  "price": "0.01",
                  "recommendation_group": "mice and keyboards",
                  "item_index": "2"
                },
                {
                  "id": "7754462",
                  "name": "Memorex 05621 DVD+R 100PK 16X Spindle",
                  "linkURL": "https:\/\/recs.richrelevance.com\/rrserver\/click?a=showcaseparent&vg=f4f171c5-056f-40f6-d16b-63598da9a03b&pti=1&pa=Dynamic_Bundle_Ex&hpi=12503&stn=AdvancedMerchandisingStrategy&stid=300&rti=2&sgs=&u=3242342342344&mvtId=-1&mvtTs=1538515565661&uguid=85ecdd0a-48f4-49b4-f682-f158fdeba836&channelId=WEB&s=3243268987675&pg=1802&amrId=31228&p=7754462&ind=3&ct=http%3A%2F%2Flabs.richrelevance.com%2Fstorre%2Fcatalog%2Fproduct%2Fview%2Fsku%2F7754462",
                  "imageURL": "http:\/\/labs.richrelevance.com\/storre\/media\/catalog\/product\/m\/e\/memorex-05621-dvdr-100pk-16x-spindle-accbc15a9abbd078257a34533fa69634.jpg",
                  "price": "0.01",
                  "recommendation_group": "mice and keyboards",
                  "item_index": "3"
                },
                {
                  "id": "13029056",
                  "name": "Dell 90-Watt Inspiron AC Power Adapter",
                  "linkURL": "https:\/\/recs.richrelevance.com\/rrserver\/click?a=showcaseparent&vg=f4f171c5-056f-40f6-d16b-63598da9a03b&pti=1&pa=Dynamic_Bundle_Ex&hpi=12503&stn=AdvancedMerchandisingStrategy&stid=300&rti=2&sgs=&u=3242342342344&mvtId=-1&mvtTs=1538515565661&uguid=85ecdd0a-48f4-49b4-f682-f158fdeba836&channelId=WEB&s=3243268987675&pg=1802&amrId=31228&p=13029056&ind=4&ct=http%3A%2F%2Flabs.richrelevance.com%2Fstorre%2Fcatalog%2Fproduct%2Fview%2Fsku%2F13029056",
                  "imageURL": "http:\/\/labs.richrelevance.com\/storre\/media\/catalog\/product\/d\/e\/dell-90-watt-inspiron-ac-power-adapter-fa131a4f334138ec5f137cc68aa8ddeb.jpg",
                  "price": "0.01",
                  "recommendation_group": "mice and keyboards",
                  "item_index": "4"
                }
              ]
            }
          }
        ]
      }
    }
  ]
}

Layout JSON

Para disponibilizar JSON no formato acima que suporta o trabalho com bundles, foi desenvolvido um layout especial. Segue-se uma captura de ecrã do layout:

Layout para copiar e colar: http://rrcs.cachefly.net/clients/dynamic_bundle_ex/dynamic_bundle_layout.js.

Código Client-Side

A apresentação do JSON do bundle no browser através de JavaScript client-side é simples quando se conhece a estrutura final do JSON do bundle. Clique aqui para um exemplo funcional. Ao visualizar o código-fonte, é possível ver a configuração do p13n e o código de rendering, que utiliza a biblioteca JQuery.

Note: Um exemplo ativo de bundles editáveis está atualmente disponível no site Showcase-Parent em PROD:

Regra AM

Showcase-Parent -> Rules -> Merchandising Avançado -> Dynamic Bundle Ex https://portal.richrelevance.com/advmerch/rules.jsp#/31228

Placement

Showcase-Parent -> Placements -> Item_page.Dynamic_Bundle_Ex

Layout

Showcase-Parent -> Placements -> Layouts -> Dynamic_Bundle_JSON_Ex

https://portal.richrelevance.com/rrportal/layoutEditor2.jsp?id=45593

Vídeo de demonstração

https://richrelevance.egnyte.com/dl/U5yHqaxh2O/ENG-13029-demo.mov_

Reordenar Recomendações

Após criar as cláusulas de recomendação, pode reordenar as recomendações apresentadas clicando em Screen Shot 2015-05-05 at 5.55.28 PM.pngCollapse Recommendation e utilizando o ícone Screen Shot 2015-05-05 at 5.55.48 PM.png para arrastar e largar e alterar a ordem. Para confirmar que as recomendações foram reordenadas, pode clicar em Screen Shot 2015-05-05 at 5.55.37 PM.pngExpand Recommendations.

O que acontece a seguir?

A sua regra entra em vigor 2 a 4 horas após ser guardada. Todas as regras de Merchandising Avançado têm prioridade sobre outras regras de merchandising.