Apresentação e defesa do projeto

É o dia de mostrares o teu Mini-CRM. Em 5 minutos apresentas a tua empresa, demonstras o CRM, explicas o que fizeste sozinho e respondes a perguntas — incluindo uma pequena alteração ao vivo no código.

🎯 No fim desta aula vais conseguir

Apresentar um projeto em 5 minutos, seguindo um guião.
Demonstrar as funcionalidades principais do teu CRM sem falhas.
Explicar o teu código e as tuas personalizações com as palavras certas.
Fazer uma pequena alteração ao vivo e refletir sobre o teu trabalho (autoavaliação).

🧰 Antes de começar

Lê esta página antes da aula 20 (em casa ou no fim da aula 19) e ensaia pelo menos duas vezes. No dia da defesa, confirma que tens:

O projeto final a funcionar no teu computador (Live Server) e o link do site publicado.
Um plano B: a pasta meu-crm numa pen ou na tua conta OneDrive/Google Drive, para o caso de o teu computador falhar.
A autoavaliação preenchida (passo 8).

😕 O teu projeto não está terminado? Não faz mal: apresenta o que tens a funcionar e explica bem o que fizeste. É melhor mostrar pouco e perceber tudo do que mostrar muito e não saber explicar. Se perdeste o projeto, fala com o professor antes da aula (em último caso, o ponto de controlo da aula 16 permite-te, pelo menos, demonstrar e explicar o CRM base).

Parte A — Preparar a apresentação

1 O guião dos 5 minutos

Uma boa apresentação não se improvisa: segue um guião. O teu tem 5 partes, sempre pela mesma ordem:

Parte	Tempo	O que fazes	Exemplo
1 · A empresa e o problema	30 s	Apresentas a empresa fictícia e o problema que o CRM resolve.	«O FitPorto é um ginásio no Porto. A receção apontava tudo num caderno e perdia os contactos de quem vinha experimentar. O meu CRM resolve isso.»
2 · Demonstração	2 min	Mostras o CRM a funcionar: criar um cliente → registar uma interação → criar uma oportunidade e avançá-la → ver o painel → exportar para Excel.	«Vou registar um novo sócio, a Marta… Agora, na ficha dela, registo a chamada de hoje…»
3 · O que fizeste sozinho	1 min	Mostras uma personalização no ecrã e no código, e explicas como a fizeste.	«Acrescentei o campo Plano. Para isso mexi no `index.html`, no formulário e na tabela, e no `app.js`, no `guardarCliente`, no `editarCliente` e no `linhaCliente`.»
4 · Uma dificuldade	30 s	Contas um problema que tiveste e como o resolveste.	«O plano não aparecia ao editar. Vi na Consola que o `id` estava diferente no HTML e no JavaScript.»
5 · Perguntas	1 min	O professor faz 1 ou 2 perguntas e pede-te uma pequena alteração ao vivo no código.	«Muda o texto do botão Guardar para “Guardar sócio”.»

Escreve o teu guião em tópicos (não o texto todo!) num cartão ou numa folha. Podes consultá-lo durante a apresentação. Modelo:

2 Preparar a demonstração

Um CRM vazio não impressiona ninguém. Prepara o «palco»:

Dados de exemplo (inventados!): 5 clientes com estados diferentes, 2 ou 3 interações e 3 ou 4 oportunidades em fases diferentes (assim o quadro e o painel ficam com números).
Truque profissional: com esses dados prontos, vai a Relatórios → Fazer cópia de segurança e muda o nome do ficheiro para demo.json. No dia, se os dados desaparecerem (outro computador, outro browser), carregas em Restaurar cópia e escolhes o demo.json. Em 10 segundos está tudo pronto.
Browser arrumado: fecha os separadores que não interessam e desliga as notificações. Aumenta o zoom para 125% (Ctrl e +) para se ver bem no projetor.
VS Code pronto: abertos o index.html, o app.js e o style.css, com a letra maior (Ctrl e +).
Ensaia a demonstração sempre com os mesmos passos, para não te perderes.

