Mockups de Circuitos Legados

Uma habilidade para criar mockups de circuitos em protoboards e diagramas visuais para projetos de computação retrô e eletrônica. Esta habilidade utiliza mecanismos de desenho do HTML5 Canvas para renderizar layouts de circuitos interativos com componentes vintage como o microprocessador 6502, CIs temporizadores 555, EEPROMs e portas lógicas da série 7400.

Quando Usar Esta Habilidade

• O usuário pede para "criar um layout de protoboard" ou "simular um circuito"
• O usuário quer visualizar a colocação de componentes em uma protoboard
• O usuário precisa de uma referência visual para construir um computador 6502
• O usuário pede para "desenhar um circuito" ou "diagramar eletrônica"
• O usuário quer criar visuais educacionais de eletrônica
• O usuário menciona tutoriais de Ben Eater ou projetos de computação retrô
• O usuário pede para simular circuitos temporizadores 555 ou projetos de LED
• O usuário precisa visualizar conexões de fios entre componentes

Pré-requisitos

• Compreensão dos pinouts dos componentes a partir de arquivos de referência incluídos
• Conhecimento das convenções de layout de protoboard (linhas, colunas, trilhos de alimentação)

Componentes Suportados

Microprocessadores e Memória

Lógica e Temporizadores ICs

Componentes Passivos e Ativos

Sistema de Grade

// Standard breadboard grid: 20px spacing
const gridSize = 20;
const cellX = Math.floor(x / gridSize) * gridSize;
const cellY = Math.floor(y / gridSize) * gridSize;

Padrão de Renderização de Componentes

// All components follow this structure:
{
  type: 'component-type',
  x: gridX,
  y: gridY,
  width: componentWidth,
  height: componentHeight,
  rotation: 0,  // 0, 90, 180, 270
  properties: { /* component-specific data */ }
}

Conexões de Fios

// Wire connection format:
{
  start: { x: startX, y: startY },
  end: { x: endX, y: endY },
  color: '#ff0000'  // Wire color coding
}

Fluxos de Trabalho Passo a Passo

Criando um Mockup Básico de Circuito LED

1. Definir dimensões e grade da protoboard
2. Colocar conexões de trilhos de alimentação (+5V e GND)
3. Adicionar componente LED com orientação de ânodo/cátodo
4. Colocar resistor de limitação de corrente
5. Desenhar conexões de fios entre os componentes
6. Adicionar rótulos e anotações

Criando um Circuito Temporizador 555

1. Colocar o CI NE555 na protoboard (pinos 1-4 à esquerda, 5-8 à direita)
2. Conectar o pino 1 (GND) ao trilho de terra
3. Conectar o pino 8 (Vcc) ao trilho de alimentação
4. Adicionar resistores e capacitores de temporização
5. Conectar as conexões de trigger e threshold
6. Conectar a saída a um LED ou outra carga

Criando um Layout de Microprocessador 6502

1. Colocar o W65C02S centralizado na protoboard
2. Adicionar EEPROM 28C256 para armazenamento de programa
3. Colocar o W65C22 VIA para I/O
4. Adicionar lógica da série 7400 para decodificação de endereço
5. Conectar o barramento de endereço (A0-A15)
6. Conectar o barramento de dados (D0-D7)
7. Conectar sinais de controle (R/W, PHI2, RESB)
8. Adicionar botão de reset e cristal de clock

Referência Rápida de Pinout de Componentes

Temporizador 555 (DIP de 8 pinos)

W65C02S (DIP de 40 pinos) - Pinos Chave

…