TUFT & NEEDLE

ECOMMERCE GROWTH & UX DESIGN

ROLE | SR.UX, UI, Art direction, Mentor
CATEGORY | ECOMMERCE, RETAIL
YEAR | 2018-2020

Company Overview

Tuft & Needle is a mattress and home furnishings company that disrupted the mattress industry by changing the process in which customers could shop and receive their mattress online. They enhanced the bed in a box model purchase experience in 2012 and have since been recognized as one of the major players in the industry. Though primarily recognized as an e-commerce company, T&N has opened several successful brick & mortar locations around the US in places like Seattle, Portland, Raleigh, Dallas, Phoenix and more.

My Roles and Responsibilities:
I joined Tuft & Needle as a Sr. UX Designer in 2018 and part of a growing team during a company merger with SSB (Serta Simmons Bedding). During my time I've lead UX, usability and conversion rate optimization initiatives for the purchase experience team, design and strategy for growth marketing initiatives and managed the design systems for the SSB house of Brands. Other responsibilities and accomplishments included:

  1. Leading, facilitating, and coordinating multidisciplinary ideation sessions for company campaigns.
  2. Improving UX usability benchmark scores throughout the e-commerce experience.
  3. Performing qualitative research by way of user testing and utilizing quantitative data from heat maps and analytics platforms.
  4. Work hand-in-hand with cross-functional teams to develop strategies and enhancing UX across e-comm and marketing funnels.
  5. Executing work by way of planning, research, sketches, wireframes, testing prototypes, and producing final assets for several initiatives.
  6. Developing an efficient promo ideation strategy and following through to campaign execution.
  7. Increased overall average CTR on promo paid social and display ads by 15%
  8. Launching several products to the DTC market across SSB brands.
  9. Working with T&N Product Partners to great specialized sleep apps for consumers.

PROJECTS OF NOTE

I had the privilege of working on various projects that produced differing levels of impact for the company. Project areas include retail support, landing page design, e-comm marketing promotional campaigns, product launches, strategy and branding. Below i've highlighted a few projects across the organization, my involvement and a few outcomes. Think of this as a brief but broad company case study. For more information on my work at Tuft and Needle, feel free to contact me.

UX, CRO & Product Launches

UX Benchmarking

Benchmarking was a standard practice that my team conducted in order to measure ease of use throughout the e-comm web experience. This allowed us to identify key areas of improvement. Our benchmarking scores were broken down by tasks where we directed users through the T&N e-commerce store and asked them to rate ease of use (usability) of the task on a scale of 1-5. Our scores were evaluated against our competitors for the same tasks on their platforms.

Remove item from cart:
One such area where we discovered friction was the within the mobile experience of the cart page where users were instructed to remove an item from their cart. Users rated the experience a 3.9/5 which was considered very low. Our goal was to improve our score as close to a 5 as possible.

Common Observations:

  • The desire for an obvious “remove item” option when viewing the product card.
  • Not having an option at the top of the quantity dropdown list required users to spend extra time searching for a remove option.
  • The experience wasn’t as intuitive as the majority expected.


Proposed Solution:
After evaluating the user tests, we created a new solution that addressed the most outstanding user concerns. UX usability updates included the following:

  • Adding a “remove” link to the product card
  • Added a “0” option at the top of the quantity dropdown list.

Conversion Rate Optimization

As part of a CRO initiative, our e-comm product teams gathered to significantly improve performance and conversions within their areas of the e-commerce funnel. As the UX lead on the Purchase Experience (PX) team, I led UX and CRO for the customer journey that covered the customer journey from "add to cart" into the checkout and post checkout experiences.

In order to effectively identify areas of improvement, I lead a CRO brainstorming workshop where I preemptively conducted a UX audit of the PX funnel and evaluated the experience against UX best practices using Baymard research and our own analytics. I presented these findings to the team where we brainstormed, voted on and prioritized the suggestions for the site. Here is an example of a test I created and it's outcome.

Cart Page: Adding Estimated Tax, Shipping and Recycling info

Problem:
Our calculated cart fees wee a bit misleading and didn't provided an accurate depiction of estimated cost to the user.

Hypothesis:

By providing more transparency within our cart in regards to estimating fees we will drive users into checkout and increase the probability of a purchase order.

