VividFront Website

VividFront Website

VividFront Website Redesign

After refreshing VividFront’s printed collateral, our old website was hastily updated to match the overall aesthetic, but it wasn’t anything spectacular. For this redesign, developer Jessica Paoli and I set out to change that, with a particular focus on user experience and innovation.

Responsive Design

Our first goal was to create a site that would be optimized for every user, regardless of what device they were using. Using our old site as a blueprint for content, I started designing for the smallest browser size, mobile devices. This allowed me to determine which elements were absolutely critical, and which could be removed in order to reduce page load times and accomodate the smaller screen size.

From there, I repeated this process for progressively wider browser sizes – from tablet through full-size monitor – each time designing according to function, then form. The result is a site that loads quickly and is easy to browse on smaller devices, and looks stunning on large screens as well.

Parallax Scrolling and Animation

To really show off our skills and create a site that stands out from the crowd, we included elements in the full size site that scroll at different speeds (parallax), creating the illusion of depth of field. Other animations are triggered by scroll bar position, like a section where elements fly in from outside the browser window and the splash image that slides up to reveal the hero.

Launch Site in new window

Project Details

Client — VividFront
Year — 2012
Credits — Kendal Richer, Jessica Paoli
Website — Launch

Project Gallery