Grape Capital Group

Web Design

Overview

About The Project

Grape Capital Group is a Toronto-based, boutique financial services firm that provides a variety of loan and line of credit options for their customers. Unlike the big banks, who have a reputation for being rigid and impersonal, Grape values flexibility and cultivating strong and lasting relationships with their customers. When we interviewed some of Grape’s customers leading up to the start of this project, it became clear that Grape’s sincere and personal approach was a real differentiator as they were actually interested in the financial goals of their customers and finding the best possible approach for each individual client. In the redesign of their website, we set out to showcase this and centered a lot of our decision-making around the premise that “understanding your financial options starts with a conversation”.

Project Date
February 2014
My Role
On this project I developed the concept for the re-brand, helped lead strategy, worked in conjunction with another team member on the design of the site, did some copywriting, and led the project management side of things.
Logo

Re-Brand

We started the project by redesigning Grape’s logo. We developed a couple different concepts but ultimately went with the one shown below. It’s simple and professional and is meant to represent financial growth (with the upward rise of the dots) while also acting as a subtle reference to the shape of a bunch of grapes.

Here’s the Grape Capital Group logo we developed:

Branding

Strategy

Planning & Wireframes

On the strategy side of things we wanted to be sure to develop a site that was easy to navigate, succinct, and got qualified leads into the loan application funnel as seamlessly as possible. We mapped out the site structure, created content hierarchies, and built a fully-functional HTML prototype to walk the client through.

Here are a couple of the wireframe concepts (Line Of Credit, Mortgage Brokers):

Wireframes

Style

Style Tile

From colour palette to typography, we wanted every aspect of Grape’s new site to feel approachable, credible, and, unlike most financial institutions, relatable. We opted for a soothing colour palette designed to convey trust but also to put users at ease and went with a combination of highly readable and engaging sans-serif typefaces. Aesthetically we kept things very clean and fresh in an effort to distance ourselves from the typical look of banks/financial institutions. Iconography was kept simple and UI elements were purposefully made to be as straight-forward and intuitive as possible.

Here are a couple sections from the Style Tile we developed:

Style Tile

Style Tile

Style Tile

Style Tile

Design & Content

Responsive Mockups & Content Strategy

As mentioned above, Grape’s major differentiator stems from the relationships they have with their customers and the fact that they actually take the time to get to know the people they work with. We wanted to capture that as best as we could with their new site and did so by positioning ourselves as often as possible from the perspective of their users. Copy was written in a very conversational and open manner, their processes were outlined in an easy to understand fashion (and often with accompanying illustrations), and their online applications and calculators were built to be as straight-forward and transparent as possible. The loan application form, for instance, tells users exactly what they’ll need to get started and outlines the steps involved and how close they are to completion as they fill in their information. That way, a user knows exactly what they’re getting into and can track their progress along the way.

Here are a couple of the pages that we designed (Home, Loans & Rates, Line Of Credit, & Apply Now):

Homepage

Loans Page

Line Of Credit Page

Apply Page

Results

Spike In Traffic & Increase In Applications

The redesign of Grape’s site led to a spike in website traffic and more importantly a tremendous increase in completed applications and qualified leads.

Designed & Developed by Filament Creative.

Strategy: Stephen Megitt, Trevor Davson, Matt Hryhorsky
Content & Copywriting: Stephen Megitt, Trevor Davson
Design: Lindsay Trevors, Trevor Davson, Matt Hryhorsky
Development: Dave Fox, Justin Kerr, Stella Kim
Project Management: Trevor Davson, Stephen Megitt