📚 Documentação

Guia completo para usar o Portal de Projetos Dablion

📖 Introdução

O Portal de Projetos foi desenvolvido para resolver problemas de comunicação e organização no desenvolvimento de sites, lojas virtuais e landing pages.

Com ele, você coleta todas as informações necessárias através de um formulário de briefing completo e acompanha cada etapa do projeto em tempo real.

✅

Briefing Completo

Coleta todas as informações necessárias em um único formulário organizado.

📊

Gestão de Status

Acompanhe o progresso desde o briefing até o deploy em 8 etapas claras.

🔒

100% Seguro

Todos os dados ficam armazenados localmente no seu navegador.

🔄 Fluxo de Trabalho

Entenda como funciona o ciclo completo de um projeto no portal:

Criação do Projeto

O cliente ou gerente de projetos preenche o formulário de briefing com todas as informações necessárias.

Validação do Briefing

A equipe valida as informações recebidas e solicita complementos se necessário.

Desenvolvimento de Layout

O designer cria o layout no Figma com base nas informações do briefing.

Aprovação do Layout

O cliente revisa e aprova o design proposto.

Desenvolvimento

O desenvolvedor implementa o site/loja conforme o layout aprovado.

Revisão

A equipe de QA testa todas as funcionalidades e verifica se está tudo conforme o briefing.

Aprovação Final

O cliente faz a aprovação final do projeto completo.

Deploy

O site é publicado e fica disponível no ar!

📝 Campos do Briefing

Conheça todos os campos que devem ser preenchidos no briefing:

Informações Básicas

  • Nome do Projeto: Nome interno para identificação
  • Nome do Cliente: Empresa ou pessoa responsável
  • Tipo de Projeto: Site, E-commerce ou Landing Page
  • Descrição: Objetivo e escopo do projeto

Informações de Contato

  • Email Principal: Email de contato do cliente
  • Telefone/WhatsApp: Para comunicação rápida
  • Email para Formulários: Onde os formulários do site serão enviados
  • Endereço: Endereço físico (se aplicável)
  • Redes Sociais: Links completos de todas as redes

Domínio e Hospedagem

  • Domínio: Se já possui e qual é
  • Acesso ao Domínio: URL do painel, usuário e senha
  • Hospedagem: Se já possui e qual provedor
  • Acesso à Hospedagem: URL do painel, usuário e senha
⚠️ Segurança Todas as credenciais são armazenadas localmente no navegador e nunca são enviadas para nenhum servidor.

Design e Identidade Visual

  • Status do Figma: Se o layout está aprovado, em desenvolvimento ou não existe
  • Link do Figma: URL do projeto no Figma
  • Cores da Marca: Cor principal e secundária
  • Fontes: Tipografias que devem ser usadas

Tracking e Analytics

  • Google Analytics: ID de rastreamento
  • Google Tag Manager: ID do GTM
  • Facebook Pixel: ID do Pixel do Facebook/Meta
  • Outros Códigos: TikTok Pixel, LinkedIn, etc.

E-commerce (Apenas para Lojas Virtuais)

  • Métodos de Pagamento: Cartão, PIX, Boleto, etc.
  • Gateway de Pagamento: Mercado Pago, PagSeguro, etc.
  • Métodos de Envio: Correios, Transportadora, Retirada Local, etc.
  • Informações Adicionais: Quantidade de produtos, integrações, etc.

Arquivos

  • Upload de Arquivos: Logos, imagens, documentos
  • Formatos Aceitos: JPG, PNG, SVG, PDF, AI, PSD
  • Tamanho Máximo: 10MB por arquivo

📊 Status dos Projetos

O projeto passa por 8 status diferentes ao longo de seu desenvolvimento:

Status Descrição Progresso
📝 Briefing Coleta inicial de informações do cliente 10%
✓ Validação Validação e confirmação das informações 20%
🎨 Design Desenvolvimento do layout no Figma 35%
👁️ Aprovação Layout Cliente revisa e aprova o design 50%
💻 Desenvolvimento Implementação do site/loja 70%
🔍 Revisão Testes e ajustes finais 85%
✅ Aprovado Projeto aprovado e pronto para publicar 95%
🚀 Publicado Site publicado e no ar 100%

💡 Dicas de Uso

Para Clientes

  • Preencha todos os campos obrigatórios (marcados com *)
  • Seja o mais detalhista possível na descrição
  • Tenha em mãos todos os acessos antes de começar
  • Faça upload de arquivos em alta qualidade
  • Revise todas as informações antes de enviar

Para Designers

  • Leia todo o briefing antes de começar
  • Respeite as cores e fontes especificadas
  • Marque o status do Figma como "Aprovado" quando finalizar
  • Deixe comentários no Figma para dúvidas
  • Atualize o status do projeto ao finalizar

Para Desenvolvedores

  • Só comece após aprovação do layout
  • Implemente todos os códigos de tracking
  • Teste em múltiplos dispositivos
  • Valide credenciais de hospedagem antes
  • Documente qualquer mudança do layout original

Comandos Úteis (Console do Navegador)

Comando Descrição
createDemoProjects() Cria 3 projetos de exemplo para testar
exportProjects() Exporta todos os projetos em JSON
clearAllProjects() Remove todos os projetos (cuidado!)

🆘 Precisa de Ajuda?

Nossa equipe está pronta para ajudar você!

Entre em Contato via WhatsApp