News

Are you browsing comfortably? How Squarespace used story to reinvent the homepage

sq_vert_RED

In many ways it still only feels like yesterday that Web Designer was tipping Squarespace as a startup to watch out for. We’re now of course talking nine years since the company made fledgling strides into the dotcom landscape, officially launching from founder Anthony Casalena’s dorm room in 2004.

For those familiar with the movie, this genesis could well have a The Social Network-style romanticism to it. Humble beginnings giving rise to formidable success – albeit with a little less squabbling, obviously. Even back in the early days, Squarespace as a brand felt different and fresh. Launched at a time that actually predates Facebook as we know it, this was a content publishing platform built to rival the likes of WordPress and Drupal.

After services such as Blogger and MySpace had shown a public demand for owning a personalised web presence, Squarespace would go further. Reinventing the idea of creating a ‘homepage’ into a more designer cloud-hosted experience, the ethos remains intact today. Growing richer and more sophisticated as web design trends do likewise, the latest updates encompass a stunning facelift for squarespace.com.

The site is a big colourful carousel that melds vivid photographic set pieces with subtle dashes of animation. Smart, sassy and oozing contemporary style, the result is a perfect welcome mat for the brand. Developed primarily by the in-house design team, the project featured assistance from production partner JaegerSloan. A New York-based studio focused on the “convergence of technology and creativity”, it would seem the two have done a fine job of telling ‘Squarespace stories’ in an engaging way. Dig a little deeper and you find the site reflects back the diversity of the customer and the spaces they create. “We wanted to take a new approach to make the brand feel personable and more human,” insist the team. “We eventually decided there was no better way to do this than to put a spotlight on our customers. Promoting the online identity of an individual or business is essentially what Squarespace does for people, so it felt very much in line with what we wanted to communicate.”

Given the nature of what business Squarespace is in, the company represents an ever-growing network of custom websites. If its community therefore is always evolving, it stands to reason that the brand itself should move with it. As a service hub, squarespace.com has had many incarnations since 2004, and this latest iteration started with a desire to innovate before an albeit young site went stale. “Our website design was less than six months old at the time, but the look and feel had already been replicated by many other companies. We set about redesigning the site to create a fresh, distinct, and unique experience for our visitors. The project would have three different components: a landing experience, a product tour that would cater to different verticals, and a template selector that was reconceived and updated to be more effective. We also launched a marketing campaign along with the new site, so we wanted to ensure the website would be part of a seamless, holistic brand experience.”

“It took a bit of serendipity to bring everything together.”

Although the vision for the process was doubtlessly influenced by the production partnership with JaegerSloan, the DIY nature of the project was surely crucial. Who better to realise the look and feel than the in-house engineers? “Members of our design team each took a stab at sketching out some quick concepts and ideas. Once we had something we were happy with, we started to map out how we would execute the concept. It was a very carefully planned and executed idea with many different moving parts at the same time, so it took a bit of serendipity to bring everything together.” Still evidently challenging, this way of working would have advantages over the classic agency-meets-client paradigm. The team could be more agile over favoured ideas and act on the instincts it had for communicating a coherent message. By looking within themselves and quite possibly their own working environments, the designers honed in on a concept.

“We were inspired by the idea that you can find out a lot about a person by looking at their work space – and that Squarespace is an extension of your identity online. This idea sparked the creative focal point of our campaign as well as our tagline ‘Create Your Own Space’, which speaks not just to creating a web presence but also to finding your passion. We wanted to find inspirational stories of people who went out there and made a living out of doing unexpected things like selling garbage and chalk art.”

In many ways this idea of leveraging customer personality could be seen as fairly unique within this market. CMS vendors have often showcased galleries of selected URLs largely as a demo of what can be achieved, but rarely has this content informed the marketing of the tools. Indeed by its own admission, Squarespace has historically “always been focused on showcasing our services from a feature perspective”. By gathering assets and speaking directly to the people who matter most, a picture could instead be developed of who the guys behind the sites really were. This in itself made the project more akin to a classic exercise in storytelling, a short film or indeed a TV advertisement. “We especially wanted the landing experience to be a very visceral, emotional experience. Approaching and interviewing each customer was a big undertaking, but finding the right customers was key.

Storyboarding, video and high production values

After casting the individuals that would be featured, we storyboarded moving sequences that would eventually be used as a TV spot. We then used some of those sequences to create looping fullscreen experiences on our front site. In addition to the studio shoot that brought the ‘Create Your Own Space’ idea to life, we also filmed a separate story about each customer.”

Video content would clearly play a big role and in a web age where the language of YouTube is so ubiquitous it stands to reason. However, if all you saw was the top level of those cyclical landing screens you would sit up and notice. Bold, punchy text framed by an assortment of gloriously messy desktops, physical not virtual, makes everything so purposefully colourful and diverse.

The immediate message of creativity and slick, glossy production values really sets this up as a trendy service viewers want will want to use. In terms of usability, the site becomes more like an extension of the intuitive Squarespace control panel or editor, much more an interface than just a series of pages. “Our designers worked with our engineers to create new tour pages and an updated template selector. Our production designer made sure that we were being efficient and that all the moving parts came together. We worked hand-in-hand with JaegerSloan to put together the video loops and the brand films that are featured on our front site. It also took some pretty intricate coding to make the entire site responsive, including the typography. It may not be something that’s immediately noticeable, but we wanted to execute it perfectly,” says the team.

In many ways this commitment to making it work can be traced back to the virtues of a Do It Yourself approach. The point isn’t lost that under its own roof Squarespace boasts the talented individuals who build the tools for such talented customers. Factor into that a founder and CEO who still actively submits code and you begin to get the sense of a team that really does revel in opportunities like this to have the chance to truly express themselves.

On being doers and thinkers

“Everyone contributed to multiple parts of the project. We have a very DIY culture here in that most of us are doers, not just thinkers. Also the beauty of Squarespace is that we are our biggest customers. We’re a big proponent of using what we make and if we can’t get our product to do what we want it to do, then we’re probably doing something wrong! We have a powerful developer platform that our team has used to develop our company website, not to mention every single template on the platform. Being a product company, the back-end development duties were already done; we only needed two front-end engineers to finish the job.”

Finish the job they doubtlessly did, spanning a duration of roughly three months and involving a dozen-strong team. The launched site has gone on to garner significant industry acclaim and scoop the most prestigious web awards for design. Perhaps most importantly though, you can tell from the way the team talk about it the pride they have for how it turned out, most pleased surely by how the customer has received it. Ultimately the only brief they had to fulfill was their own but with the new site framed within such a celebratory promo campaign, success was a decent bet. So what’s the ultimate test if you haven’t visited Squarespace.com yet? See if you can come away without at least taking up the free 14-day trial. We didn’t and who knows, by creating your own space you might just become the star of the next revamp!

×