Responsive website mockup on mobile device and desktop.


A responsive photography portfolio website

About the project

This website has been half finished for many years, using old technology choices and annoying little bugs that just made it something shameful to view. Sometimes it wouldn't even render properly so it was decided a full redesign / development was required.

I started off with a redesign using figma and worked on getting a quick mockup developed with an updated colour palette. Swapping out the bright blue for a subtler gold that would work with a navy blue and white much better.

I also stripped out the default header and navbar and replaced it with an always responsive menu button that gives a larger screen space to the content. With the design in place I got to work building the project starting with my default Groundwork template that uses only vanilla javascript modules and next generation css.

Unfortunately CSS doesn't have Masonry layout by default so I used an external library for this as well as the lightbox gallery.

The project is deliberately small to allow content to be added sooner rather than later with more features to be rolled out over the next few months like an on-site blog and ecommerce using snipcart.