Introdução ao Keras com TensorFlow no Google Colab

Esta breve introdução utiliza o Keras para realizar as seguintes tarefas:

1. Criar uma rede neural que classifique imagens.
2. Treinar essa rede neural.
3. Avaliar a precisão do modelo.

Este é um arquivo de bloco de notas do Google Colaboratory. Os programas Python são executados diretamente no navegador — uma ótima maneira de aprender e usar o TensorFlow.

Como começar no Colab:

• Conecte-se a um tempo de execução: No canto superior direito da barra de menus, selecione CONNECT.
• Execute todas as células: Selecione Tempo de execução > Executar tudo.

---

1. Configuração do Ambiente

Baixe e instale o pacote TensorFlow 2 e importe-o para o seu programa:

from __future__ import absolute_import, division, print_function, unicode_literals

# Instalação do TensorFlow (específico para ambiente Colab)
try:
  %tensorflow_version 2.x
except Exception:
  pass

import tensorflow as tf

2. Carregar o Conjunto de Dados

Carregue e prepare o conjunto de dados MNIST. Converta as amostras de números inteiros em números de ponto flutuante (normalização):

mnist = tf.keras.datasets.mnist

(x_train, y_train), (x_test, y_test) = mnist.load_data()
x_train, x_test = x_train / 255.0, x_test / 255.0

3. Construir o Modelo

Crie o modelo tf.keras.Sequential empilhando camadas. Escolha uma função otimizadora e de perda para o treinamento:

model = tf.keras.models.Sequential([
  tf.keras.layers.Flatten(input_shape=(28, 28)),
  tf.keras.layers.Dense(128, activation='relu'),
  tf.keras.layers.Dropout(0.2),
  tf.keras.layers.Dense(10, activation='softmax')
])

model.compile(optimizer='adam',
              loss='sparse_categorical_crossentropy',
              metrics=['accuracy'])

4. Treinar e Avaliar

Execute o treinamento e, em seguida, verifique a performance do modelo com os dados de teste:

model.fit(x_train, y_train, epochs=5)
model.evaluate(x_test, y_test, verbose=2)

Exemplo de saída do console:

Epoch 1/5
1875/1875 [==============================] - 3s 1ms/step - loss: 0.2970 - accuracy: 0.9135
Epoch 2/5
1875/1875 [==============================] - 3s 1ms/step - loss: 0.1444 - accuracy: 0.9570
Epoch 3/5
1875/1875 [==============================] - 3s 1ms/step - loss: 0.1097 - accuracy: 0.9674
Epoch 4/5
1875/1875 [==============================] - 3s 1ms/step - loss: 0.0910 - accuracy: 0.9725
Epoch 5/5
1875/1875 [==============================] - 3s 1ms/step - loss: 0.0750 - accuracy: 0.9766
313/313 - 0s - loss: 0.0744 - accuracy: 0.9766
[0.07437223196029663, 0.9765999913215637]

---

Resultado: O classificador de imagem agora está treinado com aproximadamente 98% de acurácia neste conjunto de dados. Para saber mais, leia os tutoriais oficiais do TensorFlow.

---

Anatomia do Modelo Sequencial

No Keras, um modelo Sequential é como uma linha de montagem: os dados entram por um lado, passam por várias estações (camadas) e saem transformados do outro.

1. tf.keras.layers.Flatten(input_shape=(28, 28))

• O que faz: "Achata" os dados.
• Por que é necessária: As imagens do MNIST são matrizes de 28x28 pixels (um quadrado). As camadas densas que vêm a seguir não entendem bi-dimensionalidade; elas precisam de uma lista única de números.
• Resultado: Ela transforma o quadrado de 28x28 em uma linha reta de 784 pixels ($28 \times 28 = 784$).

2. tf.keras.layers.Dense(128, activation='relu')

• O que faz: É o "cérebro" da rede. É uma camada totalmente conectada onde cada um dos 784 pixels se conecta a 128 neurônios.
• A Função relu (Rectified Linear Unit): É o filtro de importância. Ela diz: "se o sinal for negativo ou irrelevante, ignore (torne zero); se for positivo, passe adiante". Isso ajuda a rede a aprender padrões complexos.

