Master's degree thesis project. App for managing documentation of BIM projects. The core idea are the smart drawings, which are building blueprints with attached BIM data. It is possible to check the data of a building element in the drawing, to add comments to them and tag collaborators, and to mesure distances, angles and areas.
It is a serverless app connected to Google Drive to allow to store data and collaborate, and Firebase for cloud messaging. An exporter is required for each target platform to generate a file with all the data.
Small React app that allows to check food nutrition values. It fetches the data from a JSON file. CSS is written inside the TypeScript files thanks to Emotion. It has a responsive SVG user interface with conditional mediaqueries. CountUp.js is used to do the numbers transition. I created all the vector graphics including the user interface using SVG produced with Inkscape.
Web app designed to help with the task of sending emails to a group of users that have reported some issue or request at some time during a product development. When the issue or request is fullfilled and all the users should be notified it reads a Google Sheet where all the data was stored and sends emails to the users to notify them.
All the data is processed before sending the emails to avoid that a single user receives more than one email. It uses NodeJS with Nodemailer and Pug.
Serverless app to check data about movies (votes, summaries, genres, date, images, etc.). All the data is fetched from The Movie Database REST API. It was developed with Vanilla JavaScript and it is a PWA (progressive web app) hence offering the possibility to be installed.
Master's degree back-end development course's final project. It consists on a web app to read news. Only certain parts of the application were developed. It uses Laravel on the back-end, which is used to create a REST API that is used from the front-end to perform all the operations. The front-end was developed with Vue.
Laguage message box that can be added to an existing multilanguage web site like a WordPress site. The goal is to advise to the user that the site is available on it's preferred language. First time it uses the browser's language to know which could be the preferred language. Once the user has made a decision it is stored and used next time. It can be configured to for example offer automatic redirect or to postion it relative to another element like a tooltip or centered in the viewport.
GreenSock SVG animations of existing logos from Lands Design and VisualARQ. CSS properties like stroke dasharray and linear gradient are animated.
Also the MorphSVGPlugin from GreenSock in the case of Lands Design was used to achieve the transition from a leaf to all the letters.
The original SVG drawings were restructured with Inkscape to have the right structre for the animations to be possible.
System to distribute a set of images in a round layout. On hover over an image it grows and if selected it is placed in the center.
It was developed as a part of a bigger application, an with the idea to make it possible to be integrated in any project. Currently it is a work in progress.
Small excercise animating a single SVG symbol with window.requestAnimationFrame(). It is generated randomly as a SVG <use> element that references the symbol and then attached to the DOM as a shadow element. Once it has passed the right side of the viewport it is deleted to avoid the DOM growing excessively. Since a single SVG symbol is used, the movement is shared among all the birds, and only properties like scale and fill color can be set differently by instance.