Educators Financial Group have been helping the education community plan their financial futures for over 40 years. Specializing in investment strategies and a variety of different borrowing options (mortgages, lines of credit, loans, etc) Educators is the only financial institution in Ontario dedicated specifically to teachers and other members of the education sector. Working with them over several months, we helped to completely re-design their website from the ground up and focused on providing the best possible experience regardless of financial know-how. We framed things around goals like “I want to buy my first home” or “I’m looking to invest so that I can save money for my children’s future” rather than specific products or services. This made it much easier for users to know where to begin as, let’s face it, financial planning can be intimidating!
Project Date
January 2016
My Role
On this project I worked heavily on the strategy side of things and designed several key pages and user flows. I also assisted in project management.
After conducting research and audience interviews we identified several key demographics that we knew we wanted to speak to on the new site. There was a younger group of educators fairly fresh into their jobs and uncertain of how to begin saving, those a bit farther along in their careers and looking to start a family or buy their first home, more seasoned individuals starting to think about retirement, and those already into their retirement years. In order to cater to everyone equally we created character archetypes or personas for people to identify with right on the homepage – that way they could read and identify with the stories of persona X or Y and then get the content most relevant for them. Throughout the site we stuck to this model and simply asked users what they were interested in doing from a life-goal perspective.
We also wanted users to be able to self-educate as best as possible so we developed The Learning Centre where visitors can browse through resource material by subject and media type, use Educators’ helpful calculators, or simply search by keyword.
Here are a couple of the wireframes that we created for the site (Home, About, & The Learning Centre):
Style
Style Direction
We started with Educators’ existing colour palette, which had specific colours associated with their three main branches – Investing (Green), Borrowing (Blue), and Planning (Purple). We extrapolated from their and added teal to the mix to help soften things a bit and also so we would have a neutral, non category-specific colour to use. For type we went with bold, sturdy headlines (Gibson) and used a serif (Chaparral Pro) for body and punch copy, which we felt added a sense of credibility and expertise. Icons were kept fairly simple so they’d be easily recognizable and were given a lighter stroke width to contrast with the bold headline style. Imagery was selected to feel conversational, friendly, and above all else natural.
Here are a couple sections from the Style Tile we developed:
Design & Content
Responsive Mockups & Content Strategy
Using the Style Tile and the wireframes we developed as our guide, we worked collaboratively to flesh out the various designs we’d need for the site while copy was being written and vetted by the Educators team. Many sections of the site required multiple steps or states so planning out user flows and interactions was really important. The Getting Started process, for instance, has multiple steps where a user can input their information and get matched with a team of specialists so designing each stage was incredibly useful for our dev team. The Learning Centre is also quite complex and took some careful consideration to come up with the best experience across all devices.
Content was a bit of a challenge on this project as well as time restraints meant that it was being written while we were designing our pages. To combat this, we kept our designs as flexible as possible and iterated once final copy had been approved.
Here are a couple of the pages that we designed (Home, a couple Getting Started screens, About Us, The Learning Centre, Search Results):
Results
Increase In Qualified Leads & Less Time To Get Up & Running
After launching the new site Educators saw an increase in traffic to their site but more importantly they saw a significant uptick in qualified leads who were using the Getting Started tool to get paired with financial advisors. And better still, because they were self-identifying their goals through the tool on the site, it was taking less time for new customers to get up and running. The creation of the Learning Centre also meant that Educators was taking less time to answer simple questions and was able to spend more time helping their customers with their financial goals.
Designed & Developed by Filament Creative.
Strategy: Stephen Megitt, Matt Hryhorsky, Trevor Davson, Lindsay Trevors, Kenzie Ryder Content & Copywriting: Stephen Megitt Design: Lindsay Trevors, Trevor Davson, Kenzie Ryder, Matt Hryhorsky Development: Heather Vandervecht, Taha Jalil, Justin Kerr Project Management: Stephen Megitt, Trevor Davson
