Skip to content

Template Volt: loja de gadgets com comparativo no Zugo

Template Volt: loja de gadgets com comparativo no Zugo

O Volt é a loja de eletrônicos da galeria de 25 modelos do Zugo. Ele traz um produto de destaque, uma oferta da semana com contagem regressiva, uma vitrine filtrável por categoria, um comparativo lado a lado e blocos de garantia, além de carrinho e telas de conta. Clonar não gasta crédito.

É o mais convencional dos modelos de loja da galeria, e isso é elogio. Nada na página é esperto por esporte: cada bloco corresponde a uma pergunta que o comprador faz antes de pagar.

O que vem dentro do template Volt?

A página segue a ordem de uma compra de eletrônico. Um produto ancora a atenção, uma oferta com prazo cria pressa, a vitrine mostra o resto do catálogo, o comparativo resolve a dúvida entre dois modelos parecidos, e só então aparecem as garantias.

Bloco O que ele contém
Barra de aviso Uma linha para o lançamento novo ou a promoção do momento
Produto de destaque Preço com valor riscado, nota, situação de estoque e ficha técnica curta
Oferta da semana Item com desconto, contagem regressiva ao vivo e percentual de economia
Vitrine Grade de produtos com filtro por categoria: áudio, energia e iluminação
Comparativo Dois carros-chefe lado a lado em seis linhas de especificação
Garantia Cobertura, devolução, reparabilidade e entrega em quatro blocos curtos
Carrinho e conta Gaveta de carrinho com sugestões, resumo do pedido e telas de entrada

Colocar as garantias depois dos produtos, e não antes, é a ordem certa. Garantia não cria desejo, ela remove a última objeção. Uma loja que começa se defendendo soa insegura antes de o visitante ter decidido que quer alguma coisa dali.

A gaveta do carrinho traz uma faixa de sugestões. Para acessório isso é venda honesta, porque quem compra fone costuma querer um carregador junto. Para uma compra única e cara vira ruído, e tirar essa faixa é uma edição só.

Por que o comparativo é o bloco mais valioso?

A maioria das lojas de eletrônico perde a venda no espaço entre dois produtos parecidos. O cliente gosta da marca, não consegue explicar a diferença entre o modelo topo e o mais barato, e sai para ler análise em outro lugar. O comparativo mantém essa decisão na sua página.

O que faz esse bloco funcionar é a moldura acima dele: dois campeões de venda, dois usos diferentes. Um comparativo que empurra o caro disfarçadamente soa como vendedor. Um que diz qual produto serve para qual pessoa soa como conselho, e acaba vendendo os dois.

As especificações escolhidas também ajudam. Autonomia, cancelamento de ruído, drivers, resistência à água, peso e pareamento são coisas que o comprador traduz para a vida dele. Número que só faz sentido para engenheiro pertence ao fim da página, não ao meio da decisão.

Se você vende qualquer coisa com variação de modelo, esse é o bloco para manter e reconstruir primeiro, mesmo que jogue fora metade do resto do template.

O que funciona de verdade e o que é fachada?

A vitrine responde. Filtro de categoria, adicionar ao carrinho, contador, gaveta com resumo, estado vazio, contagem regressiva e telas de conta se comportam como se espera. Dá para ver tudo isso na prévia da galeria antes de clonar o modelo para um projeto seu.

Atrás da interface ainda não existe nada. Sem estoque, sem pedidos, sem clientes. O carrinho também zera quando a página recarrega, porque o modelo vem sem armazenamento. Isso basta para julgar o desenho e não basta para receber dinheiro de ninguém.

Pagamento é o primeiro conector de que você precisa. O Stripe cuida de cartão e assinatura, e as telas de checkout aqui já estão prontas para sentar em cima dele. Banco e contas vêm do Supabase, e o e-mail de confirmação vem do Resend, como está descrito em o que muda ao conectar o Stripe.

O selo de estoque merece um aviso específico. Uma página que diz "em estoque" sem saber é pior que uma página calada, porque cliente que compra e não recebe não esquece. Ou você liga esse selo a um estoque real, ou tira a frase do card.

Para quem o Volt serve e quem deveria pular?

Serve para qualquer catálogo pequeno de produto físico com ficha técnica: áudio, ferramenta, iluminação, bicicleta e peças, equipamento de cozinha, acessório de câmera. Onde o comprador compara número antes de escolher, esse desenho trabalha a favor da venda.

Serve também para lançamento de um produto só. Mantenha o destaque e as garantias, apague a vitrine e transforme o comparativo no seu produto contra a alternativa que o cliente usa hoje. São quatro edições e uma página genuinamente diferente da original.

Serve mal quando o seu produto não tem número para comparar. Roupa, comida e artesanato vendem por foto e história, e tabela de especificação nessas páginas parece formulário de cadastro. Outro modelo de loja da galeria encaixa melhor nesse caso.

Serve mal também para marketplace com vários vendedores. Isso é plataforma com conta, repasse e moderação, um projeto diferente de uma vitrine. Os limites honestos de montar loja assim estão em o Zugo serve para e-commerce.

Vale manter a contagem regressiva da oferta?

