A fresh business customer portal experience designed to showcase the enterprise offering
Foursquare has always represented everything that is good about location services. The main Foursquare App, maintained by scores of avid users, is constantly up to date and brimming with suggestions and tips. Swarm’s addictive social gameplay doubles as a personal location diary, and the Foursquare Location API is consistently used by legions of developers to power their own apps and services worldwide.
It was with this consumer-facing mindset that we dove into this engagement, since like many, we didn’t know much about their business offerings, or their vast potential. The fact is, over the years Foursquare has developed a suite of aptly dubbed ‘Location Intelligence’ tools which are mind-bendingly powerful and are set to change the way location data is used by advertisers, developers and strategists, amongst many others.
The first task was to create a proto-brand for Foursquare Enterprise, as there was a need to draw a distinction between Foursquare for Consumers and Foursquare for Enterprise. This task saw the creation of a distinct business-oriented look, but carried with it some elements which reference the parent Foursquare brand. A large part of this challenge was locating an appropriate position for the new Enterprise brand – taking into consideration the playful and colorful attributes of the Swarm and Foursquare brands. How do these attributes which have been part of the company’s DNA since inception translate to a suite of powerful new business tools aimed at an entirely new market?
One of main challenges the team had was to create a simple and straightforward way to visually communicate Foursquare’s products’s core capabilities. Because these products can have many different and varied uses, the team wanted to find a theme that could be used consistently across product offerings. The results are manifested in 5 different elements we call Data Glyphs.
While these Data Glyphs were designed to represent different clusters of Foursquare’s data, they also serve as a visual aid to express some of the main capabilities of the different Foursquare Products.
Given that Foursquare’s suite of Enterprise products are aimed at a slew of different audiences, ranging from advertising industry professionals, to developers, to Wall Street analysts, we faced a challenge around how to best communicate these products to each audience. Adopting a unified approach for everyone was something we didn’t want to risk. Our solution for this was to create an information architecture on the site that allowed each type of audience to self-attribute what sort of content would be most relevant to them based on their role/background. This is reflected in the top level navigation, aimed squarely at helping individuals navigate to the areas of the site that are most relevant to them.
Show, don't tell
Another leitmotif that we adopted through our design of this site was the concept of ‘Show, don’t tell”. The thinking behind this was inspired by seeing Foursquare’s Place Shape visualization – essentially a heat map showing how check-in frequency/accuracy around a specific place in the real world.
We concluded that showing and explaining things in a visual way is in many ways Foursquare’s unique selling point – and this should be reflected in its marketing site. Employing visual language is more engaging than explaining things with text – and helps us stay true to the design principles behind Foursquare’s products. This can be seen reflected in our data ‘glyphs’ mentioned above, and our Segments and Insights interactive features – allowing you to sample some of Foursquare’s choicest data points.
How we built it
From the outset of the project, it was a requirements that non-technical teams at Foursquare would be able to easily update the site, without the help of engineers. This meant that we needed to consider components to build the site that could and would be reused throughout, both for content and features.
Our solution was to build customized Django CMS plugins to fit the needs of the site. Working together with the Foursquare team to source data and insights, we were able to populate some of the more robust features that can be seen in the final product, including the Attributions tool and the Segments tool.
One Team Approach
It was very important to us to ensure that we brought our “one team” approach to this project, and work as closely as possible with the team at Foursquare, spanning development, digital and branding. Foursquare team members were in the ustwo New York studio each week, and we worked together every day using tools such as Google Drive and Slack. This allowed us to not only embrace the Foursquare Enterprise goals and principles, but fuse them with our own, resulting in an experience both teams could be proud of.