Asignatura: Trabajo Final de Máster (TFM)
Titulación: Máster en Aplicaciones Multimedia
Nombre del estudiante: Juan Ramón Cárceles Román
Consultor y profesor: Sergio Schvarstein Liuboschetz y Laura Porta Simó
Introducción
Este proyecto final de máster tenía como objetivo el desarrollo de una aplicación web capaz de gestionar la documentación de un proyecto BIM (Building Information Modeling). Una aplicación que por lo tanto actuase como complemento de un software BIM existente.
El objetivo concreto de la aplicación era el de permitir a los usuarios y sus colaboradores visualizar la documentación técnica del proyecto desde cualquier dispositivo, además de poder realizar tareas de consulta, revisión y colaboración sobre esta.
¿Qué es BIM?
Debido al incremento en la complejidad y los requisitos de los proyectos arquitectónicos, cada vez son necesarias más herramientas digitales que faciliten el proceso a los implicados en el sector de la arquitectura, la ingeniería y la construcción. Actualmente el BIM es la metodología más destacada que pretende resolver este problema y que cada vez es obligatoria en más países. Las herramientas que implementan el BIM tienen como objetivo permitir hacer más cómodo y eficiente todo el proceso de creación gracias a poder realizar con ellas una maqueta virtual del edificio o infraestructura final. Dado que el proceso de desarrollo de una edificación consta de muchas fases, desde el diseño hasta la construcción y el mantenimiento, es difícil que un solo programa pueda abarcarlas todas. Por este motivo existen varios tipos de herramientas que se utilizan en fases diferentes o para tareas complementarias. El reciente auge del BIM ha hecho que la competencia cada vez sea más dura y que se busquen soluciones que destaquen sobre las demás.
Teniendo en cuenta lo mencionado, decidí desarrollar esta aplicación con la intención de aumentar los servicios ofrecidos por una plataforma BIM existente. En concreto elegí el conjunto formado por Rhinoceros y VisualARQ.
Dibujos inteligentes
Esta aplicación tendrá que estar siempre emparejada con un exportador para cada plataforma con la cual quiera interactuar. Este exportador generará el archivo con toda la información necesaria que la aplicación abrirá. El archivo concretamente contendrá información de los planos y dibujos técnicos del edificio o infraestructura que se decida exportar y además información de todos los elementos que aparecen en los documentos gráficos (muros, puertas, pilares…). Estos documentos gráficos son lo que denominamos “dibujos inteligentes”.
Un “dibujo inteligente” o dibujo con información asociada es un concepto inventado que hace referencia al dibujo técnico de un proyecto donde cada uno de los elementos que aparecen en él, contiene información sobre el elemento que representa en realidad. Por ejemplo, si se tratase de la planta de un edificio, un pilar contendría información de su volumen, su altura, el material… El concepto de dibujo inteligente deriva del concepto del BIM (Building Information Modeling) mencionado al inicio, en el cual hay un modelo 3D donde cada elemento que lo compone contiene información sobre el objeto que representa.
Estos dibujos con información son los que utiliza la aplicación desarrollada y desde un principio se han convertido en el elemento principal que le da todo el sentido. Su importancia radica en las ventajas que tienen en comparación a un simple pdf o imagen, ya que estos últimos solo sirven como material gráfico. El hecho de disponer de elementos vectoriales con información puede permitir por ejemplo, además de ver la información al seleccionar un elemento, poder realizar cálculos avanzados con los datos o identificar, desde los datos, los elementos en el dibujo, como por ejemplo identificar todas las columnas de la planta baja que sean de cemento o todas las puertas que tengan un paso menor a 70 cm.
Para poder trabajar con estos dibujos creé un tipo de archivo con estructura JSON. Dicho archivo contiene por una parte los dibujos, cada uno como un SVG pasado a cadena de texto, y por otro los datos asociados también en formato JSON. La relación entre dibujos y datos se realiza mediante un atributo data- en cada una de las entidades seleccionables que hay en los dibujos.
Etapas del desarrollo
Inicialmente partía de una idea sobre la cual ya había realizado algunas pruebas aisladas, todo entorno a la visualización de dibujos SVG. Al tratarse de un proyecto para ser “completado” en tan solo un semestre, la dificultad era elevada. Siguiendo la pauta de las entregas obligatorias establecí los objetivos que me ayudarían a obtener un resultado satisfactorio.
Los objetivos se traducían en las siguientes especificaciones del producto:
- Disponer de una aplicación web mediante la cual un usuario pueda almacenar documentación de proyectos realizados con un software BIM.
- Visualizar los dibujos 2D (plantas, secciones…) que haya exportado del proyecto.
- Obtener la información de los elementos que aparecen en los dibujos.
- Realizar tareas de medición sobre los dibujos (cálculo de distancia, área y ángulo).
- Añadir comentarios a los dibujos, ya sea marcando un elemento concreto o dibujando una zona.
- Colaborar con otros usuarios en la revisión de un proyecto, gracias a posibilitar el acceso de varios usuarios a un mismo proyecto y a poderse mencionar en los comentarios.
La aplicación se compone de una pantalla con el listado de proyectos desde donde el usuario puede gestionarlos (borrar, cargar, renombrar…) y de una pantalla de visor que es el espacio de trabajo propiamente dicho, al cual se accede tras seleccionar un proyecto de la lista y donde se pueden realizar las operaciones sobre los documentos de este.
Durante el proceso de desarrollo aprendí mucho, lo que me llevó a realizar modificaciones en las prioridades. Por ejemplo pasé a incluir la posibilidad de poder colaborar con otros usuarios y poder recibir notificaciones.
Un aspecto importante que pude llevar a cabo, gracias a haber cursado la asignatura de Tecnologías y Herramientas para el desarrollo web el semestre anterior, fue el de convertir la aplicación web en instalable mediante la creación de un archivo manifest.json y un Service Worker, lo que se conoce como una Progressive Web App. Esto tiene muchas ventajas, como la de cachear archivos, poniéndola en ciertos aspectos a la altura de aplicaciones nativas.
Retos y dificultades
El gran reto desde el inicio fue el de querer crear la aplicación sin necesidad de desarrollar un back-end, con la finalidad de hacerla lo más sencilla posible, económica y con poco mantenimiento. La solución que tomé fue la de utilizar el API de un servicio de almacenamiento cloud popular, concretamente Google Drive. De esta manera cada usuario puede acceder a la aplicación con su cuenta de Google y todos los proyectos que cargue se almacenarán automáticamente en su propio espacio de Google Drive.
Otras dificultades relacionadas con la falta de back-end como el envío de notificaciones y de emails, lo puede realizar gracias a conectar la aplicación con tres servicios de Firebase, concretamente Cloud Messaging, Cloud Functions y Firestore (base de datos).
Justificaciones de decisiones tomadas
Para desarrollar la aplicación no utilicé ningún framework, sino simplemente JavaScript y un bundler para poder organizar el código en archivos separados, por lo general cada uno correspondiente a una clase que a su vez representa un elemento de la aplicación. Concretamente como bundler utilicé Webpack porque, aunque requiere configuración y no es tan ready to use como otros, a la larga vale la pena, ya que permite una mayor configuración. Gracias a esta organización del código, resulta más fácil continuar ampliando el proyecto.
Una decisión que ahora lamento es no haber utilizado TypeScript en vez de JavaScript, porque este hubiese sido mucho más conveniente. Aunque el segundo pueda permitir ir más deprisa, ya que es muy flexible, a la larga se hace más difícil detectar errores y el código resultante termina siendo poco consistente. Entre otros aspectos TypeScript es de gran ayuda porque añade tipos, lo que permite detectar errores a medida que se escribe en vez de esperar a encontrarlos en tiempo de ejecución, con lo cual se ahorra tiempo y se consigue un código más robusto.
Conclusiones
El resultado obtenido en el momento de entregar el proyecto fue satisfactorio. Por una parte, porque aprendí a organizar y planificar tareas relacionadas con el desarrollo de aplicaciones, así como hacerme una idea de la importancia de cada una de ellas y del tiempo, las dificultades y el esfuerzo necesario para completarlas. Por otra parte, porque fue una gran oportunidad para poner en práctica mis conocimientos sobre desarrollo web además de ampliarlos abundantemente.
Finalmente considero que me sirvió para obtener una primera versión de la aplicación sobre la cual seguir trabajando para que se convierta en un producto válido y útil para los usuarios de cualquier software BIM.
Enlace a la aplicación
https://bimdrawings.ramoncarceles.com/
Enlace al repositorio GitHub
https://github.com/juanramoncarceles/bim-drawings
Enlaces relacionados
BIM (Building Information Modeling)
https://en.wikipedia.org/wiki/Building_information_modeling
Rhinoceros
VisualARQ
SVG
https://en.wikipedia.org/wiki/Scalable_Vector_Graphics
JSON
https://en.wikipedia.org/wiki/JSON
Progressive Web App
https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp?hl=es
Google Drive API
https://developers.google.com/drive
Firebase
Webpack
TypeScript
https://en.wikipedia.org/wiki/TypeScript
atributo data-
https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes
Cita recomendada: CÁRCELES, Juan Ramón. Aplicación para la revisión colaborativa de proyectos arquitectónicos. Mosaic [en línea], noviembre 2020, no. 187. ISSN: 1696-3296. DOI: https://doi.org/10.7238/m.n187.2040
Deja un comentario