decoda/docs/edu/fundamentos-programacao/programacao-com-blocos.md

---
sidebar_position: 4
title: "Programação com Blocos"
---

Compreenda os princípios pedagógicos por trás da programação visual com blocos.

## **Base Pedagógica**

O Decoda utiliza princípios educacionais modernos:

- **<i class="fas fa-users"></i> Aprendizagem colaborativa**: Estudantes aprendem juntos
- **<i class="fas fa-comments"></i> Diálogo**: Discussão coletiva de estratégias
- **<i class="fas fa-lightbulb"></i> Reflexão**: "Por que funciona assim?"
- **<i class="fas fa-cogs"></i> Prática**: Aprender fazendo

## **Pensamento Computacional**

A programação visual desenvolve os **4 pilares** do pensamento computacional:

### **1. Decomposição**

**Dividir problemas complexos em partes menores**

**<i class="fas fa-bullseye"></i> Exemplo no Semáforo:**

- <i class="fas fa-exclamation-triangle"></i> Problemática: "Como melhorar mobilidade urbana?"
- <i class="fas fa-search"></i> Investigação:
  - Acender luz verde (fluxo de carros)
  - Aguardar tempo (tempo social)
  - Acender luz amarela (transição)
  - Considerar pedestres (inclusão social)

### **2. Reconhecimento Crítico de Padrões**

**Identificar estruturas que se repetem na sociedade**

**<i class="fas fa-bullseye"></i> Exemplo no Aspirador:**

- <i class="fas fa-repeat"></i> Padrão que se repete: "avançar no grid → ver o que há na célula (sujeira, obstáculo, espaço livre) → decidir o próximo movimento" — até limpar a sala ou cumprir o desafio da fase.
- <i class="fas fa-lightbulb"></i> Reflexão: Onde no cotidiano repetimos "perceber o contexto → decidir → agir" (trabalho, deslocamento, tarefas em casa)?
- <i class="fas fa-code"></i> Codificação: **Loops** e **condicionais** nos blocos reproduzem esse ciclo nos dois jogos da plataforma.

### **3. Abstração Contextualizada**

**Focar no essencial sem perder a dimensão social**

**<i class="fas fa-bullseye"></i> Exemplo no Tartaruga:**

- <i class="fas fa-shapes"></i> Abstração: "Desenhar polígono"
- <i class="fas fa-ruler-combined"></i> Elementos essenciais: lados, ângulos, tamanho
- <i class="fas fa-question-circle"></i> Questão crítica: "Que formas geométricas vemos na nossa cidade?"
- <i class="fas fa-cog"></i> Função: `desenharPoligono(lados, tamanho)`

### **4. Algoritmos para Transformação**

**Criar instruções que promovam mudança social**

**<i class="fas fa-bullseye"></i> Exemplo geral:**

```
1. PROBLEMATIZAR situação real
2. SE há injustiça ou exclusão
   ENTÃO buscar solução coletiva
   SENÃO manter status quo
3. REPETIR até transformação alcançada
4. AVALIAR impacto social
```

## **Teoria das Inteligências Múltiplas Aplicada**

A programação visual atende diferentes formas de aprendizagem respeitando a diversidade:

### **Visual-Espacial**

- **Blocos coloridos** por categoria funcional
- **Formas geométricas** com significado pedagógico
- **Fluxo visual** do raciocínio lógico

### **Lógico-Matemática**

- **Sequências lógicas** de comandos contextualizados
- **Padrões numéricos** aplicados a problemas reais
- **Resolução sistemática** de questões sociais

### **Corporal-Cinestésica**

- **Arrastar e soltar** blocos fisicamente
- **Manipulação tátil** da interface
- **Movimento visual** dos elementos do jogo

### **Linguística**

- **Blocos em português** acessível
- **Narrativas** conectadas à realidade
- **Explicação verbal** das estratégias

## **Aprendizagem Significativa Contextualizada**

O Decoda conecta conhecimento prévio com novos conceitos de forma **culturalmente relevante**:

### **Ancoragem Cultural**

| **Experiência Prévia** | **Conceito Novo** | **Jogo** | **Dimensão Social** |
| --- | --- | --- | --- |
| <i class="fas fa-puzzle-piece"></i> Organizar objetos e lembrar “onde fica cada coisa” | Variáveis, atribuição | Quebra-cabeças | Organização do cotidiano |
| <i class="fas fa-ring"></i> Rotinas de limpeza e aspiradores robô no dia a dia | Loops, sequências | Aspirador | Cuidado com o espaço vivido |
| <i class="fas fa-robot"></i> Aparelhos e sistemas que mudam de comportamento conforme o contexto | Estados, lógica | Autômato | Automação e mundo do trabalho |
| <i class="fas fa-traffic-light"></i> Semáforos da rua e regras de espera / passagem | Sequências, condições | Semáforo | Mobilidade urbana |
| <i class="fa-solid fa-draw-polygon"></i> Desenho manual, plantas baixas e formas no caderno | Geometria, arte | Tartaruga | Arte como expressão |
| <i class="fas fa-circle"></i> Jogos em grade, sorteios e adivinhar posições com poucas pistas | Matriz, aleatoriedade | Toupeira | Decidir sob incerteza |
| <i class="fa-solid fa-unlock-keyhole"></i> Senhas, bilhetes secretos e mensagens só para quem sabe o código | Criptografia, repetição | Cripto | Privacidade e segurança digital |