3. tf.keras.layers.Dropout(0.2)

• O que faz: É a camada de "esquecimento seletivo". Durante o treino, ela desliga aleatoriamente 20% dos neurônios.
• Por que é vital: Isso evita o Overfitting (quando a rede decora as imagens de treino em vez de aprender a lógica). Ela força a rede a encontrar caminhos alternativos para chegar à resposta, tornando-a mais robusta para imagens que ela nunca viu antes.

4. tf.keras.layers.Dense(10, activation='softmax')

• O que faz: É a camada de saída.
• Por que 10? Porque temos 10 categorias possíveis (os números de 0 a 9).
• A Função softmax: Ela transforma a saída em probabilidades. Em vez de apenas dizer "é o número 5", ela diz: "Tenho 92% de chance de ser o número 5, 5% de ser o número 3 e 3% de ser o número 8". A soma de todos os neurônios aqui sempre será 100% (1.0).

---

A Compilação (O "Contrato" de Treino)

• Optimizer (adam): É o algoritmo que ajusta os pesos dos neurônios para diminuir o erro. O adam é o padrão ouro hoje por ser rápido e inteligente.
• Loss (sparse_categorical_crossentropy): É como medimos o quão "errada" a rede está. Quanto menor esse número, melhor o classificador.
• Metrics (accuracy): Simplesmente a porcentagem de acertos que vemos no console.

---

Testando o Modelo com sua Própria Imagem

import numpy as np
from google.colab import files
from PIL import Image
import matplotlib.pyplot as plt

# 1. Upload da imagem (Desenhe um número no Paint ou papel e tire foto)
uploaded = files.upload()

for fn in uploaded.keys():
  # 2. Carregar e converter para Tons de Cinza (L)
  path = fn
  img = Image.open(path).convert('L')
  
  # 3. Redimensionar para 28x28 pixels (o tamanho que o modelo conhece)
  img = img.resize((28, 28))
  
  # 4. Inverter cores e Normalizar
  # O MNIST usa fundo preto (0) e traço branco (255). 
  # Se sua imagem for papel branco com caneta preta, precisamos inverter:
  img_array = np.array(img)
  img_array = 255 - img_array  # Inverte: branco vira preto
  img_array = img_array / 255.0 # Normaliza entre 0 e 1
  
  # 5. Adicionar dimensão de "batch" (o modelo espera um pacote de imagens)
  img_input = img_array.reshape(1, 28, 28)
  
  # 6. Fazer a Previsão
  predictions = model.predict(img_input)
  predicted_digit = np.argmax(predictions)
  confidence = np.max(predictions) * 100
  
  # 7. Mostrar o resultado
  plt.imshow(img_array, cmap='gray')
  plt.title(f"Previsão: {predicted_digit} ({confidence:.2f}%)")
  plt.show()
  
  print(f"O modelo acha que este número é o: {predicted_digit}")

---

Dicas para o sucesso do teste:

1. O Contraste é Rei: Use uma caneta grossa (tipo canetinha ou pincel atômico). Traços muito finos de lápis podem sumir quando a imagem é reduzida para apenas 28x28 pixels.
2. Centralização: O modelo MNIST é sensível à posição. Tente desenhar o número bem no centro da imagem.
3. Fundo Limpo: Se tirar foto de um papel, garanta que não haja sombras fortes ou texturas no fundo.

O que acontece no código?

• Image.open().convert('L'): Transforma sua foto colorida em preto e branco.
• img.resize((28, 28)): O modelo tem exatamente 784 neurônios na entrada. Se você enviar uma foto de 12 megapixels, ele "trava". Precisamos esmagar a imagem para o tamanho minúsculo do treino.
• np.argmax(): A saída do modelo é uma lista de 10 probabilidades. O argmax pega a posição do maior valor (ex: se a posição 5 for a maior, o número é 5).

---

Salvando e Baixando o Modelo

# 1. Salvar o modelo no sistema de arquivos do Colab
model.save('meu_modelo_mnist.h5')