Supporting Research Data:
Baymard shows us the importance of providing a foundation for the order estimate. This includes removing any misleading data within cart that could make a user reluctant to purchase and instead abandon cart. In our specific case, showing that tax estimation equaled $0.00 could appear misleading only to find out the real total during checkout.

Expected Result:
$3k/day, annualized to $1.09M

Actual Result:
Variant 1 = Winner. $8k/day, annualized to $2.9M

Competitor Compare Landing Page

The Problem
Marketing research showed that new paid traffic site visitors were unaware of what made T&N different from other DTC brands. This was believed to be a factor that contributed to a higher site bounce rate. The funnel did not include a place with info to help differentiate our brand in the marketplace with other bed in a box brands.

Goal & Objectives

The goal was to create a new asset for the ecommerce funnel that served as another tool to help differentiate our brand from others and drive traffic through the site converting prospects into buyers. Specifically buyers of our mattresses. The aim was to adequately informing users of the differences between our brand and competitors in the marketplace with the hope to reduce site bounce rate and increase the customers propensity to buy our mattress product.

Solution
A Competitor compare landing page was created to provide visiting customers a resource to see how we compare to other direct-to-consumer(DTC) brands. This page would lead to our very own mattress compare page where users could see our entire mattress lineup.

Prioritization
By conducting workshop and feature prioritization exercise, we determined the top features and components to include in our competitor compare landing page comps. Some of these included numbers of reviews, BBB ratings for each brand and value propositions specific to our brand.

Usertesting
These comps were thoroughly tested with a sample size of 5 users on usertesting.com. Click here to see the full user testing study. Also included in the study is a highlight reel of all 5 users in the test. We targeted a broad range of users from the ages of 24-64 years and evaluated them against a standards checklist comprised initial research questions and criteria. The test revealed several areas within content and design that caused confusion and hesitation for the user. Using feedback from the test, we were able to make improvements to the page. Changes to the comps included:

Content

  • Create more explicit lead-in/instructional, ie. explore these mattress brands, above the chart
  • ‍Add more explicit lead-in to the customer brand comparison reviews section for better clarity ensuring customers understand these are reviews of people comparing other brands to T&N

Design

  • Change review tabs to brand dropdown on mobile
  • Position Certifications section below BBB rating section
  • Make Certification definitions more accessible. Perhaps adding tooltip bubbles beside each certification type or similar
  • Add a T&N mattress “technology/materials” section below the chart

Serta & Beautyrest Product DTC Acceleration

Goal
Rapidly deploy Serta & Beautyrest’s National Line of products and add additional upgrades to the brand’s DTC e-commerce platform in record time. A.K.A. Project Slingshot

Challenges
We assembled a team of 10 professional from areas of project management, supply chain, dev and design to tackle the monumental task. I lead Design and UX for this initiative. Challenges included:

  • Serta and Beautyrest e-commerce platforms were underdeveloped and not designed for scale.
  • Launching +45 product models in 8 weeks on the current platforms. This was extremely agressive
  • Ensuring users had visibility to all new product additions and could easily navigate through product options.

The Approach
Our approach was to split Project Slingshot into phases. The question we had to answer was "how could we launch these products on Beautyrest.com and Serta.com SMOOTH & FAST while still retaining the same respectable level of quality that we give to T&N?" We concluded that by limiting the scope, prioritizing the areas the needed updating, leaning on insights from T&N, and focusing efforts on new unique scenarios only seen on both brands, we would be able to launch the products in a short timeframe. The first two phases focused on releasing all product SKU's at their mvp level. We focused on the most essential features related to the state of the e-commerce platform experience. This included making the navigation scalable, standardizing the PDP pages and refining the configurator where customers chose their specific product options.

Research and Wireframes
I garnered insights from our more develop Tuft and Needle e-commerce platform to inform changes I was making on Serta and Beautyrest. This included reviewing hotjar sessions and user research done for similar pages. Other helpful insights came by way of a small study on product configurators in the digital space but even more so within the same industry to help ensure best practices were followed in this short timeframe. Once I had a good grasp on the main areas of improvement for our MVP, I hit the ground running with wireframes for both brands. Due to the nature of the brands and differences in their products, we knew that their configurators would have to be designed differently. Below are wireframes for the navigations, homepages, PDPs and their product configurators for both brands.