### **Zona de Desenvolvimento Próximo (Vygotsky + Freire)**

1. **<i class="fas fa-user"></i> Nível Atual**: O que o estudante já conhece do mundo
2. **<i class="fas fa-users"></i> Mediação Social**: Diálogo com pares e educador
3. **<i class="fas fa-bullseye"></i> Objetivo**: Nova consciência a ser desenvolvida
4. **<i class="fas fa-fist-raised"></i> Autonomia**: Estudante transforma sua realidade

## **Psicologia dos Blocos Visuais**

### **Design Pedagógico Consciente**

#### **Cores dos Blocos**

| **Cor** | **Amostra visual** | **Significado pedagógico** |
| --- | --- | --- |
| Azul | <span style={{display: "inline-block", width: "14px", height: "14px", background: "#3b82f6", borderRadius: "50%", border: "1px solid #1e3a8a"}}></span> | Movimentos e ações |
| Verde | <span style={{display: "inline-block", width: "14px", height: "14px", background: "#22c55e", borderRadius: "50%", border: "1px solid #166534"}}></span> | Lógica e decisões |
| Amarelo | <span style={{display: "inline-block", width: "14px", height: "14px", background: "#facc15", borderRadius: "50%", border: "1px solid #a16207"}}></span> | Eventos e gatilhos |
| Vermelho | <span style={{display: "inline-block", width: "14px", height: "14px", background: "#ef4444", borderRadius: "50%", border: "1px solid #991b1b"}}></span> | Controles e limites |
| Roxo | <span style={{display: "inline-block", width: "14px", height: "14px", background: "#a855f7", borderRadius: "50%", border: "1px solid #6b21a8"}}></span> | Variáveis e dados |

#### **Formas com Significado Funcional**

- **<i class="fas fa-circle"></i> Círculos**: Início/fim de processos
- **<i class="fas fa-square"></i> Retângulos**: Ações concretas
- **<i class="fas fa-diamond"></i> Losangos**: Pontos de decisão
- **<i class="fa-solid fa-hexagon"></i> Hexágonos**: Entradas e sensores

### **Carga Cognitiva Consciente**

Os blocos reduzem sobrecarga mental para **focar na reflexão crítica**:

#### **Liberação Cognitiva**

- **<i class="fas fa-bolt"></i> Menos memória**: Energia mental para problematizar
- **<i class="fas fa-bullseye"></i> Foco social**: Concentração em questões relevantes
- **<i class="fas fa-sync"></i> Feedback rápido**: Validação imediata das hipóteses
- **<i class="fas fa-fire"></i> Motivação**: Resultados visuais engajam na aprendizagem

## **Taxonomia de Freire Aplicada**

Progressão pedagógica baseada na **Pedagogia do Oprimido**:

### **Níveis de Conscientização**

1. **<i class="fas fa-seedling"></i> Consciência Ingênua** (Fase 1)

   - Usa blocos sem questionar
   - Segue instruções mecanicamente

2. **<i class="fas fa-question"></i> Consciência Crítica** (Fase 2-3)

   - Questiona "por que funciona assim?"
   - Compara diferentes estratégias

3. **<i class="fas fa-lightbulb"></i> Consciência Mágica** (Evitar)

   - Acredita que tecnologia resolve tudo
   - Não vê limitações sociais

4. **<i class="fas fa-fist-raised"></i> Consciência Revolucionária** (Fase 4-5)
   - Vê programação como ferramenta de transformação
   - Cria soluções para problemas comunitários

## **Avaliação Libertadora**

Monitoramento que promove conscientização:

### **Indicadores de Transformação**

- **<i class="fas fa-clock"></i> Tempo de reflexão**: Qualidade do pensamento crítico
- **<i class="fas fa-comments"></i> Diálogo**: Participação nas discussões coletivas
- **<i class="fas fa-lightbulb"></i> Problematização**: Capacidade de questionar
- **<i class="fas fa-hands-helping"></i> Solidariedade**: Colaboração e apoio mútuo

### **Feedback Dialógico**

- **<i class="fas fa-check-circle"></i> Valorização**: Reconhecimento do conhecimento prévio
- **<i class="fas fa-question-circle"></i> Problematização**: Perguntas que geram reflexão
- **<i class="fas fa-arrow-up"></i> Desafio**: Estímulo para superação coletiva
- **<i class="fas fa-redo"></i> Praxis**: Ciclo ação-reflexão-nova ação

---

**<i class="fas fa-search"></i> Próximo**: Explore [**Os Quatro Fundamentos**](./quatro-fundamentos/condicionais) — condicionais, loops, funções e procedural — para aprofundar a programação visual a partir desta base pedagógica!