portfolio

jenniferkshields.nz

3rd Feb 2020

portfolio

jenniferkshields.nz

3rd Feb 2020

At the start of 2019, I quit my job. I wanted to spend more time working on my own art - I went to art school for a few years, but since leaving I've spent more time working and volunteering in galleries, producing other people's art, than working on my own. Don't get me wrong, I loved all the work I did - but it was time to figure out what my own practice was after five years of not touching it.

As it worked out, I really enjoyed photography, writing, knitting and web development. Figuring this out was a whole heap of fun!

I spent a good chunk of last year upskilling in code and technology, particularly around the web front-end. And when Audrey and I started our business, Glitterbox Pursuits, in April, and we needed a website, I jumped at the chance to practice those skills!

I was pretty happy with that site - glitterbox.nz - and we decided to offer web development and management as a service. Pretty quickly we got our first client - Thriving Madly - and I set to work on that one!

Once that was done, I turned to my own website. It worked pretty well, and looked pretty good, but I was never really happy with the photo gallery implementation, and I felt weird about using a template someone else had made instead of building my own site!

So I started to think about how I wanted it to look, how I wanted it to work, and what it needed to do. It became clear quite quickly that it needed:

  • a strong visual focus
  • a good photo gallery implementation
  • an easy to read layout for long texts like essays

I thought a lot as well about the different types of content the website would host. The current one relied on a lot of tags and a separate tag page for navigation, rather than clearly listing a few categories in the navigation section. I wanted simple and accessible!

As I started to sketch out how it would work, I figured the different content areas would most likely be galleries, essays, poems, a portfolio (of artistic and development work), and a blog. This plus an about page meant my navigation would have six headers (seven on mobile including a link to the homepage). This is compared to 15 tags on the old site!

This also helped me think about how each of those content types would look - I figured a gallery would look different to an essay would look different to a poem, and the portfolio and blog could potentially be unique as well!

So, when it came to figuring out how to build it, I firstly looked about at other sites with great UX around viewing photos - particularly ones built with React and Gatsby, as that's what I'd been using. I found it tricky to find a CMS - headless, preferably - with a good gallery implementation. Finally, I started exploring Prismic and found their approach to content types and customisation worked perfectly.

Using Prismic would also mean I wouldn't need to rent and maintain a server or VPS - the site itself can run serverless, meaning it uses less energy and less money to host! I've become real interested in the environmental sustainability of the web, and in making sure the things I build are as efficient and friendly as possible.

So, here we are! I'm happy with the strong visual focus - the coloured sidebar, the grid layout on each page, the coloured pop-over on post previews - and I finally feel like the photos I take are being presented in the way they deserve!

I expect it'll continue to grow and develop and change a little, especially as technologies change and grow, too.

Some technical stuff for those interested:

  • It's built on Gatsby, my favourite static site generator, making use of gatsby-image for responsive image sizes
  • It's hosted with Netlify
  • Content is managed with Prismic and accessed via GraphQL
  • It utilises styled-components for CSS-in-JS and Framer Motion for simple page transitions
  • Layout is almost all managed with CSS Grid
  • It costs me nothing to host!

If you're keen on an affordable, sustainable website customised to your needs - whether you're a business, an artist, a writer, a non-profit or anyone else - get in touch! I can work alongside you to make sure what we build delivers exactly to your needs, costs little to maintain, and looks fantastic.

jennifer@jenniferkshields.nz