High-Fidelity Comps

After testing several product configuration scenarios, I teamed up our content writer and the SSB marketing teams to assemble visual assets for all products needed to complete final stages of design production. Testing and QA was part of our normal process.


Results

There was a lot that we learned from a process standpoint during this acceleration period. With a short project timeframe and a focus on speed and efficiency, we quickly understood that clear goals, constant communication and collaboration was crucial to the projects success. Though effort doesn't necessarily equate to results, having a highly collaborative/functioning team ensured that the quality of our product was ready for the public. We were pleased to see that as a result of the e-commerce enhancements and new product additions in Project Slingshot, our average daily sales for both brands dramatically increased. This was only the beginning of enhancing the SSB presence for their customers online.

Retail Support and Misc Branding

Retail Team Swag

Having a cohesive experience is something we strived to have for our customers. This reaches every facet of the T&N brand both digitally and tangibly in our retail locations. Outfitting the retail teams with branded gear I created was but one way we enhanced culture and supported our teams within our in-store experiences. Here are a few pieces products I designed.

Growth Marketing

Growth Promotional Process

Promotions are some of the largest initiatives T&N includes in their arsenal to help drive traffic and growth for the brand. As the Senior designer on the growth team I standardized templates for all promotional design assets, created the structure for a new collaborative brainstorm and ideation process for campaign art direction, led creative on several promotions, collaborate with channel owners to determine asset to support the marketing strategy for each channel, tested and monitored asset performance. To help walk through the process, I will give a top level view of the process during a Labor Day promotion that I led and executed.

Initial Planning
Marketing Brief Kickoff - The kickoff is where we are informed of the sale offer, dates, competitive analysis, world events and other details pertaining to the sales period. We came into the the Labor Day kickoff knowing the odds were stacked against us due to the Covid-19 pandemic. Creating a campaign that would resonate with our customers and stand out from the competition was going to be a challenge. As for our sale, we decided to offer a 10% site wide discount from 08/18-09/07.

Research - Channel owners (Facebook, Google, Affiliate and Organic social) to gather performance data, competitor research, holiday insights etc. to inform the team going into the upcoming brainstorms. For Labor day we did a historical promo analysis gathering attributes of our top performing creative imagery and messaging. Along with creative attributes, we compiled specific information about each channel to inform the team on the channel nuances that impact performance i.e. Affiliate channels performed best with direct messaging and in-situ (non-lifestyle) photography.

Initial Brainstorm - This is a broader team ideation for the campaigns theme and perhaps promo features - I use Mural (a digital collab tool) for this seeing that we had covid constraints in play. Voted results from the brainstorm are synthesized and presented to the team.

Creative team brainstorm - During this brainstorm exercise I lead the creative team into two sessions where we expand on the results from the initial brainstorm and continue the process to narrow the overarching themes for the promotion. Voting on the strongest direction happens soon after and finally we brainstorm art directions to help communicate the theme. Here is where the creative direction is locked and special requests are prioritized. Promo testing methods are often times determined at this point.


Due to the nature of the pandemic and factors effecting life in quarantines, we concluded that our strongest direction would be communicating "summertime in the bedroom" (STIB). The concept? A Labor Day Staycation Sale. Because these are weird times, and if you have to live on a proverbial island, it might as well be wicked comfy. Think Bali oasis instead of Margaritaville. For this sale we decided to test ad and ecomm performance using two versions of our photography assets. Shot in the same setting, one version would be defined as lifestyle with talent and the other without (insitu).

Brief Completion - The brief execution requests are filed once the creative direction is locked and the asset feature list is submitted.

Concepting
Language and Sketching- The content and design leads collaborate to determine language and to sketch the art direction. Several options are created during this time. A creative brief is developed to informing details of the art direction, a photography shot list, visual props and models for the shoot. This brief is referenced throughout the concepts execution and production cycle.

Concept Execution
Photoshoot -  Art directors and photographers reference the creative brief and shot list throughout the shoot to gather all photography assets needed for production. Due to the covid circumstances, I was forced to stay remote and art direct and monitor over video. This is where the shot list I created with the photographers really came in handy. The shot list had detailed actions and illustrations to depict how the photography would be used in various media. These assets are used across the Tuft & Needle site, retail locations ads, videos, and other marketing materials.


