🤖 ML·Playground

Aprenda Machine Learning na prática — sem instalar nada, sem código, sem enrolação.

---

✨ O que é isso?

Um playground interativo de Machine Learning feito em HTML puro — abre no navegador, sem servidor, sem npm, sem Python. Ideal para apresentações, reuniões, aulas e qualquer momento em que você quer mostrar ML de forma visual e intuitiva.

O projeto guia o usuário por 4 telas simples:

Tela 1 → O que é ML?
Tela 2 → Escolha um algoritmo
Tela 3 → Treine o modelo ao vivo
Tela 4 → Veja o que o modelo aprendeu

---

🧠 Algoritmos incluídos

Algoritmo	Descrição simples	Uso real
📍 KNN	"Diz-me com quem andas" — classifica pelo vizinho mais próximo	Netflix, Spotify, filtro de spam
📈 Regressão Linear	Traça a reta que melhor representa seus dados	Preço de imóveis, logística, marketing
🌳 Árvore de Decisão	Faz perguntas de sim/não pra separar grupos	Crédito bancário, triagem médica

---

🚀 Como usar

É literalmente um arquivo só:

git clone https://github.com/seu-usuario/ml-playground.git
cd ml-playground

# Abra no navegador
open ml-playground.html       # macOS
xdg-open ml-playground.html  # Linux
start ml-playground.html      # Windows

Ou então só baixe o arquivo e dê dois cliques. Pronto.

---

🎯 Para apresentações

1. Abra ml-playground.html no navegador em tela cheia (F11)
2. Siga as telas junto com o público
3. Na Tela 3, peça pra alguém da plateia clicar e adicionar os pontos
4. Na Tela 4, explique o que o modelo aprendeu com as palavras que aparecem

💡 Dica: No KNN, coloque grupos bem separados e depois adicione um ponto no meio — peça pra galera adivinhar qual grupo ele vai virar antes de clicar.

---

🗂 Estrutura

ml-playground/
└── ml-playground.html    # tudo aqui — HTML, CSS e JS em um único arquivo

Sem pasta node_modules. Sem package.json. Sem ansiedade.

---

🛠 Detalhes técnicos

• Frontend: HTML5 + CSS3 + JavaScript vanilla
• Algoritmos: implementados do zero, sem bibliotecas de ML
• KNN: classificação por distância euclidiana com K=3
• Regressão: mínimos quadrados ordinários (OLS)
• Árvore: critério de impureza de Gini, profundidade máxima 3
• Fontes: Syne + DM Sans via Google Fonts
• Compatível com: Chrome, Firefox, Safari, Edge

---

📸 Preview

┌─────────────────────────────────┐
│  ML·Playground          ○ ○ ○ ○  │  ← barra de progresso
├─────────────────────────────────┤
│                                  │
│  O que é                         │
│  Machine Learning?               │
│                                  │
│  ┌──────────┐  vs  ┌──────────┐  │
│  │ 🧑‍💻 Regras │      │ 🤖 Exemplos│  │
│  │ manuais  │      │ → aprende│  │
│  └──────────┘      └──────────┘  │
│                                  │
│  [ Entendi! Vamos lá → ]         │
└─────────────────────────────────┘

---

🤝 Contribuindo

Tem ideia de novo algoritmo ou melhoria? Abre uma issue ou manda um PR!

Sugestões de próximos algoritmos:

• SVM (Support Vector Machine)
• Naive Bayes
• K-Means (clusterização)
• Rede Neural simples (perceptron)

---

📄 Licença

MIT — usa à vontade, modifica, distribui. Só não esquece de dar uma estrela ⭐

---

Feito com 🤖 e muito café