Overview
This is the first real website that I built back in 2015. At that time I was working as multimedia designer for a local marketing agency in Colombia. I was really inspired by my boss at the time (Diego), he always encouraged me to learn and he had his own portfolio website. I thought it was a great idea to have my own website as well, so I got my hands dirty, started to learn HTML, CSS and Javascript (and jQuery) and felt in love with web development.
This website really marks a milestone in my professional career. Once built, it opened many doors for me, that's one of he reasons why it has a special place in my heart.
Even though it was built almost ten years ago, I still think it is relevant today (with a couple of enhancements, it could perfectly be a professional developer portfolio). It shows the attention to detail that I've always had and the commitment to learn and build things autonomously.
Purpose
The main purpose of this project was to showcase my job as designer as well as to learn how website works (not only in the browser, but also how to deploy it to the internet). I remember having to learn how to use FTP to upload the files to the server, how to buy a domain and how to configure the DNS settings to make it go live (it was a bit like rocket science for me at that time).
Features
There are couple of nice features this website has:
-
Responsive design
The website is fully responsive, it looks good on any device. -
Multilingual support
Software development has been built with English as the main language, but I'm a native Spanish speaker, so I wanted to have the website in both languages. Nothing fancy to do it, since it is a single page website, I just duplicated the content and translated it. -
Interactive Adobe Flash Player components (.swf files)
You might remember that Adobe Flash Player was the king of the internet, especially for ads.I used to create animations and interactive components using Flash for the clients, such masterpieces are showcased in this website, however, since Flash is no longer supported by web browsers, you will not be able to see them in action unless you have a Flash Player emulator (you could install this chrome extension to run Flash Player on the web).
I show some of the interactive components in the Interactive Flash components section below.
-
Dynamic projects gallery
Back in 2015 React wasn't really a thing, so creating reactive animated content wasn't as easy as it is today. I used a jQuery library to make this amazing filter effect:
Interactive Flash components
These are some of the most relevantt interactive components I created using Adobe Flash Player:
-
HIT - A new soda with different fruits flavors
Notice that bubble effect when the cursor is on the banner. -
Colombiana - A christmas campaign
-
Postobon Ports - Sponsoring sports
Learnings and thoughts
Web technologies are constantly evolving, and it is important to keep up with the latest trends. This project was a great opportunity to learn how to build a website from scratch, from zero to hero (that's how I felt when the website was live).
It's nice to see the progress I've had over the years, and I'm excited about what the future holds for me in the web development world.