Só se o prazo for real. Contador que reinicia a cada recarregamento é o truque mais velho da internet, o cliente reconhece na hora, e ele custa exatamente a credibilidade que os blocos de garantia foram construídos para ganhar.

Se a sua oferta acaba mesmo em uma data, o contador faz trabalho útil: transforma intenção vaga em decisão desta semana. Uma edição ajusta a data verdadeira, e deixar o contador expirar à vista do público é mais honesto que fingir que ele nunca acaba.

Se você não trabalha com oferta por tempo, troque o bloco em vez de apagar. Aquele espaço está no melhor pedaço da página e funciona bem como kit, como lista de mais vendidos ou como aviso de reposição de um item que costuma faltar.

Quais edições as pessoas mais pedem?

"Acrescentar uma terceira coluna no comparativo para o modelo de entrada." "Trocar o selo de estoque por sob encomenda." "Subir os blocos de garantia para logo abaixo do destaque, porque o meu cliente pergunta sobre conserto antes de perguntar sobre especificação."

Pedido de filtro é comum e quase sempre justificado: deixar filtrar por faixa de preço além de categoria, ou incluir um filtro de compatibilidade entre conectores antigos e USB-C. São mudanças pequenas que reduzem muito o tempo até o carrinho.

Pedido de celular deveria vir cedo, não no fim. "No celular, faça a tabela do comparativo rolar de lado com o nome da especificação fixo à esquerda." Tabela que quebra no telefone é o motivo mais frequente de essa página render menos do que deveria, e por aqui a maior parte do tráfego de loja chega pelo celular.

Como adaptar o Volt aos seus produtos?

Conteúdo primeiro, estilo depois. Cada edição custa 3 créditos, então essa ordem coloca no topo aquilo que é caro refazer mais tarde.

  1. Troque a marca e a barra de aviso. Nome, assinatura, rodapé e a linha fixa do topo.
  2. Suba o seu catálogo. Fotos, nomes, preços e o filtro renomeado para as suas categorias.
  3. Reconstrua o comparativo. Os dois produtos entre os quais o cliente hesita, com especificações que ele consegue julgar sozinho.
  4. Reescreva as garantias. A sua cobertura, o seu prazo de troca e a sua promessa de entrega, não as do exemplo.
  5. Acerte moeda, frete e imposto. Cálculo por CEP, prazo por região e tributo são decisões suas, e os números do modelo são fictícios.
  6. Conecte o pagamento e publique. O projeto fica em um endereço como sualoja.zugo.run, e o domínio próprio entra por cima.

Faça a fotografia antes das edições, não depois. Imagem de produto é a única parte de uma loja de hardware que o construtor não melhora por você, e uma página bem reconstruída em cima de foto genérica continua parecendo demonstração.

Quanto custa deixar o Volt pronto para vender?

Clonar não chama a IA, então a conta começa na primeira edição. Levar uma vitrine até um estado publicável costuma dar de seis a nove edições, mais o trabalho de conectar os serviços externos.

Ação Custo
Clonar o modelo em um projeto novo Sem custo, não chama a IA
Uma edição no chat 3 créditos
Construção a partir de uma descrição 6 créditos
Plataforma multipágina 12 créditos nas três primeiras páginas, depois 3 por página
Modo Hi-Fi O dobro: 6 por edição e 12 por construção

O plano gratuito dá 5 créditos, o Pro custa $25 por mês com 200 créditos e o Business custa $99 por mês. Duzentos créditos equivalem a cerca de 16 plataformas, 33 construções ou 66 edições no mês, então refazer uma vitrine é uma fatia pequena de um mês de Pro.

Se cada produto precisar do próprio endereço para busca e compartilhamento, isso é plataforma e não página. Uma construção simples leva cerca de um minuto e uma plataforma multipágina leva alguns. Antes de chegar até você, cada construção é aberta em uma sandbox, e a que não abre não é entregue. A conta completa está em quanto custa um site feito com IA.

Onde o Volt para?

Loja sem armazenamento é demonstração. Carrinho esvazia ao recarregar, pedido não fica registrado e cliente não existe. Dois conectores fecham essa distância, e isso é uma sessão de trabalho, não uma mensagem no chat.

Estoque, imposto e regra de frete são trabalho de verdade. O modelo mostra qualquer número que você der a ele. Decidir quais números são os certos, e mantê-los verdadeiros ao longo do tempo, continua sendo tarefa sua.

Regra de negócio muito específica chega por edições, não por um prompt. Kit com preço condicional, garantia amarrada a número de série, frete por região: tudo alcançável, mas como uma sequência de mudanças pedidas uma a uma. Em produto realmente complexo o Zugo não substitui um time de desenvolvimento, e o código sai pela exportação para o GitHub quando você quiser.

Qual é o primeiro passo?

O teste mais barato de encaixe é reconstruir o comparativo com os seus dois produtos. Abra a galeria em zugo.dev, clone o Volt e coloque o seu carro-chefe ao lado do modelo que as pessoas compram no lugar dele. Se essa tabela for fácil de preencher, o Volt é a moldura certa para a sua loja.

← Todos os artigos