Legal Protection Group
Legal Protection Group is a specialist provider of Before The Event (BTE) and After The Event (ATE) Legal Protection Insurance. They also provide Legal Services and Emergency Assistance Products. They approached me to forge a brand new responsive website for them. Their main aim was to detail the various types of cover that Legal Protection Group offer, and to communicate with customers through a blog. The company had received a logo from their design team, and I worked with them to deliver the website.
I consulted with the LPG management team and settled on how best to frame the new site, and the structure required to deliver the content. I began with traditional lo-fi notebook wireframes, through to hi-fi mockups of the interactivity, and the responsive adjustments.
I built the site with WordPress and utilised the latest technologies for speeding up site delivery. I created many custom jQuery functions, such as the ability to fluidly columnize content as a page changes sizes. This allows the content to switch to the best-looking layout on device rotation. I also wanted the header to become fixed as the site scrolls so that there would be a permanent menu to follow the user.
One issue I foresaw was that the menu used a strong purple, and this purple would be in header tags and CTAs. As I did not want these elements to visually merge as the user scrolled over them, the natural solution was to add a lighter box-shadow beneath the menu. Yet this would overlay the hero image at the top of the page and be very obvious.
Finally, I devised a system that calculated the progress of the scroll as the user scrolls through the hero image. Then the code applied that percentage to the opacity of the box shadow. Problem solved!