O que você precisa saber para uma reformulação do site de comércio eletrônico no 2019

Este é o ano em que você vai reformular seu site de comércio eletrônico? Se já faz alguns anos, você precisa saber que muita coisa mudou.

É quase desnecessário dizer que um site de comércio eletrônico moderno precisa ser projetado para dispositivos móveis primeiro, já que a maioria com quem trabalho agora obtém 70% ou mais de seu tráfego de dispositivos móveis. No entanto, isso é apenas um ponto de partida - há muitas sutilezas a serem consideradas se você quiser converter o usuário em clientes.

Eu consultei o usabilidade para uma ampla variedade de sites de comércio eletrônico nos últimos cinco anos e desenvolvi os princípios que os melhores seguem. Vou orientá-lo através de oito maneiras de garantir que o seu site esteja preparado para o usuário de hoje, inspirado pelas diretrizes do meu livro Criando sites de comércio eletrônico.

Evite vídeos longos na página inicial

A página inicial é um lugar para impressionar. Muitos sites colocam dinheiro em fotografias de alta qualidade, mas você pode considerar usar o vídeo aqui para exibir produtos ou contar a história da marca. Afinal, o vídeo está em toda parte agora, especialmente nas mídias sociais.

Quando usado corretamente, o vídeo pode ser ótimo para informar os usuários, além de estimulá-los. No entanto, não importa o quanto seu vídeo seja chamativo, se o usuário precisar clicar em reproduzir, esteja preparado para a maioria das pessoas a ignorar. Nos muitos testes de usuário que eu assisti, esse é o comportamento mais comum com vídeos da página de destino.

Por quê? Nesta fase da jornada do usuário, seus períodos de atenção são curtos. É mais provável que os usuários deixem o site e retornem, não dediquem tempo para assistir a algo desconhecido.

No começo, você deve ajudar os usuários a se movimentarem rapidamente, por isso, fique com vídeos em loop curtos, silenciosos, automáticos. Dessa forma, você obtém as informações sem precisar se envolver profundamente. Vídeos mais longos podem se tornar muito úteis mais tarde na jornada para explicar coisas como recursos do produto, quando o usuário está mais interessado.

O site Prynt usa um pequeno vídeo de reprodução automática para mostrar o produto em ação. Há também uma opção para assistir a coisa completa com som.

Não preencha sua página inicial com conteúdo em excesso

Se você fez o trabalho duro de marketing para levar os usuários à sua página inicial e criou um argumento convincente para a sua loja, o que vem depois? Há muito o que você poderia dizer sobre sua empresa, então agora é a chance?

Seja cuidadoso. Quanto mais tempo você fizer a sua página de destino, mais você se arrisca a desligar ou ficar confuso. Embora os usuários tenham uma rolagem confortável, logo pararão se o conteúdo não estiver diretamente relacionado à tarefa.

Sempre que você projetar, atenha-se à regra de 'uma página, um propósito'. O objetivo desta página é apresentar o que você vende e fazer com que o usuário procure por esses produtos.

Eles realmente precisam ver seus cinco posts mais recentes, seus últimos tweets e uma parede de imagens do Instagram? As postagens sociais são particularmente inúteis, pois você acaba de colocar os usuários no seu site e clicar nesses itens os removerá novamente.

Quanto mais coisas você colocar na página, mais distrações que você está dando ao usuário da sua ação principal e a chave que você quer que eles façam. Os usuários de dispositivos móveis tendem a ter sessões mais curtas e se concentram em realizar tarefas - o conteúdo extra não ajuda com isso.

Torne seus filtros facilmente acessíveis

Quando você tem muitos produtos, os filtros são essenciais para ajudar os usuários a encontrar o que precisam. A grande maioria dos sites de comércio eletrônico 90% daqueles que eu estudei) têm seus filtros em uma sobreposição no celular. Isso faz sentido quando não há muito espaço disponível, mas significa que os usuários não estão propensos a realmente vê-los.

Como uma regra 95% dos usuários não alteram os padrões e isso se aplica a abrir um menu de filtros para selecionar opções específicas. É algo que foi confirmado nos testes de usuário de comércio eletrônico que eu também assisti. Encontrar produtos em páginas de listagem é uma área em que a experiência de navegação no comércio eletrônico é superior em computadores.

