Saltar al contenido
TV viewHablemos
ES
Todos los trabajos

Diseño de app web y panel

ÉOS Energia. Un panel, leído desde tres lados de la energía solar

Una plataforma en portugués de energía solar compartida, con una misma estructura de panel adaptada para administradores, productores y consumidores, más el menú móvil del sitio.

Mi papel
Flujos de producto y diseño de interfaz
Estado del proyecto
Diseño de interfaz · archivo de Figma
Un panel solar en 3D con el sol deslizándose por sus celdas.
Un objeto 3D hecho para este mural.

Pantallas del archivo de diseño original en Figma, con datos de ejemplo.

Mi contribución

ÉOS Energia es una plataforma en portugués para plantas solares, con la idea de energía compartida en su propio logo. El mismo panel existe para tres roles: Administrador, Produtor y Consumidor.

El archivo de diseño también incluye perfil, documentos, facturas, ventanas superpuestas de gráfico y de contrato, y formularios de inicio de sesión y de registro previo. Las cifras de estas pantallas son datos de ejemplo.

Un desplazamiento por el diseño: la landing page, de la promesa a los números.
Logo de ÉOS Energia con el lema Energia compartilhada sobre blanco, junto a fotos diagonales de paneles solares y cielo y un panel de administrador enmarcado.
El panel de administrador con la marca ÉOS Energia y su ambientación solar.

La misma estructura, tres puntos de partida

Las tres vistas comparten un menú a la izquierda, un resumen general en el centro y una columna de actualizaciones a la derecha. Con esa estructura fija, la diferencia entre los roles se nota en lo que la llena: el filtro superior es por productor para el administrador y por planta para los otros dos, y el menú cambia según lo que puede hacer cada rol.

El administrador tiene Usuários en Gerenciar. El productor y el consumidor tienen Faturas, además de Contrato y Documentos en Arquivos, así que la documentación de la cuenta queda junto a los números.

Panel de administrador con un filtro por productor, bloques de ingresos, crédito de CO², producción y consumo, un medidor de ocupación de la planta, un gráfico de consumo y producción y una columna de actualizaciones a la derecha.
La vista del administrador filtra por productor y agrega la gestión de usuarios.

Qué lee primero cada rol

Para el administrador y el productor, el primer bloque reúne ingresos, crédito de CO², producción y consumo junto a un medidor de ocupación de la planta, con el consumo y la producción comparados debajo. Un bloque amarillo marca la cifra que se lee primero, y los demás quedan pálidos.

La vista del consumidor cambia los ingresos por el ahorro y la reducción de CO², quita el medidor y agrega una tabla de plantas con temperatura, producción y una etiqueta de estado como Em operação o Em construção. La estructura sigue siendo familiar, pero la pregunta pasa de cuánto ganó la planta a cuánto ahorró la cuenta y cómo van sus plantas.

Panel de consumidor con bloques de ahorro, reducción de CO² y consumo, el mismo gráfico y una tabla de plantas con etiquetas de estado de colores.
La vista del consumidor muestra el ahorro y una tabla de plantas con su estado.
Panel de productor con los mismos bloques y el mismo medidor que la vista de administrador, un filtro por planta y un menú con Faturas, Contrato y Documentos.
La vista del productor mantiene el layout y agrega al menú facturas, contrato y documentos.

El sitio alrededor de la plataforma

El archivo también guarda varias versiones de la landing page. En el celular, su menú separa los enlaces principales de un grupo Mais y termina con Falar com um consultor como botón amarillo y un enlace de texto para quienes ya tienen cuenta.

Menú blanco en el celular con el logo de ÉOS Energia, un ícono de cerrar, tres enlaces principales, un grupo Mais con cinco enlaces, un botón amarillo de consultor y un enlace de texto.
El menú del sitio en el celular termina con un botón amarillo para hablar con un consultor.