Desarrollo de una solución de visualización en el Proyecto Europeo Cityfied

Comunicación presentada al III Congreso Ciudades Inteligentes:

Autores

• Iker Martínez De Aguirre, Daniel Reguera, Félix Larrinaga & Ignacio Arenaza-Nuño, Investigadores, Mondragon Unibertsitatea
• Ali Vasallo & José Luis Hernández, Investigadores, CARTIF

Resumen

Como resultado de los avances técnicos enmarcados en el proyecto Europeo CITyFiED (acuerdo de subvención Nº 609129), esta comunicación presenta el desarrollo de una solución de visualización, a nivel de vivienda, que permite consultar los datos energéticos recogidos por los sistemas de monitorización del demostrador de Torrelago de forma amigable, sencilla y adaptada al tipo de usuario que acceda al sistema en cada momento. Gracias al despliegue de sensores inalámbricos para medir los consumos eléctricos y medidas ambientales, así como medidores de consumo térmico, un prototipo funcional ha sido implementado, teniendo en cuenta los requerimientos de los propietarios de las viviendas. Este desarrollo forma parte de la metodología empleada en el proyecto para impulsar la participación ciudadana tanto en el diseño como en el uso de herramientas para el ahorro energético, además de fomentar su concienciación.

Palabras clave

Soluciones HMI, Diseño Centrado en el Usuario, Eficiencia Energética, Desarrollo de Aplicaciones Web, Concienciación Ciudadana

Introducción

En la Unión Europea existen cerca de 160 millones de edificios, cuyo consumo de energía se aproxima al 40% del total en Europa, generando en torno al 36% de emisiones de CO2 (Lewis et al., 2013). Con el objeto de mejorar esta situación, la Comisión Europea, en el ámbito del Plan de Acción para la Eficiencia Energética, identifica la Eficiencia Energética en edificios como una prioridad fundamental. Los objetivos de la estrategia Europea 2020 (20% de ahorro energético, 20% de reducción en las emisiones de gases de efecto invernadero, y 20% de aumento del uso de fuentes de energía renovable), refuerzan esta prioridad. En este contexto, y alineado con el Programa de Energía del Séptimo Programa Marco, surge el proyecto de carácter demostrativo CITyFiED (RepliCable and InnovaTive Future Efficient Districts and cities, www.cityfied.eu). CITyFiED es un proyecto de I+D+I de carácter demostrativo, por lo que una parte muy importante de su desarrollo se centra en la rehabilitación de 3 demostradores localizados en tres ciudades europeas: Laguna de Duero-Valladolid (España), Soma (Turquía) y Lund (Suecia). En dichos demostradores se están aplicando e integrando distintas tecnologías para la rehabilitación de la envolvente, como son los sistemas de aislamiento térmico exterior (SATE), la mejora de los sistemas de calefacción de distrito, la integración de fuentes de energía renovables y monitorización de las intervenciones.

Junto con estas medidas de rehabilitación a nivel de distrito, a nivel de vivienda se han instalado un conjunto de sistemas que permiten medir el consumo energético individual de cada hogar y posibilitan la toma de decisiones sobre el uso de los distintos sistemas energéticos, así como evaluar su rendimiento. Así, uno de los objetivos de CITyFiED es dotar a los residentes de los distritos de soluciones de visualización por medio de las cuales puedan conocer sus consumos energéticos asociándolos a su coste económico y su impacto medioambiental. Las cuestiones que surgen a la hora de confeccionar una solución de visualización de datos son; ¿Qué información debería comunicarse a los usuarios? ¿Cómo debería presentarse esa información? ¿Cuál es el mejor canal de comunicación y dónde debería ubicarse? ¿Qué hace que los usuarios interactúen con la solución?

