mint-catlogo

byJéssica Marques (Designer)

Assunto: Criação de Website de Peças e Oficina de Motos (Sistema de Orçamentos) Objetivo: Criar um site profissional inspirado em plataformas como Auto-Doc Moto e Eurobikes. O site não deve permitir a compra direta, mas sim funcionar como um catálogo onde o utilizador adiciona peças a um carrinho para solicitar um orçamento final. 1. Estrutura e Navegação: Home: Hero section com um "Moto-Finder" (Selectores: Marca > Cilindrada > Modelo > Ano). Destaque de categorias principais (Pneus, Travagem, Óleos, Capacetes). Catálogo: Listagem de produtos com filtros laterais (Preço, Marca da Peça, Tipo de Material). Ficha de Produto: Fotos de alta qualidade, descrição técnica, tabela de compatibilidade (Lista de motas onde a peça serve) e botão "Adicionar ao Orçamento". Página de Orçamento: Listagem dos itens escolhidos + Formulário de contacto com campos obrigatórios: Nome, Email, Telefone, Matrícula ou VIN (Número do Quadro) e campo para Mensagem/Observações. Serviços de Oficina: Página simples explicando os serviços (Revisões, Check-up, Montagem de Pneus) com botão para agendamento via WhatsApp. 2. Design e Estética: Estilo: "Dark Mode" técnico e moderno. Cores: Fundo Cinza Antracite (#1A1A1A), Cartões de produto em Branco ou Cinza Claro para contraste, e Cor de destaque (Laranja vibrante ou Vermelho Corrida) para CTAs e Filtros. Tipografia: Sans-serif robusta (ex: Inter ou Montserrat). 3. Especificações Técnicas: Lógica de Filtro: Implementar uma taxonomia onde as peças estão ligadas a "Modelos de Mota". Se o utilizador selecionar "Yamaha MT-07", o site deve ocultar peças incompatíveis. Conversão: O "Carrinho" deve ser renomeado para "Lista de Orçamento". O botão final deve ser "Enviar Pedido de Cotação". Mobile-First: A navegação deve ser perfeita em smartphones. 4. O que preciso que geres agora: Sitemap Detalhado: Estrutura de todas as páginas e subcategorias. Stack Sugerida: Melhores ferramentas para construir isto (ex: WordPress + WooCommerce Catalog Mode ou React/Next.js). Código Base: Gera o HTML e Tailwind CSS para a secção do "Moto-Finder" da Homepage e para a Página de Produto. Copywriting: Escreve um texto de introdução para a Home que transmita confiança e autoridade técnica.