Vista de Tarjetas
La vista de tarjetas proporciona una perspectiva ejecutiva de tus campañas con tarjetas visuales que muestran la información más importante a simple vista. Perfecta para revisos rápidos y presentación a stakeholders.Características Principales
Diseño de Tarjetas
Cada campaña se representa como una tarjeta individual con:Elementos Visuales
Cabecera de Tarjeta- Nombre de la campaña como título principal
- Badge de estado con color codificado en la esquina superior derecha
- Plataformas: Iconos de las redes sociales configuradas
- Rango de fechas: Fecha de inicio y fin
- Presupuesto: Monto total (solo para campañas de ads)
- Barra de progreso: Visualización del presupuesto gastado vs. total
- Acciones rápidas: Editar, Pausar, Eliminar
- Ver detalle: Clic en la tarjeta va al detalle completo
Sistema de Colores
Las tarjetas usan colores para comunicar estado visualmente:| Estado | Color Borde | Color Fondo | Badge |
|---|---|---|---|
| Draft | Gris | Gris claro | 🔵 Draft |
| Active | Verde | Verde claro | 🟢 Active |
| Paused | Amarillo | Amarillo claro | 🟡 Paused |
| Completed | Azul | Azul claro | 🔵 Completed |
| Cancelled | Rojo | Rojo claro | 🔴 Cancelled |
Componentes de la Tarjeta
Indicadores de Plataforma
Iconos en la parte superior:- 📘 Facebook: Campaña activa en Facebook
- 📷 Instagram: Campaña activa en Instagram
- 🎵 TikTok: Campaña activa en TikTok
- 🔍 Google: Campaña activa en Google Ads
Barra de Progreso de Presupuesto
Solo para campañas de publicidad (Ads):- Barra verde: Progreso saludable (< 80%)
- Barra amarilla: Acercándose al límite (80-95%)
- Barra roja: Presupuesto agotado o excedido (> 95%)
- Monto gastado / Presupuesto total
- Porcentaje de presupuesto utilizado
- Días restantes de campaña
Rango de Fechas
Formato:DD MMM - DD MMM (ej. 15 Ene - 30 Ene)
Características:
- Fecha de inicio a la izquierda
- Fecha de fin a la derecha
- Icono de calendario pequeño
- Color gris para fechas futuras, azul para fechas pasadas
Navegación y Acciones
Ver Detalle de Campaña
Haz clic en cualquier parte de la tarjeta para ir al detalle de la campaña:- Overview completo
- Métricas detalladas
- Contenido asociado
- Configuración completa
Acciones Rápidas
Hover sobre la tarjeta muestra botones de acción:- ✏️ Editar: Modificar configuración de campaña
- ⏸️ Pausar/Reanudar: Detener o reactivar campaña
- 🗑️ Eliminar: Borrar campaña (requiere confirmación)
- 📊 Métricas: Ver analytics detallados
Organización y Ordenamiento
Ordenamiento por Defecto
Las tarjetas se organizan por:- Estado (Active primero, luego Paused, Draft, Completed)
- Fecha de inicio (más recientes primero)
- Nombre (alfabéticamente)
Filtros Disponibles
Filtro por Estado
- All: Muestra todas las campañas
- Active: Solo campañas activas
- Paused: Campañas pausadas
- Draft: Borradores sin activar
- Completed: Campañas finalizadas
Filtro por Tipo
- Orgánicas: Solo campañas de publicaciones orgánicas
- Publicidad: Solo campañas de anuncios pagados
- Todas: Muestra ambos tipos
Filtro por Plataforma
- Filtra campañas que incluyen una plataforma específica
- Selecciona una o múltiples plataformas
- Útil para revisar campañas por canal
Búsqueda
- Busca por nombre de campaña
- Filtra en tiempo real mientras escribes
- Resalta coincidencias en las tarjetas
Diseño Responsivo
Escritorio (Default)
- Grid de 3 columnas con tarjetas grandes
- Máximo detalle visible
- Ideal para análisis profundo
Tablet
- Grid de 2 columnas con tarjetas medianas
- Balance entre detalle y espacio
- Funcionalidad completa
Móvil
- Columna única con tarjetas apiladas
- Información condensada
- Scroll vertical para ver todas
Casos de Uso
Revisión Ejecutiva Rápida
- Filtra por estado “Active”
- Identifica campañas con progreso crítico (barra roja)
- Haz clic para ver detalle y tomar acción
Presentación a Stakeholders
- Filtra por tipo “Publicidad”
- Ordena por presupuesto descendente
- Presenta tarjetas con métricas clave visibles
Planificación de Nuevas Campañas
- Filtra por estado “Completed”
- Identifica periodos sin campañas activas
- Planifica nuevas campañas en espacios vacíos
Auditoría de Presupuesto
- Filtra por campañas de ads
- Ordena por porcentaje de presupuesto gastado
- Identifica campañas que necesitan ajuste
Ventajas y Desventajas
✅ Ventajas
- Visualización rápida de información clave
- Ideal para presentaciones y reportes ejecutivos
- Fácil identificación de campañas problemáticas
- Diseño intuitivo con colores e iconos
- Perfecto para stakeholders no técnicos
❌ Limitaciones
- Menos detalle que la vista de tabla
- No muestra temporalidad como la vista de calendario
- Requiere más espacio vertical que otras vistas
- Difícil comparar muchas campañas a la vez
¿Cuándo Usar Esta Vista?
Situaciones Ideales
- Presentaciones a gestión o stakeholders
- Revisión rápida del estado de todas las campañas
- Identificar campañas que necesitan atención
- Reportes visuales con métricas clave
- Revisión en dispositivos móviles o tablets
Situaciones No Ideales
- Análisis detallado de métricas (usa tabla)
- Planificación de timeline (usa calendario)
- Comparación lado a lado de múltiples campañas (usa tabla)
Tips de Uso
✅ Aprovecha los colores- Identifica rápidamente campañas con problemas por el color de la tarjeta
- Combina filtros de estado + plataforma para vistas específicas
- Revisa periódicamente campañas con barra amarilla o roja
- La tarjeta es el resumen, el detalle está en la página de campaña
Comparación de Vistas
| Vista | Enfoque Principal | Mejor Para |
|---|---|---|
| Tabla | Datos estructurados | Análisis detallado, comparación |
| Calendario | Temporalidad | Planificación, timeline |
| Tarjetas | Visual ejecutivo | Presentaciones, revisión rápida |