Estas preguntas hacen referencia no solo a aspectos tecnológicos sino también a cuestiones de comunicación y comportamiento de los usuarios. Por tanto, es necesario construir soluciones de visualización que respondan a esas preguntas teniendo en cuenta las necesidades del usuario, convirtiéndolo en el centro de investigación. Teniendo en cuenta estas necesidades, Mondragon Unibertsitatea ha diseñado e implementado una metodología que abarca las fases y etapas necesarias para su aplicación, además de las herramientas que dan soporte a cada una de las etapas. El proceso definido contempla cuatro fases: concepto, diseño, desarrollo y despliegue. La Figura 1 muestra las tareas que cada fase abarca.

Las fases de conceptualización y diseño de la solución se completaron con anterioridad y se recogen en (Martínez De Aguirre et al., 2015). La participación de los residentes durante esas dos fases fue esencial. Se celebraron varios workshops donde se recogieron las necesidades de los residentes. Estos workshops sirvieron para definir los requisitos de las soluciones a implementar. Además, los residentes tuvieron oportunidad de validar el diseño de las soluciones propuestas por medio de tests de usuario.

En este artículo se presenta la aplicación de la metodología en su tercera fase, es decir, el desarrollo de la solución de visualización del consumo energético en las viviendas del demostrador de Torrelago.

Aplicación de la fase de desarrollo

Con el objetivo de dotar a los vecinos del distrito de Torrelago, Laguna De Duero, de una herramienta para visualizar sus consumos, se ha desarrollado el primer prototipo de una aplicación web. A esta aplicación se puede acceder desde teléfonos inteligentes, tabletas u ordenadores, ya que el desarrollo de la interfaz ha sido llevado a cabo aplicando el enfoque Responsive Web Design (RWD) (Gardner, 2011). El contenido de la web se estableció durante la fase de diseño, donde, siguiendo la metodología basada en el Diseño Centrado en el Usuario (UCD) (DBZ-UDI, 2015), se celebraron varias sesiones con los usuarios potenciales de la solución, los vecinos de Torrelago.

Ecosistema del proyecto

La interfaz de usuario HMI (del inglés Human Machine Interface) implementada forma parte de la plataforma creada para el proyecto CITyFiED. La plataforma cuenta con una base de datos donde se almacena toda la información necesaria del sistema. Esta información proviene desde los demostradores de Laguna De Duero, Lund y Soma, donde están implantados sistemas de gestión energética a nivel de hogar, edificio y distrito (HEMS, BEMS y DEMS) (Figura 2). Además de las medidas ambientales y de consumo eléctrico, se recogen datos sobre el consumo térmico en los distritos. Adicionalmente, la plataforma hace uso de datos abiertos (Open Data), teniendo también en cuenta las directrices de privacidad y seguridad, con el fin de obtener datos de distinta índole, como previsiones meteorológicas, estadísticas de consumo, etc.

En el caso del HMI desarrollado para el demostrador de Laguna De Duero, se hace uso de la base de datos para la obtención de los consumos eléctricos y térmicos de los hogares. Estos datos son mostrados en diferentes franjas temporales para que el usuario conozca cuánto está consumiendo actualmente o durante un determinado periodo de tiempo. Respecto a los datos abiertos, la interfaz ofrece la previsión del tiempo obtenida por medio del API público del portal web Aemet (Aemet, 2016). Esta información puede ser valiosa para el usuario para la planificación de su consumo energético, como por ejemplo la puesta en marcha de la calefacción o la utilización de la lavadora, de modo que puede variar sus hábitos en función de la información obtenida a través de esta herramienta de cara a hacer un uso más eficiente de los recursos.

Arquitectura tecnológica de la solución

La aplicación web ha sido desarrollada utilizando el framework Django (Django, 2016), una herramienta para la creación de aplicaciones web basado en el lenguaje de programación Python. Este framework tiene como objetivo principal facilitar el desarrollo de sitios web complejos basados en bases de datos. Utiliza los principios de la arquitectura Model-View-Controller (MVC, Modelo-Vista-Controlador), un enfoque de software que separa la lógica de la aplicación de la presentación. El modelo representa las estructuras de datos empleadas para mostrar la información. Normalmente, las clases de esta capa contienen funciones que ayudan a recuperar, insertar y actualizar información en la base de datos. La Vista es la información que se presenta al usuario. Por último, el controlador sirve como intermediario entre el modelo, la vista y cualquier otro recurso necesario para procesar la solicitud HTTP y generar una página web. Sin embargo, Django adapta este enfoque a una nueva arquitectura, Modelo-Vista-Plantilla (MVT, Modelo-Vista-Template):

