Evergreen & Grand

OVERVIEW

Amanda has been an artist all her life and wants to turn passion into profit. However selling art on websites like Etsy and eBay can devalue art, making it a “bargain”. Meanwhile, scattering art across other platforms makes it hard to build a solid clientele. She needs her own e-commerce site to sell and manage her prints.

ROLE

Product Designer
Product Strategy
User Research
Information Architecture
Interaction Design
Visual design
Prototyping & Testing

View Figma Prototype

Research & Discovery

SURVEY

A survey helps gain insight to what art lovers want (their shopping habits, frequently used sites, what they expect and need). After screening for users who actually purchase art online, there were 29 survey participants. Some key findings were:

80% of participants rely on social media to find art
A majority of participants used Etsy at 48%
58% of participants browse casually without purchasing‍

AUDIENCE

Amanda primarily designs for young professionals (20-mid 30’s) looking for unique, curated art. Based on questions asked in the above survey, I was able to gather insights to common needs and frustrations of purchasing art online. This helped me curate a data driven persona.

COMPETITIVE ANALYSIS

Etsy proved to be a go to for many users, but what makes them a competitor? Conducting a competitive analysis can help identify strengths, weaknesses, target markets and industry trends. Juniper Print Shop (my client said she loved their site) Society 6 and Benjamin Hardman are also part of the competitive analysis. Competitors are also rated on 7 heuristics of checkout usability.

Not a single competitor met all criteria. This leaves room for me to raise the bar, such as a single page checkout which have a lower cart abandonment rate. Of the competitors, three offer additional resources and “inspiration” for art buying. Using mockups and displaying art in a frame allows potential art buyers to visualize the art in their homes. It also helps give them a sense of size and proportion. This could convert the 58% of casual browsers into confirmed purchases. Etsy and Society 6 also allow users to like art for later, giving the casual browser an excuse to come back to the art piece and buy. Each site includes a related product selection, reducing friction for user to find products that may pair well together.

This has 5 screenshots from different art ecommrce websites

CARD SORT

Information architecture is key to a navigable e-commerce site. If a user can't find it, they can't buy it. A cart sort is crucial to discover how a product falls into users' mental models. Using optimal workshop I conducted an open card sort with 15 participants testing different tasks and Amanda's artwork. The darker colors in the similarity matrix indicate potential groupings. I normalized the card categories with an affinity map.

Ideate

SITE MAP

After discovering the labels and categorization of the website, it was time to organize the information in a site map inorder to have a clear IA.

USER FLOWS

As a casual browser I want to see the items I’ve liked in the past so I can better decide what to purchase

As an new home owner, I want to browse and purchase art so I can decorate my new space fast and easy

As a casual browser, I want inspiration so I can make a confident purchase

MOCKUPS

Although the website will be developed for desktop, to ensure that Amandas clients could access her art at all times. I started with a mobile first approach, creating mobile wireframes and then adopted them into desktop mockups in Figma.

Testing

PREFRENCE TESTING

There were three different home screen designs. I added place holder images for some context and asked users to choose their favorite. Users preferred the left and middle option for the "simplicity" and visible navigation. The two designs were married together for the best of each. The following percentages refer to the preferences of 15 participants.

26%

31%

43%

USABBILITY TESTING

There were thirteen participants on Maze, and three more on Zoom. Participants had to complete general navigation tasks. Some key findings were:

Finding art inspiration and pairings took way too long and had a 50% abandonment rate
Users had a hard time navigating back or finding the correct CTAs
Users were unsure of what was an interaction and what wasn't
‍‍

After analyzing my findings, I made the following changes:

Each product in the Art collection
Every CTA and button
Tiny underline buttons
Each text field would have a hover state or show the blinking cursor
Checkout screen feedback (error messages)
Radio buttons

One participant mentioned a feature from Houzz. The Houzz design (left) features interactive price tags, and as you click them It routes you to the product page. This was incorporated in the Evergreen and Grand design. Users click a tag and an overlay appears.
‍

Pairing and styling page with hover state

Results

An eCommerce site is no easy feat, especially for a one-woman team. No small feature can be overlooked. Amanda has a direct link to her followers through social media, to keep them updated on new products and work. This will also hopefully increase her site traffic and page views.

Product affinity can help with marketing other items to users. Including styling guides and art pairing recommendations will promote clicks on products as well as help indecisive buyers or users who need direction on how art can be worked into their homes. Both ultimately help increase conversion.

In order to help new user acquisition, users have the opportunity to create an account. They can save important shipping information, view art they liked and their past purchases. Amanda can use accounts to monitor growth as well as help with customer service issues.

With a single page check out users don't have to click through multiple pages to get their art, reducing cart abandonment and elevating conversions.

The responsive design lets Amanda's customers shop anywhere, even on the go. Having a mobile first design will aid customer reach, improve user experience, boost engagement, and ultimately lead to higher conversion rates.