Blogue de personalização de comércio eletrónico

Publicados: 2022-04-19

Um ótimo design de página de produto cria ótimas experiências para o cliente. No entanto, existem dois desafios significativos que as páginas de produtos enfrentam.


Primeiro, existem muitos tipos de compradores que se envolvem com páginas de produtos - desde aqueles que estão explorando até aqueles que estão prontos para comprar agora. E segundo, os produtos são diversos. Cada um tem seu próprio conjunto de atributos, tornando improvável que qualquer design de página de produto se encaixe perfeitamente em cada produto.


Esta postagem explora as práticas recomendadas de design de produto para criar experiências incríveis para o cliente. Analisamos como usar o design para fornecer opcionalidade aos clientes em três áreas importantes: imagens da página do produto, a "área de compra" e vendas cruzadas.

navegação rápida
Práticas recomendadas de design de página de produto: segmente acima da dobra
Práticas recomendadas de design de imagem de página de produto de comércio eletrônico
Design de imagem do produto 1: zoom com ponteiro
Design de imagem do produto 4: altere as imagens dinamicamente com base na cor selecionada
Design de imagem de produto 3: incorporando imagens de mídia social
Design de imagem do produto 4: fornecimento de imagens em escala
Design de imagem do produto 5: Tornando óbvias as imagens adicionais na galeria de imagens
Área de compra de práticas recomendadas da página do produto: como lidar com vários grupos de clientes da maneira certa
Melhor prática de design de área de compra 1: fornecer frete grátis
Compre a melhor prática de design de área 2: links rápidos para saber mais
Melhor prática de design de área de compra 3: botões de chamada para ação para salvar o item
Melhor prática de design de área de compra 4: parte de um olhar
Melhor prática de design da área de compra 5: fácil seleção de atributos
Práticas recomendadas de vendas cruzadas da página do produto: como aumentar os lucros
Prática recomendada de design de venda cruzada 1: criar looks
Prática recomendada de design de venda cruzada 2: alterar dinamicamente as imagens do produto na aparência
Prática recomendada de design de venda cruzada 3: recomendações personalizadas de produtos
Prática recomendada de design de venda cruzada 4: navegação fácil para itens visualizados recentemente
Próximos passos

Práticas recomendadas de design de página de produto: segmente acima da dobra

O design da página do produto é desafiador por alguns motivos. Primeiro, a página é de alto risco. Todo cliente passa pela página do seu produto. Em segundo lugar, nem todo mundo que vê a página do seu produto está no mesmo estágio da jornada do comprador.

Alguns visitam as páginas do produto procurando o ajuste certo. Outros estão pesquisando. E outros ainda vêm com a intenção total de comprar o produto exato que estão procurando.


Em terceiro lugar, as lojas de comércio eletrônico normalmente carregam muitos tipos de produtos. No entanto, apesar de carregar produtos com atributos variados, muitas lojas de comércio eletrônico usam um único modelo de página de produto.


Em outras palavras, as lojas de comércio eletrônico tentam otimizar muitos tipos de produtos e clientes com um único design.


Essas diferentes necessidades colocam demandas insanas em uma página de produto, e a maioria falha em fazê-lo bem. Para ajudar, detalhamos como a Target trata sua página de produto.

Práticas recomendadas de design de imagem de página de produto de comércio eletrônico

As imagens continuam sendo um dos elementos mais importantes no design de uma página de produto. Algumas práticas recomendadas para imagens de páginas de produtos são

  • Ativar zoom - Permita que os clientes vejam facilmente detalhes de seus produtos
  • Imagens de tamanho relativo - Dê uma sensação de tamanho relativo colocando o item em um objeto comum ou usado por um modelo.
  • Diversidade de imagens - Inclua fotos de diferentes ângulos para dar uma visão completa do produto.
  • Incorpore a prova social - Como as imagens geralmente são o primeiro elemento da página a ser visto, você deve tentar incorporar a prova social em algumas de suas imagens.
  • Carrosséis transparentes - É fácil ignorar os carrosséis. Ótimos designs de página de produto tornam óbvio que há mais imagens para explorar.
  • Detalhe as variações do produto - suporte a compreensão do cliente de diferentes versões do produto, como cores, tamanhos ou complementos.

Abaixo, mostramos como a Target otimiza as imagens da página do produto.

Prática recomendada de design de imagem do produto 1: zoom com ponteiro

Os detalhes importam. Para ajudar os clientes a ver e entender seus produtos, o Target permite um recurso de zoom intuitivo e fácil de usar em todas as imagens de seus produtos.

