Reenie's

Reenie's

Designing a website for Brooklyn-based pop-up chef, recipe developer, and food writer.

New Site Launching Q3 2024

Design + Dev

Rais Ahmed

Brand

Overview

Mehreen Karim is a Brooklyn-based pop-up chef, recipe developer, and food writer. Two Are, a creative studio based in Brooklyn worked on the brand including logo, type, and color, and creative assets. We took the brand, and translated it to achieve the goals for Mehreen's site. These goals included hosting all of Mehreen's recipes, writing across various publications, and creating a home for all of her pop-ups hosted around the country.

Research

1

Preliminary Research

Before we defined scope and design requirements, we did a round of preliminary research including a round of comp analysis against competitors in the space, as well as leading e-commerce brands to identify common patterns and best practices.

We also conducted a survey asking our users to identify existing pain points they had experienced while browsing on Pair's product page. We tested among two separate cohorts: the loyal user that has been with Pair for 2+ years, and newly adopted customers who recently had made a purchase.

2

Usability Testing

Since this page refresh was introducing multiple net-new components for our users, we wanted to conduct a round of usability tests to validate the designs we put together. We ran 2 separate unmoderated tests via UserTesting. Each test included 5 participants, with one group being existing Pair users, and the other group being users who have never interacted with Pair's website.

3

A/B Test

Once the designs were ready and built by engineering, we launched an A/B test to 50% of traffic on site. Because this was a page that experienced high traffic, this acted as a final round to validate the updated designs. (spoiler: the variant vastly outperformed the control)

Process

Kick-Off

Once preliminary research has been conducted, and insights have been shared out to the broader team, the official kick-off meeting takes place. Here, we include our lead PM, designer, and engineer to discuss the scope of the project at-hand.

We identified several areas of improvement to tackle a decreased bounce rate, while boosting conversion:

Updated Photo Carousel

Our previous image carousel was clunky, took up too much vertical screen real estate for mobile screens, and performed poorly.

Information Hierarchy

From our preliminary survey conducted, we identified that both our loyal users, along with guest visitors had a difficult time finding core pieces of information including frame shape, size, material, shipping detail, among others.

Recommended Products

We hypothesized that due the lack of recommended/similar products, users would bounce much earlier in their journey when it was avoidable.

Design Rounds + Tech Feasibility

Referring to the areas of improvement, the first round of design occurs. During this process, we conduct a check-in with the pod every other day to ensure that the features being designed are feasible for engineering, and in turn, don't create any added scope to the project/roadmap.

Usability Testing

Depending on the project at-hand, we discuss the need of running a usability test. In the case of the product page, because it was a larger refresh of the page, we decided to put it in front of our users (and non-users) to gather further insights before launching.

At Pair, we use UserTesting to conduct our usability studies. Utilizing unmoderated sessions, we created a script and set of tasks for the users to complete to ensure the designs were validated. We defined what is considered a successful usability test,

Solution

Preliminary Research

Before we defined scope and design requirements, we did a round of preliminary research including a round of comp analysis against competitors in the space, as well as leading e-commerce brands to identify common patterns and best practices.

We also conducted a survey asking our existing users to identify existing pain points they experienced while browsing on Pair's product page. We tested among two separate cohorts: the loyal user that has been with Pair for 2+ years, and newly adopted customers who recently had made a purchase.

Research

For this initiative, we conducted two separate rounds of research:

1

Preliminary Research

Before we defined scope and design requirements, we did a round of preliminary research including a round of comp analysis against competitors in the space, as well as leading e-commerce brands to identify common patterns and best practices.

We also conducted a survey asking our existing users to identify existing pain points they experienced while browsing on Pair's product page. We tested among two separate cohorts: the loyal user that has been with Pair for 2+ years, and newly adopted customers who recently had made a purchase.

2

Usability Testing

Since this page refresh was introducing multiple net-new components for our users, we wanted to conduct a round of usability tests to validate the designs we put together. We ran 2 separate unmoderated tests via UserTesting. Each test included 5 participants, with one group being existing Pair users, and the other group being users who have never interacted with Pair's website.

3

A/B Test

Once the designs were ready and built by engineering, we launched an A/B test to 50% of traffic on site. Because this was a page that experienced high traffic, this acted as a final round to validate the updated designs. (spoiler: the variant vastly outperformed the control)

View