Surface_Relatorio / index.html
roundb's picture
Update index.html
5a5631d verified
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Relatório Executivo: Desempenho do Modelo de IA</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
color: #333;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
min-height: 100vh;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
/* Header */
header {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 40px 20px;
border-radius: 10px;
margin-bottom: 30px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
text-align: center;
}
header h1 {
font-size: 2.5em;
margin-bottom: 10px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
header p {
font-size: 1.1em;
opacity: 0.9;
}
.metadata {
display: flex;
justify-content: center;
gap: 30px;
margin-top: 15px;
font-size: 0.95em;
flex-wrap: wrap;
}
/* Main Content */
main {
background: white;
border-radius: 10px;
padding: 40px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
margin-bottom: 30px;
}
section {
margin-bottom: 50px;
}
section:last-child {
margin-bottom: 0;
}
h2 {
color: #667eea;
font-size: 1.8em;
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 3px solid #667eea;
display: flex;
align-items: center;
gap: 10px;
}
h3 {
color: #764ba2;
font-size: 1.3em;
margin-top: 25px;
margin-bottom: 15px;
}
p {
margin-bottom: 15px;
text-align: justify;
line-height: 1.8;
}
strong {
color: #667eea;
font-weight: 600;
}
/* Tables */
table {
width: 100%;
border-collapse: collapse;
margin: 20px 0;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
border-radius: 8px;
overflow: hidden;
}
th {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 15px;
text-align: left;
font-weight: 600;
}
td {
padding: 12px 15px;
border-bottom: 1px solid #eee;
}
tr:hover {
background-color: #f9f9f9;
}
tr:last-child td {
border-bottom: none;
}
/* Highlights */
.highlight {
background-color: #fff3cd;
padding: 20px;
border-left: 4px solid #ffc107;
border-radius: 5px;
margin: 20px 0;
}
.success-box {
background-color: #d4edda;
padding: 20px;
border-left: 4px solid #28a745;
border-radius: 5px;
margin: 20px 0;
}
.metric-card {
display: inline-block;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 20px;
border-radius: 8px;
margin: 10px;
text-align: center;
min-width: 150px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.metric-card .value {
font-size: 2em;
font-weight: bold;
margin: 10px 0;
}
.metric-card .label {
font-size: 0.9em;
opacity: 0.9;
}
/* Images */
img {
max-width: 100%;
height: auto;
border-radius: 8px;
margin: 20px 0;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
display: block;
}
/* Lists */
ul, ol {
margin: 15px 0 15px 30px;
}
li {
margin-bottom: 10px;
line-height: 1.8;
}
/* Footer */
footer {
background: #333;
color: white;
text-align: center;
padding: 20px;
border-radius: 10px;
margin-top: 30px;
}
/* Responsive */
@media (max-width: 768px) {
header h1 {
font-size: 1.8em;
}
main {
padding: 20px;
}
.metadata {
flex-direction: column;
gap: 10px;
}
h2 {
font-size: 1.4em;
}
table {
font-size: 0.9em;
}
td, th {
padding: 10px;
}
}
/* Print Styles */
@media print {
body {
background: white;
}
main {
box-shadow: none;
padding: 0;
}
section {
page-break-inside: avoid;
}
}
.emoji {
margin-right: 5px;
}
</style>
</head>
<body>
<div class="container">
<header>
<h1>📊 Relatório Executivo: Desempenho do Modelo de IA</h1>
<p>Análise Completa dos Resultados de Treinamento</p>
<div class="metadata">
<span>📅 Data: 15 de Dezembro de 2025</span>
<span>👤 Autor: Ronaldo Menezes / IA </span>
<span>🎯 Modelo: Vision Transformer (ViT)</span>
</div>
</header>
<main>
<!-- Sumário Executivo -->
<section>
<h2><span class="emoji">📈</span>1. Sumário Executivo</h2>
<p>Este relatório apresenta os resultados do treinamento de um modelo de Inteligência Artificial (IA), arquitetura <strong>ViT (Vision Transformer)</strong>, para a tarefa de <strong>classificação de superfícies</strong> em três categorias: <strong>asfalto, tijolo e grama</strong>. O objetivo do treinamento foi desenvolver um modelo capaz de identificar com alta precisão o tipo de superfície a partir de imagens.</p>
<div class="success-box">
<strong>✓ Resultado Principal:</strong> O modelo alcançou um <strong>desempenho excepcional</strong>, com uma <strong>acurácia final de 99.74%</strong> no conjunto de dados de teste, que simula um ambiente de produção. Este resultado indica que o modelo é extremamente confiável e robusto para a aplicação designada, superando as expectativas iniciais.
</div>
</section>
<!-- Dataset -->
<section>
<h2><span class="emoji">📦</span>2. Visão Geral do Conjunto de Dados</h2>
<p>O treinamento foi realizado com um total de <strong>7,551 imagens</strong>, distribuídas de forma balanceada entre as três classes. O conjunto de dados foi dividido em três partes para garantir uma avaliação rigorosa e imparcial do modelo:</p>
<ul>
<li><strong>Treino (70%):</strong> 5,285 imagens usadas para ensinar o modelo.</li>
<li><strong>Validação (15%):</strong> 1,133 imagens usadas para ajustar os parâmetros do modelo durante o treinamento.</li>
<li><strong>Teste (15%):</strong> 1,133 imagens usadas para a avaliação final do modelo, com dados nunca antes vistos por ele.</li>
</ul>
<table>
<thead>
<tr>
<th>Divisão do Dataset</th>
<th>Número de Imagens</th>
<th>Percentual</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Treino</strong></td>
<td>5,285</td>
<td>70%</td>
</tr>
<tr>
<td><strong>Validação</strong></td>
<td>1,133</td>
<td>15%</td>
</tr>
<tr>
<td><strong>Teste</strong></td>
<td>1,133</td>
<td>15%</td>
</tr>
<tr>
<td><strong>Total</strong></td>
<td><strong>7,551</strong></td>
<td><strong>100%</strong></td>
</tr>
</tbody>
</table>
<img src="01_dataset_distribution.png" alt="Distribuição do Dataset"> </section>
<!-- Desempenho Durante Treinamento -->
<section>
<h2><span class="emoji">🎓</span>3. Desempenho Durante o Treinamento</h2>
<p>O modelo foi treinado ao longo de <strong>20 épocas</strong> (ciclos de treinamento). A cada época, a sua performance foi medida para garantir que o aprendizado estava ocorrendo de forma eficiente. Os gráficos abaixo ilustram a evolução da <strong>acurácia</strong> (percentual de acertos) e da <strong>loss</strong> (margem de erro).</p>
<h3>Evolução da Acurácia</h3>
<p>O gráfico demonstra um aumento consistente da acurácia, tanto nos dados de treino quanto nos de validação, estabilizando-se em um patamar próximo a 100%, o que indica um aprendizado bem-sucedido.</p>
<img src="02_accuracy_evolution.png" alt="Evolução da Acurácia">
<h3>Evolução da Loss (Erro)</h3>
<p>De forma complementar, a margem de erro (loss) diminuiu progressivamente ao longo do treinamento, aproximando-se de zero. Isso confirma que o modelo se tornou cada vez mais confiante e preciso em suas previsões.</p>
<img src="03_loss_evolution.png" alt="Evolução da Loss">
</section>
<!-- Resultados Finais -->
<section>
<h2><span class="emoji">🏆</span>4. Resultados Finais</h2>
<p>Após a conclusão do treinamento, o modelo foi avaliado em um conjunto de dados de teste, que ele nunca havia visto antes. Os resultados confirmam a sua alta performance e capacidade de generalização para novos dados.</p>
<h3>Métricas de Desempenho (Conjunto de Teste)</h3>
<div style="text-align: center; margin: 30px 0;">
<div class="metric-card">
<div class="label">Acurácia</div>
<div class="value">99.74%</div>
</div>
<div class="metric-card">
<div class="label">Precisão</div>
<div class="value">99.75%</div>
</div>
<div class="metric-card">
<div class="label">Revocação</div>
<div class="value">99.72%</div>
</div>
<div class="metric-card">
<div class="label">F1-Score</div>
<div class="value">99.73%</div>
</div>
</div>
<table>
<thead>
<tr>
<th>Métrica</th>
<th>Resultado (%)</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Acurácia</strong></td>
<td><strong>99.74%</strong></td>
</tr>
<tr>
<td>Precisão</td>
<td>99.75%</td>
</tr>
<tr>
<td>Revocação</td>
<td>99.72%</td>
</tr>
<tr>
<td>F1-Score</td>
<td>99.73%</td>
</tr>
</tbody>
</table>
<div class="highlight">
<strong>📌 Explicação das Métricas:</strong>
<ul>
<li><strong>Acurácia:</strong> Percentual de classificações corretas. 99.74% significa que, a cada 1000 imagens, o modelo acerta, em média, 997.</li>
<li><strong>Precisão:</strong> Das classificações que o modelo fez para uma classe, quantas estavam corretas.</li>
<li><strong>Revocação (Recall):</strong> De todas as imagens que realmente pertenciam a uma classe, quantas o modelo conseguiu identificar.</li>
<li><strong>F1-Score:</strong> Média harmônica entre precisão e revocação, fornecendo uma métrica única de performance.</li>
</ul>
</div>
<img src="04_final_metrics.png" alt="Métricas Finais">
<h3>Comparativo: Validação vs. Teste</h3>
<p>O desempenho do modelo foi consistente entre os conjuntos de validação e teste, o que demonstra que ele não apenas memorizou os dados de treino, mas <strong>aprendeu a generalizar</strong> o conhecimento para novas situações. Esta é uma característica crucial para um modelo de IA robusto e confiável.</p>
<img src="05_validation_vs_test.png" alt="Comparativo Validação vs. Teste">
<img src="06_improvement_progress.png" alt="Progresso de Melhoria">
</section>
<!-- Conclusão -->
<section>
<h2><span class="emoji"></span>5. Conclusão</h2>
<div class="success-box">
<p>O treinamento do modelo de classificação de superfícies foi um <strong>sucesso absoluto</strong>. O modelo alcançou um nível de acurácia de <strong>99.74%</strong>, demonstrando alta confiabilidade e precisão.</p>
<p>Com base nestes resultados, o modelo está <strong>apto para ser implementado em ambiente de produção</strong>, onde se espera que ele execute a tarefa de classificação de imagens com um desempenho excelente e consistente. A robustez demonstrada nos testes indica um baixo risco de falhas e uma alta taxa de acerto em cenários do mundo real.</p>
</div>
<h3>Recomendações</h3>
<ul>
<li>✓ Implementar o modelo em ambiente de produção com confiança</li>
<li>✓ Monitorar continuamente o desempenho em dados reais</li>
<li>✓ Realizar atualizações periódicas com novos dados para manter a performance</li>
<li>✓ Documentar o modelo para facilitar manutenção futura</li>
</ul>
</section>
</main>
<footer>
<p>&copy; 2025 Relatório Executivo - Desempenho do Modelo de IA</p>
</footer>
</div>
</body>
</html>