
Galeria de prévias
Skills semelhantes
Ver todas as SkillsO que você recebe
- Um único arquivo de site autocontido que abre em qualquer navegador e funciona offline, com fontes e imagens embutidas; ou uma versão portada para o seu projeto com framework, se você tiver um.
- Fluxos de compra funcionais: páginas de produto com tamanhos de embalagem, um montador de caixa por assinatura, uma gaveta de sacola, uma prévia do checkout com verificação de área de entrega e um mapa de revendedores.
- O Hero característico, as faixas, as ondas e a colagem de fotos em um exemplo de 28 páginas com 17 imagens, além de páginas de história, produtores, blog, entrega, FAQ e políticas.
Ideal para
- Marcas de suco, café, chá e snacks que vendem online e querem uma vitrine vibrante e alegre.
- Produtores locais que entregam em zonas definidas ou têm uma caixa por assinatura.
- Cafés e padarias que podem transformar a loja em cardápio e a página de localização em um único bloco de visita.
Não é para
- Pagamentos reais ou atendimento de pedidos; o checkout valida os dados, mas nunca cobra ninguém.
- Marcas que precisam de um visual escuro, minimalista ou corporativo em vez de gradientes e faixas.
- Vender os produtos fictícios da Halcy ou usar a arte da garrafa dela como se fosse sua.
Identidade visual e sistemas de marcaWeb design e experiências digitaisCriar site de marcaEstilo travadoResultado editávelColagem de sucosHero de sucosFaixa de sucosOnda de sucos
Sobre esta Skill

O Site de marca de suco com gradiente cria um site de marca e loja cheio de alegria para uma marca de bebidas, alimentos ou lifestyle: uma foto de campanha em gradiente sangrada mostrando alguém bebendo da sua garrafa, faixas de texto creme deslizando por caminhos curvos, bordas onduladas entre as seções e blocos de fotos vibrantes. O exemplo é a Halcy, uma marca fictícia de sucos prensados a frio em Ventura, na Califórnia, com 28 páginas conectadas, incluindo loja funcional, montador de caixas e prévia do checkout.

O que você recebe
- Um único arquivo de site autocontido que abre em qualquer navegador e funciona offline, com fontes e imagens embutidas. Se você já tem um projeto em algum framework, o design é portado para ele.
- Uma loja completa: seis páginas de produto com tamanhos de embalagem e preços ao vivo, coleções, um montador de caixa semanal, uma gaveta de sacola, uma prévia do checkout com verificação de área de entrega e uma página de sucesso honesta.
- Páginas de marca: nossa história, produtores com seletor de mês, um blog com quatro artigos, um localizador de revendedores com mapa, entregas e devoluções, FAQ com busca, contato, newsletter, políticas e uma página de não encontrado com design próprio.
- Uma única direção de arte para todas as imagens: still lifes de produto combinando, com a mesma garrafa e a mesma luz, além de cenas de lifestyle vibrantes.
- Faixas com texto que desliza devagar, uma entrada rápida no Hero e revelações suaves, tudo pausado quando a opção de movimento reduzido está ativa.

Como usar
- Informe sua marca, os produtos com preços e tamanhos de embalagem, onde e quando você entrega, sua história e seus contatos. Textos que faltarem são redigidos como placeholders plausíveis e listados para você confirmar.
- Deixe o agente gerar uma nova foto de Hero com o seu nome na garrafa e um still life por produto com a mesma luz, ou envie suas próprias fotos. Duas cenas neutras de bebida do pacote podem ficar.
- Abra cada página no desktop e no celular, adicione produtos à sacola, monte uma caixa, teste a prévia do checkout e peça ajustes.

A tipografia usa Bricolage Grotesque, Figtree e DM Serif Display, embutidas no arquivo. Novas imagens vêm da ferramenta de imagem do próprio agente e podem ter custos de uso; o checkout nunca cobra nada.
O que você precisa antes de começar
- Você fornece
- Nome da marca, produtos com preços e tamanhos de embalagem, e uma história curta · Detalhes do mercado: moeda, zonas de entrega ou frete, e contatos · Suas próprias fotos de produto e equipe, ou autorização para gerar novas imagens
- Dependências
- Node.js 18 ou mais recente na máquina do seu agente, para rodar o script incluído que gera o arquivo único offline · Acesso à internet durante a geração do arquivo, para que as fontes sejam baixadas uma vez e embutidas · Uma ferramenta de imagem no seu agente, ou suas próprias fotos, para o Hero e as imagens de produto
- Custos externos
- A foto do Hero e os still lifes de produto são gerados com a ferramenta de imagem do próprio agente, que pode cobrar pelo uso. Sem ela, envie suas próprias fotos; duas cenas neutras de bebida podem ficar. Ver o exemplo não custa nada, e o checkout nunca faz cobranças.
- Último teste
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Avaliações dos usuários
Carregando avaliações…








