Mar 31, 2016
Subscribe now and get the latest podcast releases delivered straight to your inbox.
How Lexicon Relocation Delighted Customers and Employees Through Design
Mar 31, 2016
2015 was a big year for Lexicon Relocation, an IMPACT client.
From international acquisitions to new leadership to over a half dozen of the most well-researched, useful whitepapers focused on global mobility we’ve ever seen, it was very important that our design team captured the success of the year in a very unique format that would be well received worldwide.
The Goal & Challenges of the “Year in Relocation”
The goal of Lexicon Relocation’s 2015 Year in Relocation was to create an engaging, visually-appealing recap of the company’s success and achievements in 2015.
I won’t list them out here since you can check out the page; but trust me, they're impressive!
In previous years, the year in review/relocation was either an interactive viewport on a page, or a basic PDF. The former was cluttered and not user-friendly and the latter did not fully capture the necessary elegance.
There wasn’t a clear reason for a site visitor, including employees, to want to view the information, so it presented quite a challenge.
It’s important for Lexicon prospects and employees to understand how the company performed over the last year, and see areas of improvement as well as those that performed well (and should continue to).
How We Overcame These Challenges Through Design
As a standalone PDF, the 2013 Year in Review design did a great job of illustrating the entire year’s successes. However, it was not interactive, and did not give the user a reason to visit the Lexicon website.
While major improvements were made on the 2014 Year in Relocation design from 2013, the medium used to house the Year in Review was not friendly to all browsers and users.
The 2015 Year in Relocation design was built around overcoming these challenges, which led to a clean, interactive, and captivating design that links to some of the most important assets on the Lexicon Relocation website.
We transformed the content into an engaging design that constantly draws the eye to the next item, using visual cues like linear movement or downward arrows.
Keeping the user engaged with small animations helps keep their interest and leaves them wondering, “what’s going to happen next?”
We gave context to the content by counting numbers up to the final dollar value or percentage, sliding in visuals from both sides of the page, and adding external links as often as possible. Because of this, users have an easier time digesting the information, and Lexicon Relocation gained new blog subscribers from the form three-quarters of the way down the page.
The color palette we chose was very important as well, as Lexicon has a wide range of colors, but predominantly uses their brand’s yellow and blue.
A major objective was including all of the colors, to help push the brand elements to the forefront. By pulling in more of their expanded palette, it also helped create the bright, celebratory environment we were crafting.
Here’s an example that doubles down on blue, but brings in a loving fuschia to give context to a single line of copy:
We wanted to make the supporting imagery playful, but still professional. This ultimately led us to using vector illustrations with round approachable edges that were clean and simple to keep it from being seen as too childish.
Using the content provided by Lexicon as a road map, we were able to segment the critical pieces into visually distinct sections, while highlighting the most important stats through visual hierarchy and use of whitespace.
With all of these effects, our major concern was page load speed -- a lot of flashy animations can bog your browser down, ruin your experience on the page, and make you close the page before even reading the content.
To combat that, we focused on finding javascript snippets that would provide maximum value without reducing the page’s performance. We also implemented an optimized script for waypoints to minimize load time and dependence on other external libraries.
Everything on the page loads once per session - you won’t see the transitions and animations again when scrolling back up after being at the bottom. Go ahead, try it!
Why This Design Was Successful
Since this wasn’t a lead generating page, there was no “hard” metric for success, but from executive level to client-facing employees at Lexicon, the Year in Relocation was loved for its engaging design and smooth layout of the year’s achievements.
With the design also incorporating a handful of useful assets developed over the past year, including a calculator, multiple whitepapers, and links to the blog, we had also hoped to boost social media engagement and blog subscribers.
By including these elements in a well-thought out layout and simply using the blog’s value and statistics as the focal point, we were able to generate 10 new blog subscribers, without an overarching promotion, or download offer.
Everyone at Lexicon Relocation as well as the team here at IMPACT is incredibly proud of the project - and we're excited to see what the judges at HubSpot decide!
Check out this page if you want to learn more about the HubSpot Impact Awards (really, the name is a coincidence). Last year, we won Website Design of the Year for our client, Grapple; and COS Innovators of the Year as an agency.
Best of luck to everyone entering for this round of awards!
Free: Assessment