Skip to content

Latest commit

 

History

History
194 lines (168 loc) · 5.77 KB

File metadata and controls

194 lines (168 loc) · 5.77 KB

APM Counter - Roadmap de Desarrollo

🎯 Objetivo

Crear un contador de acciones por minuto (APM) para Windows que monitoree clicks de mouse y teclas presionadas, con overlay para videojuegos y dashboard completo.

🛠️ Stack Tecnológico

  • Backend: Rust (Tauri)
  • Frontend: React + TypeScript + Tailwind CSS
  • Monitoreo: Windows API (GetAsyncKeyState, SetWindowsHookEx)
  • UI: Tauri + WebView nativo
  • Build: Tauri CLI

📋 Fases de Desarrollo

Fase 1: Configuración Base (Día 1)

  • Eliminar proyecto Flutter anterior
  • Instalar Rust y Tauri CLI
  • Crear proyecto Tauri base
  • Configurar estructura de carpetas
  • Setup básico de React + TypeScript
  • Configurar Tailwind CSS

Fase 2: Core Backend - Monitoreo (Día 1-2)

  • Implementar hook de teclado en Rust
  • Implementar hook de mouse en Rust
  • Crear sistema de conteo de acciones
  • Implementar cálculo de APM en tiempo real
  • Sistema de eventos entre Rust y Frontend

Fase 3: Dashboard Principal (Día 2-3)

  • Diseño de interfaz principal
  • Componente de APM en tiempo real
  • Gráfico de historial de APM
  • Estadísticas detalladas (clicks vs teclas)
  • Botones de control (start/stop/reset)

Fase 4: System Tray (Día 3)

  • Implementar system tray en Rust
  • Menú contextual del tray
  • Minimizar a tray
  • Mostrar/ocultar ventana principal
  • Indicador visual de estado en tray

Fase 5: Overlay para Juegos (Día 4)

  • Ventana overlay transparente
  • Posicionamiento configurable
  • Mostrar APM actual en overlay
  • Overlay siempre visible (topmost)
  • Configuración de opacidad y tamaño

Fase 6: Configuraciones (Día 4-5)

  • Panel de configuraciones
  • Configurar hotkeys
  • Configurar overlay (posición, tamaño, opacidad)
  • Configurar filtros de aplicaciones
  • Guardar configuraciones en archivo

Fase 7: Características Avanzadas (Día 5-6)

  • Historial de sesiones
  • Exportar estadísticas
  • Perfiles de usuario
  • Detección automática de juegos
  • Estadísticas por aplicación

Fase 8: Optimización y Pulido (Día 6-7)

  • Optimizar rendimiento
  • Reducir uso de CPU/RAM
  • Mejorar UI/UX
  • Testing exhaustivo
  • Preparar para distribución

🎨 Diseño de UI

Dashboard Principal

┌─────────────────────────────────────┐
│ APM Counter                    [_][□][×]│
├─────────────────────────────────────┤
│                                     │
│        APM ACTUAL: 245              │
│                                     │
│  ┌─────────────────────────────┐    │
│  │     Gráfico APM             │    │
│  │  ▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄   │    │
│  └─────────────────────────────┘    │
│                                     │
│  Clicks: 1,234  │  Teclas: 2,456   │
│  Tiempo: 05:23  │  Promedio: 198   │
│                                     │
│  [Start] [Stop] [Reset] [Settings]  │
└─────────────────────────────────────┘

Overlay

┌─────────────┐
│ APM: 245    │
│ ⌨️ 156 🖱️ 89 │
└─────────────┘

📁 Estructura del Proyecto

apm-counter/
├── src-tauri/           # Backend Rust
│   ├── src/
│   │   ├── main.rs      # Punto de entrada
│   │   ├── input_monitor.rs  # Monitoreo de input
│   │   ├── apm_calculator.rs # Cálculos APM
│   │   ├── tray.rs      # System tray
│   │   └── overlay.rs   # Ventana overlay
│   ├── Cargo.toml
│   └── tauri.conf.json
├── src/                 # Frontend React
│   ├── components/
│   │   ├── Dashboard.tsx
│   │   ├── APMDisplay.tsx
│   │   ├── Chart.tsx
│   │   ├── Settings.tsx
│   │   └── Overlay.tsx
│   ├── hooks/
│   │   └── useAPM.ts
│   ├── utils/
│   └── App.tsx
├── public/
├── package.json
└── README.md

🔧 Dependencias Principales

Rust (Cargo.toml)

[dependencies]
tauri = { version = "1.0", features = ["api-all"] }
serde = { version = "1.0", features = ["derive"] }
tokio = { version = "1", features = ["full"] }
winapi = "0.3"  # Para hooks de Windows
tray-icon = "0.8"  # System tray

Frontend (package.json)

{
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "@tauri-apps/api": "^1.2.0",
    "recharts": "^2.5.0",
    "tailwindcss": "^3.2.0"
  }
}

🚀 Comandos de Desarrollo

# Instalar Tauri CLI
cargo install tauri-cli

# Crear proyecto
cargo tauri init

# Desarrollo
cargo tauri dev

# Build para producción
cargo tauri build

📊 Métricas de Éxito

  • APM calculado correctamente
  • Overlay funcional en juegos
  • Uso de RAM < 50MB
  • Uso de CPU < 2%
  • Ejecutable final < 20MB
  • Tiempo de inicio < 2 segundos

🎮 Casos de Uso

  1. Gamer Casual: Ver APM mientras juega
  2. Gamer Competitivo: Analizar rendimiento y mejorar
  3. Streamer: Mostrar APM en stream
  4. Desarrollador: Monitorear productividad

🔄 Próximos Pasos

  1. Configurar entorno de desarrollo
  2. Crear proyecto Tauri base
  3. Implementar monitoreo básico
  4. Crear dashboard mínimo viable
  5. Iterar y mejorar

Fecha de inicio: $(date) Estimación: 7 días Prioridad: Alta