urban poppy

Create a Unified Shopping Experience for a Local Boutique in Savannah, GA

Role

Design Lead

Timeframe

2023 (2 months)

Tools

Figma, Illustrator, Photoshop, UserTesting

Tools

Figma, Illustrator, Photoshop, UserTesting

urban poppy

Create a Unified Shopping Experience for a Local Boutique in Savannah, GA

Role

Design Lead

Timeframe

2023 (2 months)

Tools

Figma, Illustrator, Photoshop, UserTesting

Tools

Figma, Illustrator, Photoshop, UserTesting

urban poppy

Create a Unified Shopping Experience for a Local Boutique in Savannah, GA

Role

Design Lead

Timeframe

2023 (2 months)

Tools

Figma, Illustrator, Photoshop, UserTesting

Tools

Figma, Illustrator, Photoshop, UserTesting

overview

Urban Poppy, a botanical product retailer based in Savannah, GA, recently expanded by opening a new store following the success of its initial location.


I led a team of 2 service designers to overhaul Urban Poppy's digital presence and physical store layout. The website redesign focused on enhancing usability and increasing awareness of both the new store and the workshops hosted there. Simultaneously, the store layout was reimagined to offer a seamless and unified shopping experience

23%

Increase of awareness of the new store opened

40%

Rise in customer satisfaction scores

2.6 min

Decrease in whole process of ordering products online

problems

User-Unfridendly Website

The current website's design is outdated, and its information architecture is chaotic, presenting numerous navigational obstacles. These include camouflaged links, whimsically named links, and misleading images that act as 'scent blockers', disrupting the user's journey.


Consequently, customers find it challenging to place orders online due to the layout's complexity and the overwhelming choices available for bouquet bundles, compounded by confusing product names.

Misalignment between the Website Content and the Store Experience

The website doesn't properly show off what's available in the store, so it doesn't capture the great experience customers have there. It's hard for customers to find clear information about the store, making their online experience less smooth and straightforward.

01 understanding stakeholder's context

Stakeholder Map

By considering all the main roles involved in the business, I am clear about what kind of information to collect for design.

Competitor Analysis

To understand Urban Poppy's strengths and weakness, I did a competitor analysis with other boutique and floral design stores in Savannah. I found that the website usability is low comparing to other brands.

SEO Analytics

I dig deeper into exactly how people access to the website.

I ran SEO analytics and found out that most people access the website through Urban Poppy’s partner platforms, and went directly to the product page.

Business Analysis

After the initial research, I found Urban Poppy's 2 advantages and 2 weakness:

02 understanding user's experience

Old Store and New Store

Urban Poppy has 2 stores, the old store in downtwon Savannah that attracts both local residents and visitors; the new store that located in a quiet neighbourhood that targeting only local residents.

Persona

Based on the 25 contextual interviews in both downtown store and the new store, I generated 2 Persona :

Service Blueprint

03 Analysis

The website need to improve its online shopping flow and adding information about workshop held in the new store, and the new store need to be easier to find.

Testing

A/B Testing

We designed 2 versions of home page and product page, and conduct A/B testing to identify which version of each page - the homepage and the product page - would outperform the other in terms of key metrics such as time spent on page, click-through rates, and ultimately, conversion rates.


To conduct this A/B test, we recruited a diverse group of 10 participants. These individuals were selected to represent our target audience as accurately as possible.


The test was conducted in a single room, designed to mimic a comfortable browsing experience. Participants were provided with a series of tasks designed to guide them through key functionalities and features of each page. Throughout the testing session, we employed a variety of tools and techniques to capture detailed feedback and behavioral data. This included screen recordings, click-tracking, and direct observation, complemented by post-task interviews to gather qualitative insights.


The following is part of the tasks and results.

design

Website Redesign

The website provides a no-burden online shopping experience and information about workshop.

Store Layout Redesign

Redesign floow plan of the shop to let the workshop more visible and increase awareness when people walk pass by.

Storyboard

Let's Compare and Contrast…

Website Sitemap

Store Layout

Current

Workshop is not visible to cusotmers and the shop area is small.

New

Cutomers can see there's a flower design worrkshop as they pass the store.

Website - Home Page

Current

Irrelevant images displayed in the home page.

New


Modified navigation bar and clear call to action.

Website - Product Page

Current

The slection and combination of products are complicated.

New


Remove terminology and make the bundle selection structure clear.

final solution

A Smooth Hybrid Online and In-Store User Experience

  1. Navigation Menu Update

To better fit navigation system with user's mental models, we redesgined the navigation system. We also added the workshop information in the homepage to increase awareness of the new store.

  1. Product Page Update

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.

  1. 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

  1. 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.

  1. Store Layout

Relocating the workshop from the back to the side of the store significantly increases its visibility to passersby. Additionally, expanding the shop area allows for a more extensive display of products, enhancing the overall shopping experience

REflection

Enhanced Stakeholder Engagement

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.

Extended User Testing

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.

If you want to know more about the project, please schedule a meeting with me! 😆

previous project

Sidekick

Sidekick

© 2024 Xier Che. All rights reserved.

© 2024 Xier Che. All rights reserved.

© 2024 Xier Che. All rights reserved.