Rebuilding the Builtvisible website

Builtvisible.com homepage

Monday 9th of January 2017

The new and improved Builtvisible website is live. Actually it's been live since last summer, but I've only just got around to posting about it. It was my first Wordpress site and it's proved very successful.

All of the work on the site rebuild was done in-house, including graphic design, content updating and testing. I handled development, both frontend and backend. Although the project initially looked like a simple reskin it quickly turned into a much larger task that spanned several months worth of work. I worked closely with the rest of the team and management stakeholders to ensure that we fully captured all the requirements and translated them into a complete functional requirements document, which then formed the basis for all the development work.

One of the first things I did was move the site into version control and switch the hosting platform over to using it for deploying builds. I also fully documented how to set up a local development environment and push changes to the live site, which included devising a development and branching process.

The build involved a fair share of challenges, not least of which was teaching myself Wordpress. I knew some PHP beforehand, which helped, but there was still a lot to learn. One of the first challenges was ensuring that content authors could add complex content to the site without needing to be a developer. Much of the previous site content included complex markup added through Wordpress, which had left a legacy of unmaintainable, inconsistent and occasionally broken HTML. Using the Advanced Custom Fields plugin for Wordpress I was able to build every page on the site to allow the addition and manipulation of complex layouts all through simple fields in the Wordpress dashboard.

Some of the highlights of the site:

  • The homepage: the hero at the top combines animated elements and looping video to promote the company's work in an eyecatching way, while the content tiles below (fully customisable) scale for desktop and mobile with pixel perfect accuracy.
  • The blog: infinite scroll (a headache to develop) successfully implemented!
  • Configuration: almost everything you see on the site can be configured through the Wordpress dashboard, from the hero images on each page to the blog categories and their associated colours. This means that daily changes can be made to the site without any developer involvement.
  • Resources: guide pages include an automatically generated table of contents and can be configured to sit behind a custom built email subscription unlock system.

All of this was encapsulated into a custom Wordpress theme, built entirely from scratch for this project. The site is also fully mobile responsive, including some innovative solutions to laying out traditionally inflexible content on small screens.

The site launched on the 28th July 2016, only one day after the originally planned launch date, to an overwhelming positive response. At the end of the build I also wrote a guide for content authors, including the 'correct' way to include images, videos and other elements into blog posts and pages. Since the launch I've added multiple new features and improvements, including further customisation controls and our Halloween game, Something under the bed. The current site is here or you can view a web archive version here from a few months after the launch, which includes my favourite set of homepage heroes.

Related