Ye Olde Floristry

Ordering flowers online made easy

Case Study

Role

UX Designer 

Responsibilities

User Research

Art Direction 

UX Design

Happiness held is the seed; happiness shared is the flower

Ye Olde Floristry is a specialty flower shop that has recently expanded their business online. They offer floral arrangments, bouquets and venue decorating for anyone looking to add a little of nature's bounty to their event. The company has wants to create an easy to use online shop that allows customers the option to order online.

The Problem

Ye Olde Floristry needs a way for their customers to easily browse and purchase online. Many customers don’t like waiting for their orders and would prefer to pick up at a designated time.

The Goal

Design an app  for Ye Olde Floristry that allows users to browse stock and place orders online for pick-up or delivery.

Research Focus

I conducted user interviews, which informed the projects' direction, organizing that data and building a user journey map to better understand users and build personas. 

During the interview process we learned that many people want to buy flowers but don’t enjoy the hassle of waiting in line at the store, dealing with busy holiday crowds and limited selection. This cause users to become frustrated or overwhelmed which caused unnecessary stress or dissapointment.

User Pain Points

Busy Schedule

Users often are busy at work and with life and can't always make it to the store. They want to be able to order on their own time and pick-up their purchases on their own time.

Limited Selection

Users find that they are unable to find exactly what they want when they want it, or are often left with the shops leftovers.

Too Crowded

Flower shops are often small and overcrowded during peak times. Sometimes it's difficult to find someone who can answer my questions.

Challenges

The challenges of creating this website will be in ensuring users are able to easily find products they are looking for, place orders and pick-up at their convience. Online checkouts can be frustrating for users as there is no guidance other than the user-experience. Understanding what creates an intuitive user journey from placing a product in your cart, all the way to the checkout confirmation page will be top of mind for this project.

Opportunities

By creating this online experience, users are going to be able to find what they want for when they want. There is a clear oppotunity for users to enjoy browsing at their own convenience as well as reduce customer wait-times and increase sales for the company.

The Process

I wanted to create a user intuitive sitemap that focused the user's journey through a simple navigation menu. The goal was to create an easy way for users to find products and then navigate to the checkout.

I began by drawing paper wireframes. I wanted to focus on designs that used symbols and images to create an intuitive user experience. I began creating with multiple screen sizes in mind to focus on a design that would translate easily from desktop to mobile screens.

I expanded further on the initial design to create a more concrete set of steps and icons that made it easy for users to find the checkout, add to cart, check cart and then check-out. Prioritizing visual cues to the user was capital in making a functional design.

View the low-fidelity prototype here

Usability Study Findings

Redundant Tasks

Users felt typing out your address for both the shipping and billing was redundant

Calendar Option

Users felt the pick up times were confusing and requested a calendar that they could interact with.

Back Button?

Users were worried about going back a screen in the checkout. Requested an easy way to edit information.

Refining the Design

Before usability study

After Usability Study

Based on the feedback from the usability study I added an interactable calendar so user’s could see which days they could pick up and choose one that best suits them. By adding simple edit buttons on the review page I was able to accommodate users who might of typed something incorrectly. This means users can easily navigate using the website rather than browser back buttons. Furthermore implementing variable font sizes help create hierarchical structure and helped to guide the users eye.

View the high-fidelity prototype here

It was important to both users and the client that the website experience be responsive. Users identified that florist websites don't always translate well when browsing on phones. It was important that we addressed this pain point with a responsive design for users on the go or without access to a desktop computer.

Impact with purpose

Our target users shared that the navigation was easy to understand and the addition of a few key buttons helped users experience an easier checkout process. Adding a responsive build for the website means users can order while on the go and exprience the same level of quality in their user journey.

Takeaways

I learned that focusing on user feedback really helps inform design choices and forces you to experiment with new ideas to create user driven design. Even the smallest change such as adding an edit option or a calendar can have the largest quality of life improvement for your users.