urban poppy

Unifying the Multi-Platform Shopping Experience for a Local Boutique

Team

Rae Chen, Xier Che, Wendan Guo

Timeframe

3 months

urban poppy

Unifying the Multi-Platform Shopping Experience for a Local Boutique

Team

Rae Chen, Xier Che, Wendan Guo

Timeframe

3 months

urban poppy

Unifying the Multi-Platform Shopping Experience for a Local Boutique

Team

Rae Chen, Xier Che, Wendan Guo

Timeframe

3 months

background

Urban Poppy is a famous botanical product retailer located in the historical district in Savannah, GA. Recently, it opened a new store in a quiet neighborhood far awar from downtwon Savannah following the sucess of its first store.


I led a team of 2 service designers to overhaul Urban Poppy's digital presence and physical store layout of the new store. Viewing the store as a system, interior plan, shopping experience, website, and brand are redesgined.



Urban Poppy's website has a chaotic IA that present numerous navigational obstacles. Customers find it challenging to place orders online.

Current Website

Urban Poppy's website has a chaotic IA that present numerous navigational obstacles. Customers find it challenging to place orders online.

Current Website

Urban Poppy's website has a chaotic IA that present numerous navigational obstacles. Customers find it challenging to place orders online.

Current Website

New Store

The new store is hard to find and lacks a strong online presence, but customers enjoy a much better experience when they visit in person.

New Store

The new store is hard to find and lacks a strong online presence, but customers enjoy a much better experience when they visit in person.

New Store

The new store is hard to find and lacks a strong online presence, but customers enjoy a much better experience when they visit in person.

Recognizing the problem, we then ask:

How can we let the website and store offer a seamless and unified shopping experience for customers?

Recognizing the problem, we then ask:

How can we let the website and store offer a seamless and unified shopping experience for customers?

Recognizing the problem, we then ask:

How can we let the website and store offer a seamless and unified shopping experience for customers?

research

Understanding Stakeholders' Context → Users' Experience → Analysis

Stakeholder Map

By considering all the main roles involved in the business, I was clear about waht kind of information to collect and decided to focus on local residents and neighbor.

SEO Analytics - How people find the website?

I delved into how people typically find Urban Poppy’s website. By running SEO analytics, I discovered that most visitors access the site via links on partner platforms, such as perfume and local flower delivery websites, and they usually land directly on the product pages. In terms of website navigation, this reveals that the product page is crucial, as few visitors start their journey from the homepage.

Business Analysis

Advantage 1:
Providing a wide range of service and products in both stores

The stores sells fragrances, jewelry, baby toys, clothes and many other kinds of botanical products. It also has flower bar that make bouquet for cusotmers, as well as a same-day flower pick up service.

Advantage 2:
Offering flower arrangement workshop in the new store

In the back of the new store, there is a large space left for shop owner to hold the workshop.

Disadvantage 1:
The website fails to capture the brand's aesthetic appeal

Despite the store owner's careful attention to product displays, interior design, and overall ambiance within the physical store, the website's design remains plain and unattractive.

Disadvantage 2:
The flower workshop has low visibility

The workshop, located at the back of the store, is not visible to pedestrians passing by, making it difficult for them to notice that an event is taking place.

Understanding Stakeholders' Context → Users' Experience → Analysis

Downtown Store and New Store

The business owner has different visions for the two stores. The excellent location of the downtown store ensures a steady flow of customers, including both visitors and local residents. In contrast, the new store stocks fewer products and experiences lower foot traffic. However, its unique selling point is the flower arrangement workshop.

Persona

While Caleb and Joanna are both local residents, they live in different areas and visit the store for different reasons. Despite their varied purposes, both have had frustrating experiences with the website.

Case 1: Downtown Store

Caleb Mitchell

23 / Male

Background

He lives in downtown Savannah and has a passion for perfumes and flowers. Urban Poppy is his go-to store; he loves everything from the products to the store's atmosphere.

Consumption Habits

He visits the store every time he walks his dog and passes by. He finds it relaxing to be there, sometimes picking up an item or two, or just grabbing a bouquet.

Unsatisfied Experiences

He once tried to order a bouquet online when he couldn't visit the store in person. However, the website's confusing layout and unusual product names made the process a nightmare, and he eventually gave up.

Case 2: New Store

Joanna Sanders

34 / Female

Background

Joanna was born and raised in Savannah, One of her hobby is to discover the neighboorhood.

Consumption Habits

She noticed the store when she's exploring the neighbourhood, and she singed up for the workshop and came every month.

Unsatisfied Experiences

She need to call the business owner every time if she need inquiry of the workshop and has change of plan. She cannot find a dedicated web page that has all the appointment information.

Service Blueprint

Understanding Stakeholders' Context → Users' Experience → Analysis

At the end of research…

We developed opportunities from research; the project would include both a redesign of the interior layout and the website.

At the end of research…

We developed opportunities from research; the project would include both a redesign of the interior layout and the website.

At the end of research…

We developed opportunities from research; the project would include both a redesign of the interior layout and the website.

design

Storyboard

A/B Testing

