My Portfolio Site - Pt 3
I have been having fun with the image theme I put together for my portfolio site as I work on leveling it up overall. As I work on the next iteration of the site I decided to start all the way down to the background images, parallax effect, and animations before getting back into the informational content.
For the theme- The Royal Ontario Museum in Toronto is one of my favorite museums and all of the images I will be using on the site were taken there. I have tons of photos that should work well together to keep a cohesive theme and add some unique imagery.
For now, I'm pretty pleased with the background imagery and initial parallax effects. With an image overlay of the exterior of the museum, I was able to scroll some panels of sample text up from behind the museum while some panels are still scrolling in front of the museum. I put together a quick video of the progress so far.
Take a look at the code!
For the CSS I made use of the articles from my last post of recent resources- and a fair amount of trial and error. I'm still enjoying gulp and browser-watch for development on the frontend.
The html is still very simple. I used AOS for the animations of the cranes, but I am experimenting with a different resource. As I start to work with newer text animations and layer a parallax effect on them it will obviously expand back out quite a bit.
Top comments (0)