Squarespace: A Guerilla Usability Test

Overcoming the Learning Curve of Doom in a complex product

Scott Price
6 min readMay 6, 2014

Squarespace offers domain hosting and site design. It’s a beautiful product — and at every step in the engagement the customer is reminded of what their fledgling website could become.

But underneath compelling features and design options lay a few glaring usability issues threatening to frustrate new users away.

Intent

What pain points are likely to interfere with onboarding?

In selecting users, I screened based on whether they could jump into using a computer readily and were enthusiastic about building a website.

To create a consistent experience that simulates new user experimentation, I asked participants to complete a series of tasks.

  1. Select a template
  2. Change the home page title
  3. Change the color and font of that title text
  4. Upload a picture to the home page
  5. Switch to a new template

With this list and a Macbook I went out into the world and shared an intimate experience of joy, frustration, success, failure, satisfaction and patience with complete and total strangers. It was pretty cool.

Categorizing pain points

As imaginable with a complicated product, several issues arose. After combing through notes and Silverback sessions I began sorting them into the bins shown below.

categorizing pain points

This is the typical experience narrative:

A user rockets through the onboarding flow, selecting (and falling in love with) the beautifully curated templates representing the promise of what their website could be. The feeling of ownership was enough to get them to sign up with their name and email.

They mostly skipped or ignored the intro video and had some trouble navigating off of it. And then, once in the editor — some picked up on the cues and some didn’t. Those that struggled generally had difficulty understanding what they were editing and how to view these edits. This learning curve yielded frustration with navigation and was met with overzealous browser navigation, which frequently resulted in unintentional log out.

flow in which pain points were encountered

There’s a lot here, and we’re not going to solve it in a single post. But let’s take a look at some focused changes that may make a more cohesive and enjoyable experience as a whole.

Defining issues and suggested actions

  1. Templates

The inconsistency across templates causes a great deal of confusion.

disorienting template content

From a first time user perspective, having the navigation populated by specific terms associated with the template but with little or no relevancy to what the pages actually are immediately disorients a user who was just thrown into an editor they’ve never seen before— that beautiful template they fell in love with just moments ago has become a list of names or words that don’t really hold any meaning.

>What can we try?

Have new users land in “Preview” mode instead of the editor (this already happens when switching templates). Allow them to begin to dabble with text content in the same framework as they were first exposed to it, creating a sense of familiarity and creating content that will ground them in the Content manager when they get there later.

Fact: puppies decrease user frustration

2. Navigation

“Where is my website?”

There are too many options — too many places to go and too many places to get lost. These options are represented by an unknown iconography and many of them aren’t going to be useful for some time to come.

seems reasonable to me

I can’t run analytics on a site I haven’t made a title for — I can’t sell products when I haven’t uploaded images yet. If we want customers to explore the full functionality and capabilities of our offerings — the editor is not the place for them to learn about it.

>The lowest hanging fruit

There is an effort in place already to inform users of what “commerce” ($) is before they can interact with it. This is a great feature to test, however it allows no way to back out other than the “esc” key which inexplicably lands you in preview mode.

this pop up shows up when someone clicks commerce; but currently the only way out is through

>What else can we try?

This is complicated and probably out of scope for an initial usability test. Increasing the clarity of site navigation may help users to avoid pitfalls. A few suggestions on that below.

The main things to consult here are consistency and expectation — after clicking an icon in the upper left corner to get to perspective mode — should the user now have to find the icon in the lower right to get back to the content manager? Probably not. Should the same icon send the user to two different places to edit content? Probably not.

navigation elements

3. Help

“theme…theme, theme…..”

current search outcome

The most painful experience I witnessed was watching someone trying to swap out their template, and despite hovering over “Templates” once or twice and eventually resorting to the FAQ, ultimately not being able to. Because the word they kept repeating under their breath was ‘theme”. The expectation of certain words based on other brands in the space should be anticipated, especially in the help.

> What can we try?

Create a thesaurus of terms so that people who have used other products can apply previous mental models and still find aid in the supporting documentation.

a simple and a more complex outcome of smarter search

4. Keep Helping

Occasionally, I’d look down at my notes, and look up to see a shrugging (or cursing) participant that had just been ejected back to the login screen. When it happened, and it did happen, it happened fast. What had they done? Resorted to browser navigation. Sometimes the back button brought the standard “Do you want to save your changes?” But it wasn’t always there, and it wasn’t always a successful safety net.

This is a sophisticated product, with an engaging and purposefully thought out flow. The user should not be using browser navigation to go anywhere. If they do resort to it, it is a sign of frustration. It is an error. And should be treated as such with an error message. And, in this, lies opportunity.

> What can we try?

If a user starts using the browser navigation, send an error message with navigation clues or an invitation to search the FAQ or connect with support staff. This shouldn’t be overdone, but it may provide an opportunity to reach out to frustrated customers or to learn more about particularly confusing navigation.

specific and constrained user outreach

The messages would need to be specific and constrained. It definitely is a sensitive process but there is a lot to be gained by being able to identify a struggling user and ship them some timely help.

finding a balance between extremes

There is a lot to be gained by helping a struggling user. — Tweet this

Next steps:

These are suggestions based on observation. Their intent is to increase the joy of use of a complex and elegant product; a product seeking to solve the very challenging problem of simplifying website construction and management for non-technical users. These suggestions are put forth unsolicited, in an effort to create value for users and for Squarespace.

The next steps will always be to

  1. Test
  2. Iterate
  3. And do it all again

I am not affiliated with Squarespace.

Shipping UX projects under Kate Rutter and Laura Klein @Tradecraft until July… happy to be here; happy to hear from you.

--

--