My Works
Unum Web App
Description
UNUM is a platform for influencers to organize, schedule and create content. I was tasked with bringing this app to the web platform, initially they only had a basic prototype without many features besides rendering your instagram grid.
This is a very complex application, but I was able to deliver my solutions efficiently and always on time.
Front-end Solutions
I recreated designs given to me with react and redux, added functionality and integrations. Some feature highlights are:
- Sortable Grid.
- Drive, Dropbox, Unsplash, Pexels and Instagram Integrations.
- Mosaic Grid on Import Modal.
Back-end Solutions
I have built many endpoints for the platform using Node, Express and Mongo. The user data I worked with resembles the model of a social media app, with each user being able to own many posts and projects. Highlights:
- Instagram Login.
- iOS Cross Authentication to Web using JWTs.
- iOS Story page rendering on the backend.
Unum Website
Description
UNUM's Website was a colaboration project with another developer. I was tasked with building a home page that would randomize images and gifs without overlaping, I accomplished it by building collision logic within the page. All pages of the website load below 3.9 seconds. This website was build using Next.js
On the home page, the animation that controls the opacity of the main title was build using javascript and connects to the scroll bar as a control. No libraries were used.
Project Solutions
The website features a blending mode on the navigation as well as page transitions. But the most complex feature is the image randomization on the home page, it has to render the images at random positions without overlap. It also works on mobile views.
RocketFinder
Description
This was a personal project, one of my first apps. using jQuery, Canvas and AJAX requests. It retrieves data from a rocket launch api and renders the positions of the launches on a 3d globe (that also works on mobile).
I was responsible for all the design and code of this entire project.
Project Solutions
The WebGL 3d globe used needed to animate, so I made a recursive function that adds to the "center target" of the globe both in X and Y axis. It also has acceleration and deacceleration.