Case Study: Maggie's Foods for Pets
We created a website for Maggie's Foods for Pets. A family run pet shop in West Boylston, Massachusetts, USA.
Read about the challenges the Coronavirus put on our design decisions and the experience we created to overcome these for Maggie's Foods for Pets.
30 days in, what were the results?
When we launched the Maggie's website we were pleasantly surprised by how many visitors were not just visiting but engaging with the website. Let's look at it in more detail:
A steady flow of traffic
In the first month web traffic to the Maggie's website averaged at 20.1 visits per day. This modestly steady flow is a solid start considering that Maggie's previous website was not optimised for search engines meaning that Maggie's was not showing on ANY results page of search engines.
It will take time for the new website to be indexed completely so we look forward to keeping an eye on this over the next few months. The website is now currently the 3rd result on Google when searching for the brand name. The results above? The Maggie's Facebook page of course!
A higher than average contact conversion rate
Of those 20.1 visits to the website, at least 88% of those visits resulted in users selecting a call to action element (call or email). This meant that for every 20 visitors, approximately 18 visitors contacted Maggie's directly from the website!
Not just loyal customers but new ones too!
Perhaps the most gratifying statistic of the month was the number of new/unique visitors to the Maggie's website. In the first month since launch, the Maggie's website drew in 623 visitors, of which a whopping 77% were from unique visitors.
It's great to see that a brand built on community, word of mouth and reputation is beginning to capture the engagement of a much wider audience.
So how did we create this website and what were our challenges? Let's dive in:
We refined the branding
Maggie's already had a fantastic logo incorporating their friendly, family feel in the font type for 'Maggies'. With the burst of colour in the 'Foods for Pets' providing us with a good opportunity to continue that same colour scheme throughout the website.
The original logo had both the 'Maggies' and 'Foods for Pets aligned adjacently. Long logos don't generally allow for much flexibility when you want to use the logo in smaller spaces such as Social Media.
We made the decision to layer the words on top of each other rather than side by side. This compacted the logo without compromising the balance of the logo.
The three paws in the logo symbolised the owner's dog who sadly passed away. She was called Maggie May and had three legs in her later life so that part of the logo's design held a very significant meaning.
Although we made slight layout adjustments we didn't want to change the principles of the logo. So we created a vector of the current logo to make sure it would render flawlessly on retina displays.
Creating colour contrasts
Now that the logo had been given a new lease of life, next we wanted to create colour contrasts on the website to promote concentrated attention hot spots.
Colour contrasts help to bring focus to certain calls to action such as buttons, help text or transnational areas.
To do this we used primary colour tones of yellow, red and blue. We used a very dark grey for the font and for darker tones for accessibility.
Launching during a pandemic
For a company with no e-commerce and who pride themselves on repeat transactions through in-store experiences only, launching during the Coronavirus outbreak was never going to be easy...
How did this affect the design?
We had to ensure that the key message of the brand was at the forefront of the digital experience. Maggie's unique selling point was their free curbside and delivery services for local customers.
To make access to these services as clear and as easy as possible we designed a banner to illustrate the service (see above). For this we used a yellow background with outlined icons to describe the sequential service as clear as possible.
We also created an interactive call to action button which hovers in the bottom right hand corner of all handheld devices allowing customers to call, navigate or place an order with Maggie's in just two taps (see below).
Before and after
Check out our before and after slider below. The website on the left is what Maggiespets.com used to look like. The website on the right is the new website we launched.
If you are on a mobile device you may want to turn your device landscape and use the arrows to swipe left and right.
The back story
We completed the website for Maggie's Foods for Pets in 2020 but our story with the company started way back in 2012.
I first met Stephen in 2012 when I spent some time in Upton Massachusetts. Stephen is the store owner of Maggie's Foods for Pets.
As a lover of pets I was immediately drawn into his store which reeked of pet shop nostalgia. It was the kind of pet store you see on 90's wholesome family movies and the kind you can only imagine existed as a kid.
I told him I was a creative, we kept in touch since and told Stephen that one day when he was ready, that I was going to put my creativity to good use and help promote the great brand he spent so many years building.
In late 2019 Stephen messaged me and said 'I think I am ready, it's time we give our digital estate a new face'. I put the hot dog down, wiped the mustard off my beard, picked up my pen and got to brainstorming.
Every website of our starts out as a sketch in our notepad. Below are the key elements that went into launching Maggiespets.com
Refreshed content for SEO
Even though Maggie's website had been established for many years, their website was not showing up on Google even if you entered their full domain address.
Instead their partner websites and social media accounts were. We put in SEO best practices across the website to make sure it was primed for crawling!
Consistency in branding
Maggie’s branding was clouded but their logo was a great starting block. We took the yellow tones from the logo and used a mixture of primary colours to reflect the array of colour found when you visit the store.
Focusing on communication channels
Maggie’s stock hundreds of products in-store however they do not sell via an online store.
Because of this it was important to create as many channels of communication as possible. We added a call now feature for mobile users.