Site Visitor Customization

Discussing history of project

I talked to the Product Manager and scanned customer support tickets to see what was being requested by Squarespace customers, and what the history of this project was. They had the functionality to have the accounts, but not customization at the time was allowed.

Competitor Analysis

Compiled a list of competitor analysis, such as Wix and Shopify, to see what they allowed for with customization of guest versus registered checkout, showing store logo options in login modal, etc. I looked at sites that used the competitor software to see what how they utilized the customization options for those experiences.

Ecommerce best practice research

Researched ecommerce best practices, mostly finding information on the shopping cart experience. I wanted to work to prevent shop owners from putting their store visitors in a place where they may lose a purchase due to big ecommerce no-nos.

Created task flows of various customization options

I created some low fidelity flows of various ways to customize the customer account experience. I explored several customization options including:

• No customization

• Complete customization - changing all colors, fonts, background colors, adding a logo image, button shape and format, adding personalized welcome messages, etc.

• Some customization - changing colors, fonts, but not allowed to change button style, no custom messages or add a logo.

• Limited customization - changing an accent color and some of the fonts, but not the font of the forms or buttons, and no adding custom logos or messages.

Applied customization options to customers websites

Looked at various Squarespace customers using the commerce function and applied their branding to various flows I created see what problems may occur with different customization abilities. Had discussions with the design team to see what they thought looked the cleanest, as well as seeing what aligned with the site builder team to make sure changes were mentally aligning to the newest version of Squarespace that had not been released yet.

I wanted to keep the flow simple for the shop owner as well so that they could create beautiful custom sites without having to spend too much time and taking away from their other business concerns. I also wanted to make sure the site fonts were able to be read with important information such as form labels or order tracking information.

Ran quick user tests

This allowed me to run user tests to see what was the minimal amount of customization a user was looking for to make it feel more cohesive to their store brand. The most noticeable differences were when the header font and the button color were able to be changed.

Created wireframe flow and prototype

I decided to put it in the commerce specific pages in terms of navigation. Sign in, creating an account, and the user profile were put in there for the prototype MVP purpose. However, the shopping cart experience or other shop related experiences that may be added in the future could also live there eventually.

From there the shop owner could choose an accent color, button style, button font and header font. Any fonts that were related to the form could not be changed. Also no custom CSS was allowed do to security issues of being able to put some skimming code in the credit card form line.

I passed this off to the developers in an invision prototype where they could click through the various flow options, as well as see the redlines and markup.