⚠️ RGPD até ao fim: nada de nomes, telefones ou emails de pessoas reais na demonstração — nem os dos colegas da turma.

3 Explicar o que fizeste sozinho

Esta é a parte mais importante da defesa: é aqui que mostras que percebes o teu código. Escolhe a personalização de que mais te orgulhas e prepara uma explicação com esta estrutura:

O quê: «Acrescentei…» (mostra no ecrã).
Onde: «Para isso alterei o ficheiro… na função…» (mostra no VS Code — usa Ctrl+F para lá chegares depressa).
Como funciona: uma ou duas frases sobre o que o código faz.

💡 Usa as palavras certas: campo, registo, função, id, objeto, lista (array), localStorage, chave estrangeira. Revê o glossário do curso.

4 Contar uma dificuldade

Todos os programadores encontram erros — o que interessa é como os resolvem. Conta a tua dificuldade em três frases:

O problema: o que não funcionava.
O que fizeste: como descobriste a causa (Consola, plano de testes, comparar com a página da aula, perguntar…).
O que aprendeste: o que fazes agora de forma diferente.

Parte B — Treinar as perguntas e a alteração ao vivo

5 Perguntas que o professor pode fazer

Prepara uma resposta curta (2 ou 3 frases) para cada uma. Não decores: percebe.

Sobre o código

O que faz a função guardarCliente, passo a passo?
Onde ficam guardados os dados do CRM? Em que formato?
Para que serve o ficheiro dados.js? Porque é que está separado do app.js?
O que é o clienteId de uma interação? Que tipo de relação existe entre clientes e interações?
O que acontece desde que carregas em ▶ até o cartão mudar de coluna?
Para que serve a função limpar? O que acontecia sem ela?
Porque é que, noutro computador, o teu CRM aparece vazio? Como passarias os dados de um computador para outro?
Escreve a consulta SQL que mostra os clientes do teu primeiro estado, ordenados por nome.

Sobre o projeto

Que funcionalidade acrescentarias se tivesses mais duas semanas?
Que teste do teu plano encontrou um erro? Como o corrigiste?
Como é que uma empresa real do teu setor usaria o teu CRM no dia a dia?

6 A alteração ao vivo

No fim, o professor pede-te uma pequena alteração no código, à frente de todos. Regras: tens cerca de 2 minutos, podes usar Ctrl+F e o site do curso, mas não podes usar IA. Treina com estes exemplos (faz cada um, confirma que funciona e desfaz com Ctrl+Z):

Mudar o texto do botão Guardar para «Guardar cliente».
Acrescentar a opção «WhatsApp» aos tipos de interação.
Mudar a cor principal do CRM.
Mudar a mensagem de erro que aparece quando falta o nome.
Acrescentar um estado novo (ex.: «VIP») com cor própria. (Mais difícil: lembra-te dos sítios da aula 17.)
Explicar, linha a linha, a função linhaCliente ou a função avancarFase.

💡 O segredo: antes de mexeres, diz em voz alta onde vais alterar e porquê («É texto que aparece no ecrã, por isso está no index.html…»). Mesmo que não consigas acabar, explicar o caminho certo já vale pontos. Se estragares alguma coisa, Ctrl+Z.

Treino a pares: um colega faz de professor e escolhe uma alteração da lista; tu fazes a alteração com o cronómetro do telemóvel ligado. Depois trocam.

7 Ensaiar

Liga o cronómetro do telemóvel e faz a apresentação completa, em voz alta, como se estivesses na sala.
Passou dos 5 minutos? Corta na demonstração (mostra menos passos, mas sem pressa).
Ensaia pelo menos duas vezes. Se puderes, apresenta a alguém de casa.

💡 No dia: fala para a turma (não para o ecrã), devagar, e respira entre as partes. Estar nervoso é normal — o guião em tópicos ajuda-te a não te perderes.

8 A autoavaliação