Se seus usuários filtrarem, eles provavelmente encontrarão um produto que realmente desejam. Seu desafio no celular é encontrar maneiras de economizar espaço. Um método é mostrar a categoria de filtro mais relevante na página com botões para as opções (veja Macy's abaixo). Tocar em uma delas carregaria as listagens com esse filtro aplicado, quando o próximo filtro mais relevante seria exibido.

redesenho do comércio eletrônico - opções de filtro da macy's
O site da Macy's traz algumas opções de filtro para a página como botões. A Burberry torna as categorias de filtros visíveis na página.

No mínimo, verifique se o botão para acessar o menu completo do filtro é óbvio. Ele também deve indicar claramente quando um filtro é aplicado, para que os usuários saibam quando estão vendo um conjunto limitado de resultados.

Redesenhe suas listagens para imagens maiores

A maioria das páginas de listagens de comércio eletrônico tenta exibir vários produtos na tela de uma só vez. Como resultado, o produto as imagens tendem a ser bem pequenas (é por isso que eles são tradicionalmente conhecidos como imagens em miniatura).

No entanto, a imagem é uma parte essencial de ajudar o usuário a decidir qual produto selecionar. Em muitos casos, ele diz muito mais do que qualquer texto pode. Produtos como roupas e móveis dependem do usuário fazer uma distinção subjetiva entre as diferentes coisas oferecidas.

Você pode até ter grandes imagens no celular. Apps como o Instagram levaram os usuários a esperar alta qualidade onde quer que estejam e muitas vezes eu vi os usuários gostarem disso. Não importa onde eles estejam no site, a boa fotografia é sempre amada.

O Airbnb tem imagens grandes que podem ser roladas (esquerda). Zara (à direita) tem imagens em largura de tela cheia em suas listagens.

Claro, se você acha que algo pode ser melhor vendido em algumas imagens, faça-o. Os sites de viagens geralmente têm várias fotos em miniaturas de listagens com uma seta sutil para percorrê-las. Muitos sites de roupas oferecem a opção de mostrar o produto por conta própria e ser usado por um modelo.

Exibir opções de produtos como botões

Você estará ciente de que muitos produtos estão disponíveis em variações como cor, tamanho, material ou outra coisa. A página de detalhes do produto é onde os usuários fazem essa escolha. Para facilitar a escolha, você deve evitar despejar essas opções nos menus suspensos.

Eles deveriam ser botões visuais para ajudar o usuário a ver todas as opções e elas devem deixar claro quando uma variação significa uma mudança no preço. Se a variante alterar a aparência do produto (como a cor), a seleção deve atualizar a imagem principal do produto. Isso deixa o usuário sem dúvida quanto ao que será pedido.

Redesenho do comércio eletrônico - opções de tamanho da nike
John Lewis (à esquerda) tem cores de produto como botões com indicadores visuais. A Nike (à direita) expõe todas as opções de tamanho e desabilita os tamanhos que não estão disponíveis.

Outro benefício é que, desabilitando certos botões, o usuário pode ver rapidamente quais variantes estão em falta. Novamente, isso economiza a rolagem por meio de uma lista suspensa de opções.

Quando se trata de seleção de tamanho, é melhor não ter um tamanho padrão. Se houver usuários podem acabar adicionando o padrão ao invés de um que eles querem. Isso pode levar você a obter muitos retornos e clientes frustrados.

Deixe de fora os botões de compartilhamento

Facebook, Twitter, Pinterest, Instagram, LinkedIn, Snapchat. Seus usuários provavelmente ficam em um ou mais desses redes sociais. Então, você deve dar a eles botões de compartilhamento nas páginas de detalhes do produto?

Muitos sites de comércio eletrônico ainda apresentam esses pequenos ícones na esperança de incentivar as pessoas a promover seus produtos pela web. Infelizmente, eles são quase certamente uma perda de tempo.

Ninguém clica neles. Na verdade 0.2% de pessoas, de acordo com um estudo. Também pode parecer um trecho de código, mas ele vem com muitas coisas extras que diminuem a velocidade de sua página.

A ascensão dos “influenciadores” pagos significa que o usuário moderno não quer mais ir às marcas sem algo para eles. Mais pessoas estarão dispostas a compartilhar em particular com um amigo ou membro da família. Links que permitem o compartilhamento por e-mail ou um serviço de mensagens instantâneas, como o WhatsApp, provavelmente funcionarão melhor.

Integrar carteiras de pagamento

Serviços de carteira de pagamento, como PayPal, Apple Pay e Android Pay estão em ascensão. É cada vez mais comum vê-los como opções nos fluxos de checkout de comércio eletrônico. Na verdade, eles podem matar o checkout padrão e possivelmente o uso de cartões de crédito e dinheiro completamente.

redesenho do comércio eletrônico - integração de pagamento da Amazon
Tamara Mellon (à esquerda) tem a opção do Apple Pay, PayPal e Amazon Pay em sua cesta e checkout. A Gucci oferece a possibilidade de pular para o PayPal a partir da notificação "adicionar ao pacote".

Inserir uma senha, impressão digital ou digitalização facial e, em seguida, concluir imediatamente a compra é muito mais conveniente do que preencher formulários. Com o comércio eletrônico dominado por dispositivos móveis, é essencial oferecer um pagamento fácil que não envolva o preenchimento de formulários.

A simples facilidade de uso deve incentivar mais usuários a concluir o check-out com você. Há também um benefício de segurança, pois os usuários provavelmente se sentirão mais seguros com uma carteira como intermediários, caso não tenham ouvido falar de sua marca antes.

Nos testes de usuário que executei nos fluxos de checkout, ouço regularmente comentários como “Prefiro muito mais a opção de usar o PayPal” e “estou muito preocupado com a segurança e só pago usando o PayPal”. Atualmente, o PayPal é bem conhecido, mas ao decidir quais usar vai com os países e dispositivos mais populares do seu site.

Permitir que os usuários colecionem

Um número crescente de sites de comércio eletrônico oferece aos usuários a capacidade de coletar seu pedido em vez de entregá-lo. É bom para os usuários que não estão em casa com muita frequência e também não podem receber a entrega no local de trabalho. Dar esta opção só aumentará o número de usuários que podem comprar de você.

A abordagem mais fácil (e geralmente a melhor) é adicionar a coleção como uma alternativa à entrega no caixa. Peça ao usuário para inserir sua localização e mostre a eles opções de onde eles podem pegar seu pedido. Também é importante que você mostre o horário de abertura do local de coleta - esses dados geralmente vêm da integração com uma empresa de entrega.

Uma janela de clique e coleta na caixa de verificação do ASOS, permitindo que o usuário escolha para qual loja de conveniência enviar sua entrega.

A abordagem mais complexa é integrar a opção de coletar em cada página de detalhes do produto no site. Isso faz sentido se você tiver lojas de tijolos e argamassa como permite a verificação de estoque em lojas específicas.

No entanto, podem surgir problemas quando os usuários têm vários produtos em seu pedido. Se não tiverem cuidado, podem acabar com alguns produtos para entrega e alguns para coleta (um cesto 'misto'). Para evitar isso, o mais cedo que eu recomendo deixar o usuário especificar coleta ou entrega está no estágio da cesta de forma que se aplique a todo o pedido.

Mais conselhos sobre comércio eletrônico

Foram oito maneiras de garantir que seu site de comércio eletrônico seja reprojetado para se adequar ao 2019 e além. É claro que há mais do que isso para considerar quando redesenhar um site de comércio eletrônico completo. Na verdade, escrevi um livro contendo as diretrizes da 66 para projetar lojas on-line que convertem, com base nos anos 10 de experiência em design UX.

O livro chama-se Designing Ecommerce Websites, é disponível na Amazon em uma variedade de formatos, incluindo brochura e Kindle. Ou você pode se apossar do versão digital em PDF no meu site, que inclui todas as ilustrações do livro impresso. Você também pode obter 15% de desconto a versão digital por tempo limitado com o código promocional PLATFORMS.