Basta passar o mouse sobre a imagem e ela será redimensionada, permitindo que você inspecione qualquer parte da imagem que desejar.

Design de imagem do produto 2: altere imagens dinamicamente com base na cor selecionada

Muitos produtos têm variações.

Você deve alterar as imagens em destaque para corresponder aos atributos do produto selecionado.


Neste caso, o produto é um vestido de t-shirt de manga curta. O vestido está disponível em 9 cores diferentes.

O Target faz um excelente trabalho alterando dinamicamente as imagens em destaque para corresponder à cor selecionada.


Os clientes agora podem inspecionar a cor exata em que estão interessados.

Design de imagem de produto 3: incorporando imagens de mídia social

Adoro como a Target incorpora conteúdo gerado pelo usuário em seus designs de página de produto.

Nesse caso, após as três fotos de modelo, eles começam a exibir imagens de clientes regulares com o vestido.


Como a Target seleciona essas postagens? Uma maneira é através do seu canal no Instagram. Eles criaram uma hashtag #targetstyle para oferecer aos clientes uma maneira fácil de interagir com a marca.

Eles podem pesquisar rapidamente imagens carregadas que atendam aos seus critérios para uma imagem da página do produto. Em seguida, eles enviam um simples comentário ao perfil pedindo permissão para usar a imagem em seu site.

Novamente, eles fazem uso de uma hashtag para torná-lo simples para sua equipe. Abaixo está um exemplo de troca.

E a equipe não para em apenas um post gerado pelo usuário.


Várias imagens geradas por usuários fazem com que os clientes se sintam confiantes em comprar o item.

Design de imagem do produto 4: fornecimento de imagens em escala

As imagens de destaque da Target incorporam um modelo para permitir que os visitantes vejam como o vestido se encaixa. Coisas como o quão apertado é, quão curto o vestido é em comprimento e manga e decote são difíceis de descrever em palavras.


Melhor ainda, os visitantes podem ver como o vestido se encaixa em não-modelos através das imagens geradas pelo usuário.

Design de imagem do produto 5: Tornando óbvias as imagens adicionais na galeria de imagens

O destino não sobrecarrega o carrossel de imagens. Em vez disso, eles tornam óbvio que mais imagens estão presentes colocando uma sobreposição escura e mensagens informando aos visitantes do site quantas imagens estão disponíveis.


Esta é a única sobreposição escura em toda a página do produto.

Área de compra de práticas recomendadas da página do produto: como lidar com vários grupos de clientes da maneira certa

A "área de compra" descreve os widgets onde os clientes podem realmente comprar o item.

Tradicionalmente, em desktops, isso fica acima da dobra do lado direito. As práticas recomendadas para áreas de compra da página do produto incluem

  • Forneça avaliações de clientes - As avaliações são uma forma poderosa de prova social. As revisões devem ser resumidas de maneira fácil de entender. Os clientes devem poder inspecionar as avaliações em detalhes.
  • Crie links curtos para saber mais - Ofereça aos clientes uma maneira fácil de saber mais, seja por meio de avaliações ou perguntas frequentes específicas.
  • Selecione facilmente os atributos do produto - Facilite a seleção do tipo de produto que deseja comprar.
  • Forneça informações de envio - Os custos de envio são o principal motivo para o abandono do carrinho de compras . Exibir os custos de envio antecipadamente e, melhor ainda, fornecer maneiras claras de obter frete grátis, remove esse motivo de abandono de carrinho.
  • Ofereça mais de um método de envio - opções de velocidade, como entrega no dia seguinte e localização (como estratégias de clique e coleta ).

A Target faz um excelente trabalho abordando vários tipos de compradores de uma só vez.

Melhor prática de design de área de compra 1: fornecer frete grátis

Custos de envio inesperados são a principal razão para o abandono do carrinho .


A Target incorpora o benefício de frete grátis em sua estratégia de preço de valor. Eles sabem que os clientes valorizam o frete grátis, então eles o usam como um incentivo para fazer com que os clientes aumentem o valor médio do pedido de comércio eletrônico .

Compre a melhor prática de design de área 2: links rápidos para saber mais

Nem todos os visitantes da página do produto estão prontos para comprar.


O Target faz um ótimo trabalho fornecendo links rápidos para pular para outras partes da página. No topo eles dão duas opções.


A primeira é ver os comentários em detalhes.


O segundo salta para uma seção de perguntas e respostas. Uma tática interessante que eles usam é organizar as perguntas do FAQ por popularidade. Aqueles que são solicitados com mais frequência são puxados para o topo.