Asset production
- All asset requests listed in the marketing brief i.e ecommerce additions, Ads, emails, videos, content etc. are produced. Qualitative tests are performed and assets altered if necessary at this time. Due to the tight 4 week turn around, our qualitative ad test, although prepared, would carry less weight for this promotion. We instead leaned on historical data and quantitative research for this promotion and allowed the planned qualitative test to inform future creative with similar attributes instead.

QA & Launch
Final assets are thoroughly tested for QA. Once final approvals were given, assets were scheduled for launch dates across all channels!

Outcomes and Results
Homepage Hero Testing -
During the start of the sale, we reviewed the data and concluded that there wasn't a major difference with the homepage variations. The full bleed lifestyle variation (aka original) performed slightly better which fell in line with previous tests with similar variants. Overall we found that the full bleed original variant had a 92% probability of performing the best. The left "slash" template fell behind at 8%.

Performance:
This promotion had the highest revenue grossing day of the year at its highest selling day almost doubling revenue performance YOY.
Highest paid social Impression to Link Click Rate - 0.34% compared to previous 3 promotions within Q3.

Other Promotions

Here is a brief overview of a 2020 holiday promo campaign combining 5 promotional periods into one creative/marketing initiative. My role included contributing to promo strategy, marketing research, leading brainstorm ideation workshops, art directing and executing the campaign assets for our e-commerce site, ads and email marketing material. Other responsibilities included e-commerce implementation through our CMS and QA testing for each promotional period.

To help visualize each promotional period in their chronological order, I created a promotional timeline that would act as a quick reference for my team. I've included a brief overview of each promotional period and samples of the assets created for them below. Over 500 assets were created for this multi-channel marketing growth strategy.

Results
We were pleased to see our research pay off during Covid times as we broke records during the holiday season including the 3rd highest gross revenue day in Tuft and Needle history.

Black Friday Part: 1
We approached the promotional periods with a take on new traditions this holiday season. With help and research by the team, we allowed our direction to take shape cognizant of this years reality. The reality that holidays looked different for everyone. Our approach was to create a campaign that "Cheered to.." new traditions depicted through our photographed scenes. So here is a little creative sample for the assets created for our Black Friday 10% off sale that went live 11/16-11/25.


Black Friday Part: 2

In the spirit of cheering to new traditions, we depicted a mother an daughter enjoying a their indoor bed fort during the holiday season. Can't quite camp and do everything you'd like to outdoors? Share the moments by building a fort and cozying up with a good book, popcorn and anything that would complete the experience. Here is a sample of the assets created for this sales period from 11/26-11/29. Cheers to new traditions.


Cyber Monday Sale

The creative for this promotion centered around the idea of cheering to new gatherings. We realized that several families are celebrating holiday's differently this year. Zoom video calls have become somewhat of the norm for so many across the nation. We decided relate on the level by depicting a "zoom giving scene" for those gathering around a monitor to open gifts during the season. We created a slew of assets for this single day promotion. Here is a sample of the assets I created.


Cyber Week Sale
Our holiday traditions continue with a scene that rallies a family together while they partake in paper craft activities. Since immediate families were more likely to spend extra time together this year, partaking in a holiday themed decorative activity felt most appropriate for boosting the holiday spirt. Displaying this active scene in the bedroom gave us the opportunity to aid the customers perception of how our products felt. This is a characteristic we attempt to embed in a lot of our lifestyle photography. Including a full family in the mix made it a bit easier in some respects.


Holiday Spend Hurdle

In our final scene we depict the same family from our Cyber Week sale. Imagine setting up a tripod taking a family photo with matching PJs. This was a tradition that we anticipated could be more prevalent due to the circumstances.  Let's face it, 2020 kinda sucked... we know that. But we didn't want to add to the gloominess that was overly abundant. From our marketing studies we found customers were steering away from brands that were somber in their approach. So with that in mind we tackled on a scene where we shot this scene in a third person view. This was a new challenge for us. But we took the risk to try something new. This family could be us. This family could be you. Making the best we can of the season while creating new memories this holiday and for a better start into the new year.