• Modelo: Consiste en un “mapeador” objeto-relacional (ORM) que media entre los modelos de datos (definidos en clases de Python) y una base de datos relacional.
• Vista: Es la capa de control, la lógica de negocio. Gestiona las peticiones recibidas.
• Plantilla: Es la capa de presentación, contiene los archivos relacionados con la interfaz gráfica de la aplicación.

Arquitectura Django

Los proyectos Django pueden contener varias aplicaciones, las cuales incluyen una combinación de modelos, vistas, plantillas, archivos estáticos, URL, middleware, etc. En este caso, el proyecto ‘cityfied_hmi’ contiene dos aplicaciones: “cityfied” y “api”. El primero gestiona la navegación principal de la página web, redireccionando el navegador en función de las peticiones HTTP que recibe. La segunda es una API RESTful, desarrollada por medio de Django Rest Framework (Django REST Framework, 2016), que ofrece métodos para obtener, actualizar o insertar datos en el Modelo. El código Javascript se utiliza para consumir esos métodos y mostrar la información correspondiente en cada plantilla HTML.

La Figura 3 muestra la arquitectura de la solución HMI, además de la interacción que se produce entre el cliente (dispositivo que se conecta a la web) y el servidor. Esta interacción consta de 4 pasos principales:

1. Petición: El usuario accede a la página web a través del navegador. Esta petición llega a la aplicación “cityfied” del proyecto “cityfied_hmi”.
2. Respuesta: La aplicación comprueba qué petición es y renderiza la página HTML correspondiente a esa petición.
3. Petición de datos: El código Javascript asociado a la página HTML realiza peticiones HTTP (GET, POST) para la obtención o inserción de datos en la base de datos. Estas peticiones son gestionadas por la aplicación “api”.
4. Respuesta: La aplicación “api” gestiona la petición, realiza la correspondiente consulta en la base de datos (SELECT, INSERT, UPDATE o DELETE) y devuelve la respuesta en formato JSON. Esta respuesta es tratada por el código Javascript adherido al HTML.

Django tiene sus propios recursos para administrar usuarios, grupos, permisos, sesiones, internacionalización, etc. También proporciona una interfaz de administración que permite gestionar el contenido de la base de datos, de una manera fácil e intuitiva. Además, esta interfaz se puede utilizar para crear usuarios de Django, con el fin de crear un sistema de registro en la página web. Cada vecino tendrá su cuenta de usuario correspondiente, de forma que se garantizará que cada usuario visualice sus respectivos datos.

Tecnologías empleadas

La codificación de la solución se divide en dos fases: el desarrollo del Front-End y el desarrollo del Back-End. El primero consiste en desarrollar la interfaz gráfica de la solución, crear todo el código necesario para que la página web tenga el aspecto definido durante la fase de diseño. Por su parte, la implementación del Back-End supone crear la lógica de la página web, es decir, crear todo el código necesario para su funcionamiento, lo que abarca la gestión de las peticiones, búsquedas en la base de datos, etc. La Tabla I especifica las tecnologías empleadas en el desarrollo de ambas capas.

Herramientas y metodología de desarrollo

El proceso de codificación ha sido llevado a cabo en el entorno de programación Microsoft Visual Studio Community 2015. Esta herramienta proporciona soporte para crear y depurar proyectos de Django, además de ofrecer la posibilidad de desplegar la página web a la plataforma Microsoft Azure. Esto requiere contar con una cuenta de usuario en la plataforma e iniciar sesión en el entorno de desarrollo con dicha cuenta.

