Personal Site 4.0

January 7, 2018
Web Development

A snapshot of what I’ve been working on lately; That’s the primary purpose I wanted this website to serve. In addition to that, the site serves as a test lab for my ideas unrestricted by client requirements. A place for my professional and passion projects to coexist.

This current version of the site was built over the course of 2 months when the spare time was available. Prototyping how I wanted each page layout to look for each screen size took the majority of the time. Prototyping was done using Sketch, Craft, and Axure.

I wanted the design to follow the aesthetic set fourth by my prism logo. Starting with the overall shape of the logo, the angularness and forty-five degree angled sides of the shape led me to stagger the alignments of the elements on the page. This creates diagonal sight lines that smoothly line up from one visual element to the next. Next, I wanted the forefront of the logo (everything contained in the rotated outlined square) to convey motion. I wanted the square in the forefront to seem as though it was elevating above its background. This manifest its self in the design language of the site with the transitional scaling of buttons when they are in focus. The letters “tB” are actually contained within the outlined square, cropped prematurely by its container’s rotated sides. The standalone images on the website share that similar cropping style.

Layout responsiveness was a primary requirement for this project so I built the site around principles of simplicity and modularity to meet this requirement. Elements, such as buttons and images, are not visually linked which makes repositioning for different screen sizes easy and clear. Visual elements around the site often share the same fundamental asset allowing for easy reuse and rapid prototyping.