Community and E-commerce in a Post-pandemic World

Role: UX Designer, UX Researcher

Client: Goedicke’s Custom Framing and Art Supplies

Key Performance Indicators: Higher online purchase conversion rate and significantly lower rate of abandoned carts.

Introduction:

Supporting small businesses and local communities is more important than ever. However, many independent enterprises do not have the time or resources, especially during the pandemic era, to take the necessary steps to compete with large corporations, particularly in terms of their e-commerce. 

Businesses such as Goedicke’s Custom Framing and Art Supply in Casper, WY are an essential part of their city’s local creative ecosystem, but they need a more robust e-commerce experience in order for their community to thrive and compete with large corporations.

In a two week sprint, I set out to design an improved e-commerce experience for Goedicke’s that would preserve their successful community-oriented online presence while setting them up to be much more competitive in the art supplies industry.

The problem:

Goedicke’s target user needs a way to discover and purchase high-quality art supplies and custom picture frames locally because the user finds it difficult to source an effective e-commerce experience for art supplies that supports small independent businesses and is community-focused.

Their current e-commerce experience is outdated to the point where it’s UX may be hurting the business.

I began by conducting a competitive and comparative analysis in which I pooled data from direct competitors and a broader spectrum of important e-commerce websites to generate an in-depth feature inventory and task analysis. I used the method of feature inventory in order to see what makes major art supplies e-commerce services successful in their field.

I found that Goedicke’s already had an aspect of their service that was more successful than their large competitors, namely the sense of community that their current website evokes.

The efficacy of their community approach, combined with an up-to-date e-commerce experience, could render a substantial impact in the art supply industry at large while further strengthening their local importance.

-How might we create a custom framing consultation online?

-How might we create an e-commerce experience that doesn’t take away from (and even enhances) community focus?

-How might we find an easy way to navigate through hundreds of products across many different categories?

The design goal became clear: leverage Goedicke’s community importance to include a powerful new e-commerce user experience that would allow their business to stay competitive and scale while enhancing their local presence. With this goal in mind, after conducting the competitive and comparative analysis, I began hand-sketching the user interface for a responsive website that would be effective in both desktop and mobile formats. This allowed me to test different design elements in a fast and efficient way before moving the project to digital design tools.

In addition to the data tables that I created in the research process, and the hand-sketched wireframe screens of the prototype, I generated a digital user flow of a user’s projected navigation of product discovery, selection, and purchase.

I also created a sitemap in order to understand the best way of constructing the Information Architecture of Goedicke’s updated e-commerce experience. I arrived upon a new website homepage foundation that would have a variety of navigation options to account for different browsing styles and without being overwhelming.

With this body of deliverables, a began creating the mid-fidelity wireframes of the product discovery to purchase user flow for both desktop and mobile. 

I arrived at a list of “must haves” for Goedicke’s new digital user experience:

• Preserve overall community feel of website while incorporating e-commerce experience.

• Needs to have product search on homepage.

• Needs option to shop by brand and easily view most popular brands.

• Ideally an online flow for custom framing should be included.

• Product descriptions need detail with option to read more.

• Many high res images per item are needed to help tell each product’s story.

• There needs to be a way to see products related to one that the user has selected.

Considering the above user needs, I completed a fully clickable prototype of the new user experience in mid-fidelity grayscale wireframes.

Considering the above user needs, I completed a fully clickable prototype of the new user experience in mid-fidelity grayscale wireframes. Then I conducted a series of usability tests of the prototype to gather data on what iterations and improvements could be made. The tests yielded some valuable results. 100% of user subjects successfully navigated the product discovery and checkout process. However, all users encountered minor hurdles through their navigation. Elucidating and eliminating even minor hindrances is important because if a customer encounters any friction in their online experience, they are much more likely to leave a website. 

Several of my prototype testers were somewhat confused by some of the post-homepage navigation menus. For example, I instructed each tester to find and purchase a set of synthetic oil paint brushes, and on the “Brushes and Painting Tools” menu, several users were unsure at first whether to click “Oil Paint Brushes” or “Paint Brush Sets”. They all eventually found their way, but I realized that having several different navigation choices on the same menu to arrive at the same product can be confusing if not presented very carefully. In order to solve this problem, I considered eliminating or moving the “Paint Brush Sets” menu option to another part of the screen. 

In addition, some users were confused by the “Frequently Bought Together” section of the home page because it was unclear exactly which groups of products were frequently bought together. Several users also commented that perhaps there were too many products featured on the homepage, so in my iteration I decided to limit the number of categories featured on the home page to ten with a clickable link to “See All” categories if desired.

Most of my test users also expressed that the text on the main navigation bar on the homepage was a little difficult to read at first. So in my iterations I increased the width of the navigation bar as well as the size of the text.

With the results of my usability testing in mind, I created a full-color mockup of the e-commerce experience.