Gosto particularmente que o Target permita que os clientes respondam e forneçam feedback sobre os itens. Eles inserem dinamicamente um rótulo "Target Team Member" quando eles próprios fornecem esclarecimentos ao FAQ.

Melhor prática de design de área de compra 3: botões de chamada para ação para salvar o item

Ainda outros clientes estão querendo comprar mais tarde. Vimos o comportamento de compra on-line incorporar cada vez mais pesquisas - principalmente na pesquisa emergente on-line, comportamento de compra off-line .


Aqui, a Target oferece aos clientes uma maneira fácil de salvar o produto em uma lista pessoal ou registrá-lo como presente.

Melhor prática de design de área de compra 4: parte de um olhar

Os curadores-alvo procuram seus produtos.


A aparência é parte educação e parte upsells. Eles educam os clientes sobre como juntar vários itens para criar uma roupa inteira. No processo, eles criam vendas cruzadas implícitas.


Exploramos os looks com mais detalhes aqui .

Melhor prática de design da área de compra 5: fácil seleção de atributos

Por fim, o Target faz um trabalho incrível, expondo as várias opções de maneira intuitiva e fácil.

A chave é expor os atributos do produto visualmente em vez de escondê-los nos menus suspensos. Os visitantes podem ver facilmente várias opções de cores e ter rapidez e selecionar sua cor e tamanho preferidos é tão simples.

Práticas recomendadas de vendas cruzadas da página do produto: como aumentar os lucros

Por fim, quero explorar as práticas recomendadas de venda cruzada da página do produto.


A tecnologia de personalização abriu várias maneiras de fazer recomendações poderosas e relevantes. Aqui está uma pequena lista de práticas recomendadas de design de página de produto que você pode implementar para aumentar os lucros.

  • Use recomendações personalizadas de produtos   - A técnica de venda cruzada mais eficaz continua sendo as recomendações personalizadas de produtos.
  • Criar e alavancar segmentos de clientes baseados em comportamento - Recomendações e ofertas devem ser baseadas no comportamento do cliente, como compras anteriores e produtos na sessão visualizados.
  • Vários tipos de widgets de recomendação de produtos - Não se limite a um único   tipos de widget de recomendação . Use vários widgets.

Prática recomendada de design de venda cruzada 1: criar looks

Como mencionado, a aparência faz mais do que educar os clientes. Eles fornecem uma maneira natural de oferecer produtos complementares. Aqui, a Target oferece uma variedade de looks para o produto.


Quando você clica em uma das aparências, um widget de item simples aparece. Você pode navegar facilmente para qualquer um dos produtos complementares, salvá-los ou ver mais detalhes.

Prática recomendada de design de venda cruzada 2: alterar dinamicamente as imagens do produto na aparência

Quando você oferece vários atributos de produto, é importante que você personalize as vendas cruzadas que você faz.


Personalizar dinamicamente a aparência é um uso fantástico de conteúdo dinâmico.


Aqui, o Target atualiza dinamicamente o widget de aparência para corresponder aos atributos do produto selecionado. Tanto as próprias imagens quanto os acessórios correspondentes são alterados em tempo real.

Prática recomendada de design de venda cruzada 3: recomendações personalizadas de produtos

O widget de recomendação de produtos do Target é flexível. Ele oferece uma barra de navegação simples para permitir que os clientes filtrem os produtos recomendados. Neste caso, o produto que estamos vendo se encaixa tanto em um decote redondo quanto em um mini comprimento.


O Target nos dá a opção de filtrar com base em qualquer um.

Mudar para o tipo de comprimento mini atualiza dinamicamente os produtos sugeridos.

Da mesma forma, selecionar "mostrar mais" expandirá o número de itens sugeridos. Essa funcionalidade é perfeita para compradores que desejam adicionar ao carrinho ou navegar. Em vez de ter que navegar de volta para a categoria de onde vieram, eles podem ver quais itens desejam na página.

Prática recomendada de design de venda cruzada 4: navegação fácil para itens visualizados recentemente

Por fim, o Target facilita para os compradores encontrarem produtos anteriores. Seu segundo widget de recomendação de produto é o de itens visualizados recentemente.


À medida que os compradores percorrem o catálogo de produtos, este é um histórico em execução na sessão dos produtos pelos quais eles manifestaram interesse.

Próximos passos

O design da página do produto é crucial para converter visitantes em clientes.


Para atender aos requisitos de vários tipos de clientes e apresentar adequadamente as ofertas certas, você deve considerar a parceria com um fornecedor de personalização .

A Barilliance alimenta centenas de páginas de produtos de lojas de comércio eletrônico com conteúdo personalizado.   Clique aqui para ver se o Barilliance é uma boa opção para sua loja.