Caso
NortePay Dashboard
Dashboard de gestión financiera
2026
Diseño y desarrollo de producto
![[object Object]](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fhero.2h2680kdxsng9.png&w=3840&q=75)
Descripción general
NortePay Dashboard es un producto ficticio de gestión financiera diseñado para freelancers, consultores y pequeños negocios en México que necesitan una forma sencilla de entender sus ingresos, gastos, facturas, clientes y flujo de efectivo.
A diferencia de muchos conceptos de dashboard creados únicamente como ejercicios visuales, este proyecto fue diseñado alrededor de un modelo financiero pequeño pero funcional. Las métricas, estados de facturas, datos de clientes, gastos y flujo de efectivo están conectados para que la interfaz se comporte como un producto real y no como una colección de pantallas de ejemplo.
El proyecto explora cómo reducir la información financiera a un conjunto claro de métricas útiles y accionables, manteniendo una experiencia accesible para usuarios que no necesitan —ni quieren— una plataforma contable completa.
Proyecto
Producto SaaS
Público
Freelancers, consultores y pequeños negocios en México
Mi rol fue diseñar y desarrollar la experiencia del dashboard de NortePay, definiendo su arquitectura de información, métricas financieras, patrones de interacción, sistema visual e implementación frontend.
Desarrollado con React, TypeScript, Vite, SCSS y Recharts, con componentes reutilizables, layouts responsive, vistas basadas en datos y una arquitectura frontend modular.
![[object Object]](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Finvoices.3d3guhrb6bxlq.png&w=3840&q=75)
La dirección visual utiliza un sistema visual financiero contenido, construido alrededor de superficies neutras y cálidas, tipografía azul marino profundo, acentos ciruela, colores semánticos para los distintos estados, visualizaciones de datos compactas y espacios generosos para hacer que la información financiera densa se sienta clara y fácil de recorrer.
![[object Object]](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdark.0jew8xpsx76m-.png&w=3840&q=75)
![[object Object]](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmobile.22nnc0s6aklk1.png&w=3840&q=75)
![[object Object]](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdesktop.35qs_li80_mz1.png&w=3840&q=75)
Resultado
El resultado final es un prototipo funcional de producto frontend que demuestra pensamiento de producto más allá del diseño de interfaces estáticas. NortePay Dashboard combina lógica financiera, jerarquía de información, visualización de datos, componentes reutilizables, tablas, filtros, formularios, comportamiento responsive y patrones de interacción accesibles dentro de una experiencia SaaS coherente.