Grid System Website
Jun 2017 – Jul 2017
I created this website for myself with HTML, CSS and JS, based on the grid system. This site is hosted on Github, I used it as a showcase of my design work in 2017.
I created my first portfolio in 2016. It was a complete report for my UX project for Clark. As time went by, I got more web/UX work so I was considering to have a romantic look and feel for my portfolio. The second version was built with that idea.
The site was built with a template. It was belt shaped, so the presentation has better to tell a story that attracted visitors to keep reading. However, to catch their eyes, I would put the latest and best projects in the front.
Code and Test
I coded with local editor and tested with local browsers: Firefox, Chrome and Safari. Also make sure the site was responsive.
Jul. 10 – Site title fixed
Sep.12 – UX project content update
Sep. 13 – Form updated, UX project update, Introduction update
Jan. 8, 2018 – Side project update
Apr. 23 – Add animation to the home button
In the end…
From this project I got more familiar with grid system in CSS and Github. I specially like the CSS overlay effect, which creates filters to your content and photos, giving the whole site a modern looking. The second time of organizing my projects gave me a chance to look back and rethink my design. There was a lot to be improved.
However, the second portfolio site has some shortages. This template is better for photography portfolio, not big projects with a lot of details. A site with menus and jump anchors will be a better choice. Furthermore, as I am adding projects, the belt will be very very long, which will be a tester for visitor’s patience and memory.