JohannVelazquez
633d05e330
- Estructura nueva: README maestro, bitacora/ (REGISTRO, PENDIENTES, plantillas), propuesta/, fuentes/; material superado a _archivado/ - Propuesta v1.0: MVP BIND-first con emisión asistida MXN/USD (dry-run + confirmación, timbra PAC de BIND), 112-136 h / $67,200-$81,600 + IVA, stack .NET 10 + EF Core + Angular 21 + PostgreSQL 17 sobre Azure - Bitácora: historial de correos + 2 llamadas (incl. revisión 4-jun) y pendientes - Prototipo y diagrama actualizados a v1.0; precios de Azure verificados - Archivo ajeno (proyecto EOS) retirado del repo Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
316 lines
13 KiB
HTML
316 lines
13 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="es">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<title>Balam — Flujo HOY vs DESPUÉS del MVP</title>
|
||
<style>
|
||
:root{
|
||
--bg:#0f172a;
|
||
--text:#e2e8f0; --muted:#94a3b8;
|
||
--bad:#ef4444; --bad-bg:rgba(239,68,68,.12);
|
||
--ok:#10b981; --ok-bg:rgba(16,185,129,.12);
|
||
--warn:#f59e0b;
|
||
--info:#3b82f6;
|
||
--accent:#a78bfa;
|
||
--border:#475569;
|
||
}
|
||
*{box-sizing:border-box}
|
||
body{
|
||
margin:0; padding:32px;
|
||
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
|
||
background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 100%);
|
||
color:var(--text); min-height:100vh;
|
||
}
|
||
h1{margin:0 0 4px; font-size:28px}
|
||
.subtitle{color:var(--muted); margin-bottom:24px; font-size:14px}
|
||
|
||
.legend{
|
||
display:flex; gap:16px; flex-wrap:wrap; margin-bottom:24px;
|
||
padding:10px 14px; background:rgba(0,0,0,.25); border-radius:8px;
|
||
font-size:12px;
|
||
}
|
||
.legend-item{display:flex; align-items:center; gap:6px}
|
||
.icon{font-size:14px}
|
||
|
||
.columns{display:grid; grid-template-columns:1fr 1fr; gap:24px}
|
||
@media (max-width:1100px){ .columns{grid-template-columns:1fr} }
|
||
|
||
.panel{
|
||
background:#1e293b; border:1px solid var(--border);
|
||
border-radius:14px; padding:20px;
|
||
box-shadow:0 4px 16px rgba(0,0,0,.3);
|
||
}
|
||
.panel.before{border-top:4px solid var(--bad)}
|
||
.panel.after{border-top:4px solid var(--ok)}
|
||
.panel h2{
|
||
margin:0 0 4px; font-size:18px; display:flex; align-items:center; gap:10px;
|
||
}
|
||
.panel .tag{
|
||
font-size:11px; font-weight:700; padding:3px 10px; border-radius:10px;
|
||
text-transform:uppercase; letter-spacing:1px;
|
||
}
|
||
.tag.bad{background:var(--bad-bg); color:#fca5a5}
|
||
.tag.ok{background:var(--ok-bg); color:#6ee7b7}
|
||
.panel .lead{color:var(--muted); font-size:13px; margin-bottom:16px}
|
||
|
||
/* flow */
|
||
.flow{display:flex; flex-direction:column; gap:6px}
|
||
.step{
|
||
background:#334155; border:1px solid var(--border); border-radius:10px;
|
||
padding:10px 14px; font-size:13px; line-height:1.4;
|
||
display:flex; gap:10px; align-items:flex-start;
|
||
}
|
||
.step .num{
|
||
flex-shrink:0; width:24px; height:24px; border-radius:50%;
|
||
background:#475569; color:#fff; font-weight:700; font-size:12px;
|
||
display:flex; align-items:center; justify-content:center;
|
||
}
|
||
.step .body{flex:1}
|
||
.step .who{display:block; font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; margin-bottom:2px}
|
||
.step .what{color:var(--text)}
|
||
.step .note{display:block; font-size:11px; color:var(--muted); margin-top:4px; font-style:italic}
|
||
|
||
.step.manual .num{background:var(--bad)}
|
||
.step.manual{border-left:3px solid var(--bad)}
|
||
.step.auto .num{background:var(--ok)}
|
||
.step.auto{border-left:3px solid var(--ok)}
|
||
.step.semi .num{background:var(--warn)}
|
||
.step.semi{border-left:3px solid var(--warn)}
|
||
|
||
.arrow-down{
|
||
text-align:center; color:var(--muted); font-size:18px; line-height:1;
|
||
margin:-2px 0;
|
||
}
|
||
|
||
/* metrics */
|
||
.metrics{
|
||
display:grid; grid-template-columns:repeat(4,1fr); gap:12px;
|
||
margin-top:24px;
|
||
}
|
||
.metric{
|
||
background:#1e293b; border:1px solid var(--border); border-radius:12px;
|
||
padding:14px; text-align:center;
|
||
}
|
||
.metric .label{font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:1px}
|
||
.metric .before-val{font-size:18px; color:#fca5a5; margin-top:4px; text-decoration:line-through; opacity:.7}
|
||
.metric .arrow{font-size:14px; color:var(--accent); margin:2px 0}
|
||
.metric .after-val{font-size:20px; color:#6ee7b7; font-weight:700}
|
||
|
||
/* pain & gain box */
|
||
.summary{
|
||
display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:24px;
|
||
}
|
||
.summary .box{
|
||
border-radius:12px; padding:16px;
|
||
}
|
||
.summary .pain{background:var(--bad-bg); border-left:4px solid var(--bad)}
|
||
.summary .gain{background:var(--ok-bg); border-left:4px solid var(--ok)}
|
||
.summary h3{margin:0 0 10px; font-size:14px}
|
||
.summary ul{margin:0; padding-left:20px; font-size:13px; line-height:1.6; color:var(--text)}
|
||
|
||
@media (max-width:700px){
|
||
.metrics{grid-template-columns:1fr 1fr}
|
||
.summary{grid-template-columns:1fr}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<h1>Balam · Flujo Financiero</h1>
|
||
<div class="subtitle">Cómo opera HOY vs cómo operará DESPUÉS del MVP</div>
|
||
|
||
<div class="legend">
|
||
<div class="legend-item"><span class="icon">🔴</span> Paso manual / handoff humano</div>
|
||
<div class="legend-item"><span class="icon">🟡</span> Semi-automático (humano valida)</div>
|
||
<div class="legend-item"><span class="icon">🟢</span> Automático</div>
|
||
</div>
|
||
|
||
<div class="columns">
|
||
|
||
<!-- ================= HOY ================= -->
|
||
<div class="panel before">
|
||
<h2>🕰️ HOY <span class="tag bad">Manual y desconectado</span></h2>
|
||
<div class="lead">Cada paso depende de una persona moviendo datos entre sistemas que no se hablan.</div>
|
||
|
||
<div class="flow">
|
||
|
||
<div class="step manual"><div class="num">1</div><div class="body">
|
||
<span class="who">Jira · Operaciones</span>
|
||
<span class="what">Registro de horas por colaborador y cliente.</span>
|
||
<span class="note">Sin visibilidad consolidada para facturación.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">2</div><div class="body">
|
||
<span class="who">BUK · RH</span>
|
||
<span class="what">Nómina aprobada de los 45 colaboradores + 5 freelancers.</span>
|
||
<span class="note">Sin trigger automático hacia facturación.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">3</div><div class="body">
|
||
<span class="who">Persona · Admin</span>
|
||
<span class="what">Genera factura manualmente en BIND ERP por cada cliente (~50/mes).</span>
|
||
<span class="note">Riesgo de error en monto, RFC, concepto.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">4</div><div class="body">
|
||
<span class="who">Persona · Cobranza</span>
|
||
<span class="what">Recordatorios manuales por correo a cada cliente vencido.</span>
|
||
<span class="note">Riesgo de enviar accidentalmente a ACUNTIA / Top 3 → daño de relación.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">5</div><div class="body">
|
||
<span class="who">Persona · Finanzas</span>
|
||
<span class="what">Descarga 3 PDFs bancarios (2 MX + IBC Texas) desde portales web.</span>
|
||
<span class="note">Producción únicamente, sin API.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">6</div><div class="body">
|
||
<span class="who">Persona · Finanzas</span>
|
||
<span class="what">Concilia movimiento por movimiento contra facturas en Excel.</span>
|
||
<span class="note">Horas de trabajo / mes · errores recurrentes.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">7</div><div class="body">
|
||
<span class="who">Contador</span>
|
||
<span class="what">Captura asientos contables en BIND a partir del Excel conciliado.</span>
|
||
<span class="note">Retrabajo si la conciliación previa tuvo errores.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">8</div><div class="body">
|
||
<span class="who">Dirección</span>
|
||
<span class="what">Pide reporte de CxC al área. Llega tarde y desactualizado.</span>
|
||
<span class="note">Sin visibilidad en tiempo real.</span>
|
||
</div></div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ================= DESPUÉS ================= -->
|
||
<div class="panel after">
|
||
<h2>🚀 DESPUÉS del MVP <span class="tag ok">Orquestado y visible</span></h2>
|
||
<div class="lead">La plataforma absorbe los pasos repetitivos. Las personas solo deciden en excepciones.</div>
|
||
|
||
<div class="flow">
|
||
|
||
<div class="step semi"><div class="num">1</div><div class="body">
|
||
<span class="who">BIND ERP (API) → Plataforma</span>
|
||
<span class="what">Sync automático de facturas, clientes y catálogo.</span>
|
||
<span class="note">BIND sigue siendo fuente de verdad y emite CFDI.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step auto"><div class="num">2</div><div class="body">
|
||
<span class="who">Plataforma · Dashboard</span>
|
||
<span class="what">CxC en tiempo real: vencidas, próximas, por cliente, multimoneda (MXN/USD).</span>
|
||
<span class="note">Dirección entra al dashboard cuando quiera, sin pedir reporte.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step auto"><div class="num">3</div><div class="body">
|
||
<span class="who">Plataforma · Cobranza</span>
|
||
<span class="what">Recordatorios automáticos por correo 5 días antes del vencimiento.</span>
|
||
<span class="note"><strong>Lista blanca dura:</strong> ACUNTIA + Top 3 NUNCA reciben automático.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step auto"><div class="num">4</div><div class="body">
|
||
<span class="who">Plataforma · Pago (opcional)</span>
|
||
<span class="what">Link de pago Stripe en el correo → tarjeta o SPEI.</span>
|
||
<span class="note">Webhook marca factura como pagada al recibir confirmación.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step manual"><div class="num">5</div><div class="body">
|
||
<span class="who">Persona · Finanzas (mínimo)</span>
|
||
<span class="what">Sube 3 PDFs bancarios a la plataforma (mensual).</span>
|
||
<span class="note">Único paso manual que sigue. Se elimina en Fase 2 con Belvo/Plaid.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step auto"><div class="num">6</div><div class="body">
|
||
<span class="who">Plataforma · IA (Claude)</span>
|
||
<span class="what">Extrae movimientos de los PDFs y valida totales.</span>
|
||
<span class="note">Una pipeline por banco · datos no se usan para entrenamiento.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step semi"><div class="num">7</div><div class="body">
|
||
<span class="who">Plataforma · Motor conciliación</span>
|
||
<span class="what">Match automático monto+referencia+fecha. No-match → cola de revisión humana.</span>
|
||
<span class="note">Persona solo toca las excepciones, no todo.</span>
|
||
</div></div>
|
||
<div class="arrow-down">▼</div>
|
||
|
||
<div class="step semi"><div class="num">8</div><div class="body">
|
||
<span class="who">Contador · BIND</span>
|
||
<span class="what">Sube a BIND el export Excel ya conciliado y clasificado.</span>
|
||
<span class="note">Asientos automáticos contra BIND API → Fase 2.</span>
|
||
</div></div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<!-- ================= MÉTRICAS ================= -->
|
||
<div class="metrics">
|
||
<div class="metric">
|
||
<div class="label">Pasos manuales</div>
|
||
<div class="before-val">8 de 8</div>
|
||
<div class="arrow">↓</div>
|
||
<div class="after-val">2 de 8</div>
|
||
</div>
|
||
<div class="metric">
|
||
<div class="label">Tiempo conciliación bancaria</div>
|
||
<div class="before-val">Horas / mes</div>
|
||
<div class="arrow">↓</div>
|
||
<div class="after-val">−60% mín.</div>
|
||
</div>
|
||
<div class="metric">
|
||
<div class="label">Errores contables</div>
|
||
<div class="before-val">Recurrentes</div>
|
||
<div class="arrow">↓</div>
|
||
<div class="after-val">−70% mín.</div>
|
||
</div>
|
||
<div class="metric">
|
||
<div class="label">Visibilidad para dirección</div>
|
||
<div class="before-val">Reporte pedido</div>
|
||
<div class="arrow">↓</div>
|
||
<div class="after-val">Tiempo real</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ================= DOLOR / GANANCIA ================= -->
|
||
<div class="summary">
|
||
<div class="box pain">
|
||
<h3>🔴 Dolor que se elimina</h3>
|
||
<ul>
|
||
<li>Riesgo de enviar recordatorio a ACUNTIA o Top 3 por error humano.</li>
|
||
<li>Horas perdidas conciliando 3 PDFs bancarios a mano.</li>
|
||
<li>Errores contables que llegan tarde al contador.</li>
|
||
<li>Dirección sin visibilidad real del CxC del día.</li>
|
||
<li>Cobranza dependiendo de que alguien recuerde mandar el correo.</li>
|
||
</ul>
|
||
</div>
|
||
<div class="box gain">
|
||
<h3>🟢 Lo que se gana</h3>
|
||
<ul>
|
||
<li>Cobro más rápido con link Stripe directo en el correo.</li>
|
||
<li>Conciliación automática + cola humana solo para excepciones.</li>
|
||
<li>Dashboard en tiempo real accesible para CEO/CFO/CTO.</li>
|
||
<li>Audit log completo de quién hizo qué, cuándo.</li>
|
||
<li>Base preparada para Fase 2: Jira→BUK→Factura end-to-end.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
</body>
|
||
</html>
|