Post-IA-08

Uso de IA na criação de um webapp – Part 6

Definido a melhor estrutura para nosso app e criando os programas

Formato do blog

Prompts em azul,

Meus comentários em verde,

Soluções da IA em preto,

Comentários da IA em marrom.

IAs Utilizadas neste Post
Copilot

No post anterior, exploramos diferentes estratégias de reconhecimento facial e avaliamos suas vantagens e limitações. A partir dessa análise, optamos por utilizar uma biblioteca real para realizar tanto o reconhecimento quanto o cadastramento de rostos no nosso aplicativo.

Concluímos que a melhor abordagem para o nosso projeto seria estruturar a solução em três partes principais:

• Dois programas de frontend: CadastroRosto.jsx e RegistroPonto.jsx

• Uma API de backend: app.py

No frontend, utilizamos React para construir a interface e integrar o reconhecimento facial. Para definir a melhor linguagem para o backend, consultamos o Copilot. Com base em critérios como privacidade, desempenho e facilidade de integração com bibliotecas de IA, optamos por desenvolver a API em Python, utilizando o framework Flask e persistência local em JSON.

Você poderia recomendar-me qual seria a melhor linguagem para criar o backend?

✅ Existem bastante vantagens de usar Python para reconhecimento facial no backend

🧠 1. Ecossistema de IA maduro — Python é a linguagem dominante em IA e ciência de dados.

Tem bibliotecas robustas como numpy, scikit-learn, face_recognition, dlib, opencv, etc.

📏 2. Comparação vetorial eficiente — com numpy, você pode calcular distância euclidiana entre vetores com uma linha de código:

np.linalg.norm(vetor1 - vetor2)

🧪 3. Integração com modelos avançados — pode usar face_recognition (baseado em dlib) e frameworks como FastAPI ou Flask.

🔐 4. Privacidade e controle — o backend recebe apenas o vetor facial, sem imagens, com total segurança.

Com base nas decisões anteriores — especialmente a escolha por realizar o reconhecimento facial localmente e a comparação de vetores na nuvem — emitimos o seguinte prompt para o Copilot:

Queremos criar uma solução de registro de ponto com reconhecimento facial, onde o vetor facial é gerado no dispositivo do usuário e enviado para uma API Flask que realiza a comparação com vetores previamente cadastrados. A persistência será feita em JSON. Como deve ser estruturado esse projeto?

A partir desse prompt, o Copilot nos ajudou a definir uma arquitetura clara e escalável:

Frontend React — dois componentes:

CadastroRosto.jsx: captura o rosto, gera o vetor facial e envia junto com os dados do usuário.

RegistroPonto.jsx: reconhece o usuário com base no vetor facial e registra o ponto.

Backend Flask — persistência em JSON:

Endpoint /cadastrar e /reconhecer para armazenar e comparar vetores.

Essa estrutura mantém a privacidade e é escalável, ideal para aplicações reais.

Vamos então criar API Flask + React separados para backend e frontend. Você poderia criar uma estrutura que suportasse essa solução?

Estrutura recomendada do projeto

Crie então o programa CadastroRosto.jsx

📄 CadastroRosto.jsx — captura o vetor facial localmente e envia ao backend via API Flask.

Agora crie a API Flask em Python para testar o CadastroRosto.jsx, usando JSON para persistir os vetores.

app.py — backend Flask que cadastra e reconhece rostos com vetores persistidos em JSON.

Agora crie o programa RegistroPonto.jsx

📄 RegistroPonto.jsx — reconhece o usuário e registra a presença.

Bem, pessoal, agora que todos os programas do nosso app estão prontos — o frontend com CadastroRosto.jsx e RegistroPonto.jsx, e o backend com Flask — temos uma base sólida para nosso sistema de registro de ponto com reconhecimento facial.

No próximo post, vamos explorar testes práticos, desempenho e privacidade.

Até lá, continue acompanhando — estamos construindo juntos uma solução que une IA, privacidade e web moderna.