O layout do e-commerce

O layout do e-commerce

6056
0

Quando você pára para pensar, lojas físicas e lojas virtuais não são tão diferentes assim. Afinal de contas quando você resume em uma frase as duas podem ser definidas da mesma forma: um local que reúne produtos que estão sendo vendidos. Claro que com algumas diferenças de localização mas o básico é o mesmo.

Simplo 7- Plataforma de e-commerceAnalisando algumas técnicas de marketing utilizadas em lojas físicas nem todas podem ser aplicadas nas lojas virtuais, então é necessário estudar outras técnicas que gerem o mesmo resultado.

Nas lojas físicas a iluminação é planejada para dar mais destaques aos produtos, algumas empresas de grande porte contam até com projeto de arquitetura para isso. Já nas lojas virtuais, você não pode mudar a iluminação de lugar, então você precisa de outras técnicas para expor seus produtos. Ou seja, o layout do e-commerce deve dar destaque para os produtos, para que eles sejam facilmente vistos, e não gere uma confusão visual para quem chega no seu site.

O ideal é que os produtos apareçam assim que a pessoa entra na loja virtual, claro que ali também tem outras informações, logo, banners, formas de contato (telefone e e-mail), categorias. Mas nada disso pode ocupar um espaço grande demais impossibilitando a visualização de produtos. Se o cliente chegar no e-commerce e não ver nenhum produto, dificilmente ele vai rolar a tela na esperança de ver alguma coisa, na maioria das vezes pessoas que chegam em uma loja virtual e não identificam produtos logo de cara, vão embora.

BAIXE NOSSO MATERIAL:

>Como montar uma loja virtual
>Como fotografar e editar fotos em sua loja virtual
>Como atrair visitantes gratuitamente para sua loja virtual
>Como vender pelo Facebook e Instagram

Loja online design

Você permaneceria dentro de uma loja física na qual entrou e não viu nenhum produto? Pois é, por isso os produtos devem estar visíveis, logo que o cliente chega, quem entra no seu site precisa perceber que se trata de uma loja. Simples assim não é mesmo? Não tanto quanto parece, já visitamos várias lojas virtuais onde foi preciso rolar a tela e investigar, cadê os produtos?

layout-ecommerce
Além dos produtos os dados de contato também estão escondidos

Veja o exemplo acima, um layout limpo, agradável aos olhos, aparentemente tem todas as informações necessárias, mas cadê os produtos? Porque eles não aparecem? Aliás, onde estão os contatos da empresa? A divisão de categorias está ok, o campo de busca e o carrinho, muito bom, bem destados.

BAIXE NOSSO MATERIAL:

>Assista o Webinar para montar loja virtual
>Veja 8  dicas para montar uma loja virtual
>Baixe E-book Gestão de e-commerce para PME
>Assista a Palestra: E-commerce Do Zero Aos Resultados Em 6 Etapas

As redes sociais bem visíveis. Mas quem entra para comprar e não vê o que quer faz o que? Isso mesmo, vai embora. Quem sabe aquele espaço em branco do lado do logo podesse ser melhor aproveitado para que os produtos ficassem visíveis já para quem entra no site? Só uma ideia.

layout-ecommerce
Que foto linda, digo, vim aqui para comprar, mas…

No segundo exemplo o que nós vemos? O mesmo erro. Viu como antes quando a gente explicou parecia simples, deixar os produtos a vista, mas na prática não é bem assim. Lojas virtuais não podem ser confundidas com site sobre algum assunto, mesmo que você tenha um blog da sua loja, ali é o e-commerce, ali você precisa mostrar produtos. Simplíssimo.

BAIXE NOSSO MATERIAL:

>Baixe planilha de análise de concorrência
>Baixe e-book com 6 maiores erros de quem faz anúncios
>Baixe e-book de como capturar e-mail

Então surge a pergunta, qual é a dificuldade do lojistas em fazer isso? Se você for lojista, e estiver lendo este texto, por favor, relate sua explicação nos comentários. Nós queremos saber.