El desarrollo se ha enfocado con el objetivo de proporcionar portabilidad al proyecto. De esa manera, se ha utilizado un entorno virtual para instalar todos los paquetes Python necesarios. Esto hace posible que el servidor se ejecute en diferentes hosts que contengan ese entorno virtual. La herramienta “virtualenv” (Virtual Environments, 2016) ha sido utilizada para proporcionar esta funcionalidad.

Se ha utilizado un sistema de control de versiones, Git (Git, 2016), para almacenar el código fuente del proyecto. Este sistema permite registrar todos los cambios que se realizan sobre el proyecto, tanto en los archivos estáticos como en el código fuente de la aplicación. Existen dos ramas principales, la rama “master” y la rama “dev”; la maestra y la de desarrollo, respectivamente. La primera contiene las diferentes versiones funcionales que se han ido creando durante el desarrollo, mientras que la segunda se emplea para almacenar el desarrollo en curso. Cada vez que se crea una versión funcional de la aplicación, se fusiona la rama de desarrollo con la maestra. De esta manera, se sigue una metodología de desarrollo que permite visualizar el proceso de evolución del prototipo.

En lo que se refiere al testeo de la aplicación web, la interfaz gráfica ha sido puesta a prueba con las herramientas para desarrolladores de Google Chrome. Estas herramientas han sido usadas para comprobar que la interfaz se adapta correctamente a las medidas de las pantallas de teléfonos, tabletas y ordenadores. Respecto al Back-End, se ha utilizado la herramienta Advanced REST Client de Google Chrome para comprobar el rendimiento del mismo. Se ha comprobado que los datos de consumo son obtenidos solamente si la petición la realiza el usuario después de haber iniciado sesión. Además, se han utilizado sentencias SQL para comprobar que el contenido de la web concuerda con el contenido de la base de datos.

Resultados

Como resultado de la fase de desarrollo se ha obtenido un prototipo funcional de la aplicación web (cityfied-webapp.azurewebsites.net) diseñada en la fase de diseño. Este portal muestra al usuario la siguiente información:

• Consumo eléctrico acumulado durante el día y el mes,
• Consumo térmico y eléctrico, y sus correspondientes gastos económicos de los últimos seis meses,
• Consumo eléctrico acumulado durante el mes clasificado en electrodomésticos,
• Recomendaciones de buenos hábitos de consumo energético,
• Previsión meteorológica de los siguientes cinco días.

La Figura 4 muestra la apariencia de varias secciones de la página web en el caso de acceder a la misma desde un teléfono inteligente.

Esta solución será validada por los usuarios durante la siguiente etapa del proyecto, la fase de despliegue. Para ello, se medirá el grado de aceptación de la solución por parte de los vecinos mediante NPS, Net Promoter Score (NPS, 2017), permitiendo calificar la calidad de la solución implementada. Además, se realizarán encuestas de satisfacción. De este modo, se podrá concluir si la aplicación web es considerada como una herramienta que ayuda a los usuarios en la toma de decisiones relativas a sus hábitos de consumo.

Agradecimientos

Este trabajo de investigación ha sido financiado por la Comisión Europea, a través del Séptimo Programa Marco bajo el proyecto de investigación CITyFiED (RepliCable and InnovaTive Future Efficient Districts and Cities), cuyo Grant Agreement es el nº: 609129.

Referencias

• Gardner, B. S., 2011, Responsive web design: Enriching the user experience. Sigma Journal: Inside the Digital Ecosystem, 11(1), 13-19.
• Lewis, J.O., Hógáin, S.N., Borghi, A., 2013, Building energy efficiency in European cities, Cities of Tomorrow – Action Today. URBACT II Capitalisation
• Martínez De Aguirre, I., Larrinaga, F., Reguera, D., Arenaza-Nuño, I., Cuenca, J., Gutiérrez, S., Vasallo, A., 2015, Desarrollo y aplicación de una metodología para el diseño de soluciones de visualización en el proyecto europeo CITyFiED
• Aemet Datos Abiertos, 2016
• DBZ-UDI, 2015
• Django, 2016
• Django REST Framework, 2016
• Git, 2016
• NPS, 2017
• Virtual Environments, 2016