Para terminares o módulo, avalia o teu próprio trabalho na ficha de autoavaliação: dás uma nota de 1 a 5 a cada critério e respondes a algumas perguntas de reflexão. O que escreves fica guardado neste browser; no fim carrega em Imprimir / guardar PDF e entrega-a ao professor.

💡 Sê honesto: o professor compara a tua autoavaliação com a avaliação dele. Uma autoavaliação realista (que reconhece o que correu bem e o que falta) mostra maturidade — e isso também conta.

🔎 Investiga (antes da defesa)

Abre o teu app.js e faz uma lista das funções. Quais é que alteraste ou escreveste tu, nas aulas 17 a 19?
Escolhe uma função que não seja tua (por exemplo, desenharPainel) e explica-a em voz alta a alguém, sem usar a palavra «coisa».
No teu site publicado, abre o DevTools → Aplicação → Armazenamento local. Consegues explicar o que está em crm_oportunidades?
No GitHub, abre o histórico de commits do teu repositório. Quantas versões publicaste? O que mudou em cada uma?

✍️ Tarefas do projeto (contam para a avaliação)

T1 · Apresentação

Apresentas o projeto em cerca de 5 minutos, seguindo as 5 partes do guião, com a demonstração a funcionar.

💡 O professor avalia a clareza, o cumprimento do tempo e a demonstração — não a velocidade.

T2 · Defesa: perguntas e alteração ao vivo

Respondes às perguntas do professor e fazes a alteração ao vivo, explicando onde e porquê.

💡 Se não souberes uma resposta, diz como a irias procurar (no código, na Consola, no site do curso). Isso também mostra competência.

T3 · Autoavaliação e entrega final

Entregas a autoavaliação preenchida (PDF ou papel) e o projeto final em zip com o nome NomeApelido-mini-crm.zip.

💡 Antes de comprimires, confirma que a pasta não tem cópias .json com dados (a não ser o demo.json, com dados inventados).

⭐ Desafio · Pitch de 30 segundos

Imagina que encontras o dono de uma empresa a sério do teu setor no elevador. Em 30 segundos, convence-o a experimentar o teu CRM. Fala de benefícios para a empresa (não percas clientes, sabes quanto vais faturar…), não de tecnologia.

💡 Estrutura: o problema dele → o que o teu CRM faz por ele → um convite («experimente no telemóvel, é este o link»).

📦 O que mostrar ao professor

Ensaiei a apresentação pelo menos duas vezes, dentro dos 5 minutos.
Tenho dados de exemplo inventados prontos (e uma cópia demo.json para restaurar).
O site publicado abre e tenho um plano B (projeto local, pen ou nuvem).
Treinei as alterações ao vivo da lista do passo 6.
T1 e T2: fiz a apresentação e a defesa.
T3: entreguei a autoavaliação (PDF ou papel).
T3: entreguei o zip final NomeApelido-mini-crm.zip.

⏱️ Se sobrar tempo

Enquanto os colegas apresentam, anota para cada um um elogio e uma sugestão. No fim, partilha-os.
Ajuda um colega a preparar a demonstração (sem mexer no código dele).
O projeto é teu: continua a melhorá-lo depois do módulo e mantém o link no CV atualizado.

🤖 Pedir ajuda à IA (opcional, só para treinar em casa)

A IA pode fazer de «professor» e treinar-te para a defesa. Copia o pedido, cola no fim uma função do teu app.js e responde às perguntas sem olhar para a resposta. (Na defesa, a IA não pode ser usada.)

📖 Palavras novas

Defesa oral: Momento em que apresentas o teu trabalho e respondes a perguntas sobre ele, mostrando que o percebes.
Demonstração (demo): Mostrar a aplicação a funcionar, com dados preparados.
Pitch: Apresentação muito curta para convencer alguém (um cliente, um investidor).
Plano B: Alternativa preparada para o caso de algo falhar (outro computador, uma cópia na pen).
Autoavaliação: Avaliação que fazes do teu próprio trabalho, com base em critérios.
Linguagem técnica: As palavras próprias de uma área (ex.: registo, função, chave estrangeira), usadas com rigor.