layout-ecommerce
De novo, cadê?

Este terceiro exemplo foi só para comprovar que não é implicância, realmente algumas lojas virtuais não querem mostrar os seus produtos na vitrine, que é exatamente onde eles deveriam estar. Por que? Por que as lojas virtuais fazem isso? Nós já falamos aqui no blog, de tudo que você precisa para turbinar a sua vitrine. Mas hoje nós queremos falar do layout de forma geral. E falamos tudo, sem dó. Se tem uma coisa que podemos elogiar nos 3 exemplos anteriores é que em nenhum deles o fundo da loja chama atenção, são todos brancos.

BAIXE NOSSO MATERIAL:

>Como recuperar 30% pedidos pagos por boleto
>Saiba por que usar e-mail marketing na sua loja
>Faça parte da Lista Vip DLoja Virtual

Nem sempre o fundo da loja virtual precisa ser branco, o ideal é que o fundo não chame mais a atenção do que os produtos, algumas lojas virtuais usam texturas, e elas são uma ótima opção para quem quer fugir do branco. Lembrando que essa textura não pode chamar sua atenção, evite imagens que as pessoas vão tentar ficar decifrando o que é, pois isso tira o foco dos produtos.

layout-ecommerce
Você pode fugir do branco 😀

Aqui temos um exemplo com um fundo textura de madeira, observe que onde ficam os produtos, o fundo é branco, para não prejudicar a visualização dos mesmos. Agora se essa textura se estendesse até a parte dos produtos, seria uma confusão visual sem fim. Sua loja pode ter sim um fundo que fuja do branco, pode ser uma cor sólida, e leve. Não vá fazer um fundo vermelho nos produtos.

layout-ecommerce
Texturas suaves são bem-vindas

Essa loja resolveu usar um fundo cinza clarinho com textura, e fundo branco apenas no preço e na foto do produto. Ficou agradavél aos olhos, não atrapalhou a visualização dos produtos. Embora usado por 99,8% das lojas virtuais, você pode vencer o fundo branco. Lembrando, é possível, desde que, você não chame mais atenção com o fundo do que com o produto.

BAIXE NOSSO MATERIAL:

>Veja 3 Ferramentas para monitorar seu mercado
>Aprenda como usar o CANVA
>Aprenda como usar o Google Analytics em sua loja virtual

Agora vamos falar de uma outra parte importante do seu layout do e-commerce, a harmonia das cores. Ela é extremamente importante para não incomodar os olhos de quem está no seu site, já teve casos em que precisei fechar páginas, porque me incomodava, nem sempre o cliente sabe dizer o que realmente incomoda, mas a gente te conta, é o carnaval de cores que você faz.

layout-ecommerce
Quantas cores diferentes tem aqui?

Esta imagem te incomoda? Fundo lilás, tarjas vermelhas, tarjas verde escuro, carrinho de compras roxo. Não está harmonico. Se o fundo é lilás as tarjas podem ser outros tons da mesma cor, e o carrinho de compras pode ser de uma cor complementar para ser mais chamativo. Assim não incomda quem visita a loja e você tem mais chances de fazer uma venda. De novo, é simples. Use cores que combinem, use a mesma cor, mudando os tons, e use cores complementares. A adobe disponibiliza um site, onde você pode consultar as cores complementares.

BAIXE NOSSO MATERIAL:

>Como atrair cliente com e-mail marketing
>7 dicas para começar a usar o Youtube
>Saiba se seu site está otimizado

Ainda falando sobre harmonia do layout, se você vende roubas para bebês, abuse da delicadeza, não saia colocando temas com bebidas, cigarros, ou outra coisa que não tenha nada a ver com crianças. Se você tem uma loja virtual de biquinis, não faça uma decoração de inverno, as coisas precisam combinar e fazer sentido. São esses elementos visuais que vão ajudar seu cérebro a entender que é uma loja de bebês, olha que coisa mais meiga e fofa nosso próximo exemplo.

