Albert Chang's Portfolio Website
An elegant, responsive, and user-friendly portfolio website.
It is a culmination of everything I have worked on over my past 4 years of web and front end development!
There were many steps in building this, so I will just discuss the three most difficult ones.
I designed the homepage artwork SVG in Adobe Illustrator. Then I used CSS animations to create the 'CODE' and music notes visuals. I also learned a new way to keep an object in place as it rotates, so once I applied that to the head, I synchronized the head bob with the other animations.
Next, I made CSS hover transitions on the skill boxes follow the direction of their page placement (corner-wise and edge-wise). Try them out when you get to the Skills section!
Lastly, I edited border radii of the objects on the About section, divided the Portfolio section into two rows, and assigned both of them CSS animations. I then utilized jQuery and ES6 JavaScript to watch scroll events, which trigger the animations when the user scrolls the respective objects into view.
FRONT END: Bootstrap, HTML5, CSS3, Sass/Scss
BACK END: ES6 JavaScript, jQuery, PHP
Updated with love by Albert Chang, 2020.
Connect with me! LinkedIn