Diseño de interfacesConcepto
Tally Panel para fundadores
Un prototipo de panel interactivo: estados serenos, tablas de datos reales y un flujo pensado para probarse.
Por dentro
La vista de la mañana.
Cuatro KPI, una tabla con pestañas y los minigráficos que muestran la tendencia sin gritarla.
Resumen
Tally es un concepto de panel para fundadores: la única pantalla que miras con el primer café de la mañana para saber si el negocio está sano. No un muro de gráficos, sino una lectura serena.
El brief
- Problema
- Los primeros paneles responden a lo que es fácil de consultar, no a lo que pregunta el fundador.
- Restricción
- Tiene que poder probarse con usuarios antes de escribir una sola línea de código.
- Solución
- Un prototipo interactivo construido a partir de cuatro preguntas de la mañana, con cada estado diseñado.
La mayoría de los paneles en fase inicial los construyen ingenieros que resuelven lo que es fácil de consultar. Tally se construye al revés, a partir de las preguntas que un fundador se hace de verdad a las 8 de la mañana: ¿estamos creciendo?, ¿estamos perdiendo a alguien?, ¿qué cambió ayer?, ¿qué necesita de mí hoy?
Cuatro tarjetas de KPI en la parte superior, cada una con un minigráfico y una variación real. Debajo, una barra de pestañas (Hoy / Semana / Mes) que no recarga la página. Y más abajo, una tabla: los diez eventos más recientes, ordenables, con un estado vacío sereno cuando no hay nada que leer.
El prototipo es interactivo de principio a fin. Los filtros funcionan, las pestañas cambian el contenido, los estados vacíos están diseñados en lugar de omitidos y los esqueletos de carga coinciden con el diseño final, sin saltos cuando termina de cargar.
Sobre este concepto
Este es un proyecto conceptual para un cliente ficticio. Muestra el proceso y el estándar que aplicamos en nuestros proyectos con clientes.
Enfoque
Sereno, real, comprobable.
Preguntas, no gráficos
Cada vista responde a una pregunta que el fundador hizo en voz alta. Lo que no responde a ninguna no está en pantalla.
Primero, los estados vacíos
Diseñamos los estados vacíos, de carga y de error antes que el flujo ideal. Los días aburridos son la mayoría.
Interactivo, no bonito
El prototipo recorre tres flujos reales de principio a fin. Las partes interesadas hacen clic; no entrecierran los ojos ante pantallas estáticas.
Qué incluye
Listo para pruebas con usuarios.
Las cifras corresponden al brief conceptual.
Pantallas
18pantallas de alta fidelidad
Inicio, vistas de detalle, ajustes y los tres flujos principales, diseñados con la fidelidad de una entrega a desarrollo.
Flujos
3flujos interactivos
Nuevo registro, análisis de bajas y resumen semanal. Cada uno es un recorrido real por el prototipo.
Estados
Vacío, carga y error
Cada vista, cada estado. Los esqueletos coinciden con el diseño final, así que nada salta cuando llegan los datos.
Entrega
Tokens y especificaciones
Tokens de diseño, variantes de componentes y especificaciones por pantalla, listos para ingeniería.
Herramientas
- Figma
- Variables
- Auto Layout
- Prototipo
- Tokens Studio
Pruébalo tú mismo
Funciona de verdad. No es una imagen.
Abre la demo y úsala como lo haría un visitante o un cliente. Cada toque y cada pestaña funcionan.