layout-ecommerce
Sinta a delicadeza de cada botãozinho

Viu só? Tudo em harmonia, combinando. Não só os elementos combinando entre si, como combinando com o nicho da loja. É assim que você conquista os clientes em cada mínimo detalhe. Agora imagine se essa loja, toda meiga e fofa vendesse peças para motocicletas? Não ia fazer o menor sentido não é mesmo? O layout do e-commerce precisa combinar com o seu nicho de mercado e não com a sua pessoa.

layout-ecommerce
Muita fofura envolvida

Layout diferenciado, aquela loja que você olha e pensa nossa que demais isso. Agora reflita, além de lindo o seu design precisa de mais alguma coisa? Sim, precisa ser funcional. Não é o que acontece em alguns casos, loja virtual linda não garante o leitinho das crianças no final do mês. As coisas precisam estar harmônicas, fazerem sentido e serem funcionais. Não pode ser só 1, não pode ser os 2, precisa ser os 3. Por isso é melhor um layout simples e funcional do que um layout rebuscado que não funciona tão bem assim.

layout-ecommerce
Vejo folhas em você

Olha que lindo essas folhas, elas acompanham você em toda a rolagem, só que, opa! Parece que em alguns momentos elas tapam um pouquinho a visualização dos produtos, acho que a funcionalidade das folhas se perdeu um pouco no meio do caminho. Mas vamos concordar que o tema das folhas super combinou com toda a ideia de fazendinha que foi proposta. Parabéns gente, mas vamos cuidar mais desse detalhe.

BAIXE NOSSO MATERIAL:

>Baixe a planilha de planejamento de ações de marketing
>Baixe e-book para datas comemorativas

Outra dica muito importante, quando o cliente entrar dentro do produto, o botão comprar precisa estar aparecendo, é a mesma lógica de que quando o cliente estiver na home do site, ele precisa ver produtos. Quando ele está dentro de produtos, o botão comprar precisa estar ali, na cara. Cliente que não acha onde comprar, vai embora. Tem gente que esconde o botão comprar? Tem 🙁

layout-ecommerce
Onde compra???

Outra dica sobre o botão comprar é: Destaque! Por motivo algum esse botão deve passar despercebido pelo cliente. Então além de estar visível sem precisar de rolagem, o botão comprar precisa estar claro, gritando na frente do cliente, para que não haja dúvidas. É aqui que eu clico pra finalizar minha compra. Se o cliente não achar onde finalizar a compra, ele não finaliza a compra. Simples.

layout-ecommerce
Comprar o produto ou indicar o produto? Eis a questão!

Quando eu digo que o botão comprar precisa estar destacado, não falo apenas da cor, mas sim do tamanho. É interessante deixar ele sempre maior que outros botões dessa página do produto, para ficar realmente destacado, não adianta um botão vermelho vivo, de um tamanho que ninguém vê.

Modelo loja virtual

Como você pode perceber todas as coisas que a gente falou aqui foram bem simples. Deixar os produtos aparecendo na vitrine, não usar um fundo que chame mais atenção que os produtos, tudo bem usar o clichê branco. Harmonia, não faça um carnaval de cores no seu e-commerce, avalie a funcionalidade de cada coisa linda que você vai colocar na sua loja. Sobre o botão comprar, deixe a vista, e deixe destacado.

Esperamos que essas dicas possam te ajudar a melhorar as suas vendas, todas as lojas aqui citadas como exemplo se inscreveram para participar da nossa série de vídeos Desmontando A Sua Loja Virtual, esperamos que ninguém fique ofendido, nosso objetivo é mostrar como é simples vender. As lojas citadas aqui que se inscreveram para o sorteio do desmontando, continuam participando. 😀

Você não estava sabendo de nenhum sorteio? Pois é, esse sorteio foi divulgado apenas para a nossa lista VIP. Se você quiser fazer parte dela, basta deixar seu e-mail conosco e ficar sempre ligado na sua caixa de e-mails aguardando as nossas novidades.