When we first started working with FitStar in 2013, they had just released their first iOS app – simply called FitStar at the time – and were looking to have a marketing website built that would match the quality of their product. A wonderful fitness app, with NFL All-Star Tony Gonzalez as your very own personal trainer, FitStar allowed users to select their workout goal (lose weight, add muscle, keep active, etc) and created custom workouts that required no equipment, very little space, and above all else – only a short amount of time. FitStar has since gone on to develop FitStar Yoga with yoga guru Tara Stiles, have rebranded their original app as FitStar Personal Trainer, and have expanded their reach across multiple platforms and devices. In 2015, they were acquired by Fitbit. We were there every step of the way and helped them launch their initial website, update and relaunch their site when FitStar Yoga came around, design their web app, and completely rejuvenate and redesign their email marketing catalogue.
Project Date
March 2015
My Role
I worked mostly on strategy and design and led a couple initiatives along the way as well.
Although the site has changed quite a bit over the years, the underlining strategy has remained virtually the same. We want visitors to the site to get a strong sense of what FitStar is all about as a brand, what sets them apart, and what their apps can help you accomplish. We also want users to feel excited and motivated to download the apps and get started. Showcasing their ever-expanding community, talking to users honestly and openly, and giving users a sense of the passionate and fun team behind the apps have also been ever-present goals.
Here are a couple early wireframes from the initial site we built:
Design
Style & Mockups
When we first developed the site, their app had just launched for iOS 7 so the website needed to feel consistent with that aesthetic. We used that direction as a jumping off point, but pushed things further and designed a site that (although it’s evolved over the years) still holds up pretty well today. We kept things clean and airy, but infused a lot of energy and excitement with bright colours and engaging interactions. Showing the app screenshots and highlighting key features has always been important as has utilizing candid photography of active individuals (as it helps frame the product around a healthy, active lifestyle). Making things feel fun and lively has always been at the forefront as well.
Here are a few snapshots from the site that showcase the overall style and some full page mockups as well:
Content
Content Strategy
Staying active doesn’t need to be overly serious and fitness goals shouldn’t feel unattainable – that’s why we’ve always kept content conversational and playful, and have placed great importance on the FitStar community. Keeping motivated can be tough, but when you’ve got a community of like-minded individuals as proof that any fitness goal is possible, it becomes a little bit easier. That’s why we developed a community page that features real success stories and social proof (with Instagram and Twitter integrations) and fun little app metrics (like the number of push ups completed to date) that shows just how many people are using FitStar.
Here are some examples of community engagement:
Outreach
Email Campaigns
After FitStar was acquired by Fitbit and their potential audience ballooned to over a million people (Fitbit’s email subscribers) they knew that they needed to up their email marketing game. They asked us to redesign and redevelop their entire catalogue and over the course of a few months we helped them step up their email game with a vibrant and engaging package of dozens and dozens of new email templates.
Here are a few of the new emails we designed:
Results
Growth & Acquisition
Filament’s relationship with FitStar has been a pretty special one. Over a few short years we helped them launch new products, expand their reach in the marketplace, and grow their user base. All that attention and buzz led to Fitbit acquiring them in 2015, where they’ll continue to do great things and get people moving!
Designed & Developed by Filament Creative.
Strategy: Stephen Megitt, Matt Hryhorsky, Trevor Davson Content & Copywriting: Stephen Megitt, Trevor Davson Design: Matt Hryhorsky, Lindsay Trevors, Trevor Davson, Kenzie Ryder Development: Dave Fox, Justin Kerr Project Management: Stephen Megitt