# 2. Baixar o arquivo para o seu computador local
from google.colab import files
files.download('meu_modelo_mnist.h5')

print("Modelo salvo e pronto para download!")

Como carregar o modelo depois?

Quando você quiser usar o modelo em outro script (sem precisar rodar o código de treino novamente), basta usar:

from tensorflow.keras.models import load_model

# Carregar o arquivo salvo
modelo_carregado = load_model('meu_modelo_mnist.h5')

# Ver o resumo para conferir se está tudo certo
modelo_carregado.summary()

---

O que fazer com esse arquivo .h5?

Agora que você tem o cérebro da sua IA em um arquivo, as possibilidades são enormes:

1. Desktop App: Use bibliotecas como PyQt ou Tkinter em Python para criar um programa de desenho onde a IA adivinha o que você escreve em tempo real.
2. Web App: Converta o modelo para TensorFlow.js. Isso permite que o modelo rode diretamente no navegador do usuário, usando a placa de vídeo (GPU) dele, sem precisar de um servidor caro.
3. API com Flask/FastAPI: Crie um servidor que recebe uma imagem via internet e devolve o número identificado.

Dica de Ouro: O Formato .keras

Embora o .h5 seja muito comum, o TensorFlow agora recomenda o formato .keras para modelos novos, pois ele é mais leve e seguro. O comando é idêntico: model.save('modelo.keras').

---

Passo 1: Converter o Modelo para Web

No seu Google Colab, você precisa instalar o conversor e transformar seu arquivo .h5 em um formato que o JavaScript entenda (JSON + pesos binários).

# Instala o conversor
!pip install tensorflowjs

# Converte o modelo salvo (.h5) para o formato web
import tensorflowjs as tfjs
tfjs.converters.save_keras_model(model, 'modelo_web')

# Compacta e baixa a pasta com os arquivos
!zip -r modelo_web.zip modelo_web
from google.colab import files
files.download('modelo_web.zip')

---

Passo 2: O Código da Página Web (HTML/JS)

Após extrair o arquivo .zip, você terá um arquivo model.json e alguns arquivos .bin. Crie um arquivo index.html na mesma pasta com este esqueleto:

<!DOCTYPE html>
<html>
<head>
    <title>IA de Números</title>
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
</head>
<body>
    <h1>O que eu estou vendo?</h1>
    <canvas id="canvas" width="280" height="280" style="border:1px solid black;"></canvas>
    <button onclick="prever()">Adivinhar!</button>
    <h2 id="resultado"></h2>

    <script>
        let model;
        
        // Carrega o modelo assim que a página abre
        async function carregarModelo() {
            model = await tf.loadLayersModel('model.json');
            console.log("Modelo carregado!");
        }

        async function prever() {
            const canvas = document.getElementById('canvas');
            
            // 1. Captura o desenho e redimensiona para 28x28
            let tensor = tf.browser.fromPixels(canvas)
                .resizeNearestNeighbor([28, 28])
                .mean(2) // Transforma em tons de cinza
                .expandDims(0) // Adiciona o batch
                .div(255.0); // Normaliza

            // 2. Faz a inferência
            const predictions = await model.predict(tensor).data();
            const resultado = predictions.indexOf(Math.max(...predictions));
            
            document.getElementById('resultado').innerText = "Eu acho que é: " + resultado;
        }

        carregarModelo();
    </script>
</body>
</html>

---

Por que isso é incrível?

1. Privacidade Total: Os dados do usuário (o desenho) nunca saem do computador dele. A IA acontece "dentro" do navegador.
2. Custo Zero: Como o processamento acontece no hardware do cliente, você pode ter 1 milhão de usuários e o custo do seu servidor será quase zero.
3. Latência Baixa: Não há tempo de espera de envio para a nuvem e resposta. É instantâneo.

---

O "Pulo do Gato" (Importante!)

Para rodar isso localmente, você não pode simplesmente abrir o arquivo .html clicando duas vezes nele (o navegador bloqueia o carregamento do modelo por segurança). Você precisa de um mini-servidor local.

• Se você tem Python: Abra o terminal na pasta e digite python -m http.server.
• Se usa VS Code: Use a extensão Live Server.