We developed two versions of the homepage and product page with distinct goals: the homepage was designed to test different UX writing styles, while the product page focused on evaluating layout and information architecture. To determine which version performed better, we conducted A/B testing, measuring key metrics like time spent on the page, click-through rates, and ultimately, conversion rates.

For this testing, we recruited a diverse group of 10 participants. Below are some of the tasks we assigned and the results obtained:

Click Heatmap

It's clear that version 2 of the interface confuses participants, particularly in the product hero section.

Click Heatmap

It's clear that version 2 of the interface confuses participants, particularly in the product hero section.

Design detials:

UX Writing details:

Result 1/2 - The Store Layout

Functional spaces that enable customers to see the flower design workshop as they pass by the store.

Result 1/2 - The Store Layout

Functional spaces that enable customers to see the flower design workshop as they pass by the store.

Result 1/2 - The Store Layout

Functional spaces that enable customers to see the flower design workshop as they pass by the store.

Result 2/2 - Redesign of the Website

Updating the information hierachy and brand aesthetics of Urban Poppy's website to align the online presence with the in-store experience, creating a cohesive customer journey.

Result 2/2 - Redesign of the Website

Updating the information hierachy and brand aesthetics of Urban Poppy's website to align the online presence with the in-store experience, creating a cohesive customer journey.

Result 2/2 - Redesign of the Website

Updating the information hierachy and brand aesthetics of Urban Poppy's website to align the online presence with the in-store experience, creating a cohesive customer journey.

Let's Compare and Contrast…

Current

Irrelevant images displayed in the home page.

New

Updating navigation menu to align with user's mental model

Current

The slection and combination of products are complicated.

New



Remove terminology and make the bundle selection structure clear.


Let's Compare and Contrast…

Current

Irrelevant images displayed in the home page.

New

Updating navigation menu to align with user's mental model

Current

The slection and combination of products are complicated.

New



Remove terminology and make the bundle selection structure clear.


Let's Compare and Contrast…

Current

Irrelevant images displayed in the home page.

New

Updating navigation menu to align with user's mental model

Current

The slection and combination of products are complicated.

New



Remove terminology and make the bundle selection structure clear.


Final Design

Workshop and New Store Information

Adding the workshop information in the homepage to increase awareness of the new store.

Product Page

When purchasing a bouquet, customers are presented with a variety of bundle options. Organizing these options in a clear hierarchy significantly reduces guesswork for the buyer. Additionally, offering a broader selection of product images enhances the shopping experience by providing a more comprehensive visual understanding of what is being purchased.

Adding Customer Review

Incorporating customer reviews that include images from actual customers enhances the credibility of the product. This addition serves as a powerful testament to the quality and appeal of the bouquets, directly from the perspectives of those who have experienced them firsthand

Smooth Check out Process

Customers have the ability to review all items they've added to their shopping cart before proceeding to checkout. This feature allows for any necessary modifications, ensuring that buyers can make changes to their selection with ease.

Final Design

Workshop and New Store Information

Adding the workshop information in the homepage to increase awareness of the new store.

Product Page

When purchasing a bouquet, customers are presented with a variety of bundle options. Organizing these options in a clear hierarchy significantly reduces guesswork for the buyer. Additionally, offering a broader selection of product images enhances the shopping experience by providing a more comprehensive visual understanding of what is being purchased.

Adding Customer Review

Incorporating customer reviews that include images from actual customers enhances the credibility of the product. This addition serves as a powerful testament to the quality and appeal of the bouquets, directly from the perspectives of those who have experienced them firsthand

Smooth Check out Process

Customers have the ability to review all items they've added to their shopping cart before proceeding to checkout. This feature allows for any necessary modifications, ensuring that buyers can make changes to their selection with ease.

Final Design

Workshop and New Store Information

Adding the workshop information in the homepage to increase awareness of the new store.

Product Page

When purchasing a bouquet, customers are presented with a variety of bundle options. Organizing these options in a clear hierarchy significantly reduces guesswork for the buyer. Additionally, offering a broader selection of product images enhances the shopping experience by providing a more comprehensive visual understanding of what is being purchased.

Adding Customer Review

Incorporating customer reviews that include images from actual customers enhances the credibility of the product. This addition serves as a powerful testament to the quality and appeal of the bouquets, directly from the perspectives of those who have experienced them firsthand

Smooth Check out Process

Customers have the ability to review all items they've added to their shopping cart before proceeding to checkout. This feature allows for any necessary modifications, ensuring that buyers can make changes to their selection with ease.

REFLECTION

Given the constraints of our timeline, our engagement was primarily limited to interactions with essential stakeholders, such as the business owner and a select group of customers. This focused approach, while beneficial for initial insights, underscored the importance of broadening our stakeholder engagement in future phases. Expanding our outreach to include a wider array of stakeholders will be crucial.


The initial testing phase of our prototype involved the business owner and a handful of customers. While this provided valuable initial feedback, the limited scope of our user testing highlighted a significant gap in our research process. To move forward effectively, it's imperative that we extend our user testing to encompass a broader and more diverse participant pool.

Thanks for looking at my case study!

© 2024 Xier Che. All rights reserved. .

© 2024 Xier Che. All rights reserved. .

© 2024 Xier Che. All rights reserved. .