Project overview
The product:
We are creating a new and exciting app that will help users purchase flowers by presenting a chance to view how the arrangement looks before purchasing, as well as making the transaction process quick and efficient.
Project duration: November 2022-January 2023
Project overview
The problem:
Customers who like to purchase flowers would like to preview their bouquet beforehand. They would also like to see a delivery time and date confirmed at the end of their purchase.
The goal: We are creating a new and exciting app that will help users purchase flowers by presenting a chance to view how the arrangement looks before purchasing, as well as making the transaction process quick and efficient.
Project overview
My role:
• Lead UX Designer
• Lead UX Researcher
Responsibilities:
• Researching
• Wireframing
• Sketching
• Creating Prototypes
Understanding the user
● User research
● Personas
● Problem statements
● User journey maps
User research: summary
In this study, the purpose was to find out what customers would like to have in a flower shop app such as previewing the bouquet before purchase confirmation, and what features were desireable to make the shopping experience more comfortable for the user. A usability study was conducted to include 5 participants of various genders, ages and users with special needs. My assumption was that most of the users would find the design of the app appealing and easy to use. After the study, I find that specific types of colors and styles of typography really make an impact on the user experience.
User research: pain points
Creating a bouquet is frustrating
Pain point
Create a path that is easily seen on the create your own screen
Adding accents was difficult to do
Confusion as to where to click to proceed with order
Pain point
Users need to use an icon that is easy to find to add accents
Pain point
Create paths that are easy to find to make ordering run smoothly
Persona: Cathy
“Sometimes I wish I can pick out my designs ahead of time so I can get the flowers quicker.”
Problem statement: Cathy is an event planner who needs see the arrangements first because it might not be what she envision when the order is prepared.
Cathy
Age:
Education:
Hometown:
Family:
Occupation:
30 years old New York Flower School
Miami, Florida
Single, 2 dogs Event planner
Goals
● To have the option for delivery or pickup in a preview app for flowers
● To have the option to arrange the design myself ahead of time.
Frustrations
● Having to go into the store to pick out designs then have to wait
● Not being alerted for estimated pick-up time.
Cathy is a 30-year-old woman who lives alone with her two dogs. She works as an event planner and distributes floral arrangements for events such as weddings, business conferences, etc. Sometimes Cathy would like to know how a floral arrangement will look like before actually processing an order, which will save her time at the floral shop, so that it can be ready by the time she picks up her orders.
User journey map
Persona: Cathy
Goal: To order flowers on the phone and pick up at the shop in a timely manner
Creation of the app must be made to be easy to navigate, while reducing stress and anxiousness, so that trust is built between the user and the app for the required purchase.
TASK LIST
A. Gather desired selections from client
B. Write backup plan in case 1st selection is unavailable.
A. Stand in line and wait for turn to be served
B. Get to counter and inquire about order placed on phone
A. Ask florist for a container to hold arrangments
B. Gather specific nutrients for certain types of flowers to keep them fresh during event.
Image of user journey map
A. Unload flowers from truck
B. Set up flowers in display space
C. If applicable, store flowers in client’s home where they will stay fresh.
A. Look up next client on computer
B. Look at type of floral arrangements they need
C. Prepare call to florist for next client’s order
FEELING ADJECTIVE Frustrated, anxious Anxious, impatient Relaxed, anxious Stressed Satisfied
IMPROVEMENT OPPORTUNITIES
Ability to preview how arrangement will look
Update customer via text or call about estimated time of availability for pickup
Florist can provide appropriate containers for storage and nutrients
Have containers that are easy to unload from truck without strain
Have a pre-order form ready for input for next client.
Drive to florist shop to pick up order Situate flowers in an appropriate container Deliver flowers to client’s home or event space
back to office to take care of next order
ACTION Call florist and place order
Go
Starting the design
● Paper wireframes
● Digital wireframes
● Low-fidelity prototype
● Usability studies
Paper wireframes
This process involved trying to find a clear and concise way of finding the right buttons for various options on placing orders for flowers.
Digital wireframes
This home screen allows users to see clearly what category to use to start their order process in order to make the transaction easy and comfortable.
This feature allows users to create their own bouquet and preview how it would look visually on display
Users can choose to pick a readymade bouquet or view their previous orders
Digital wireframes
This screen allows users to pick various flowers and view them in the vase located in the center of the screen.
User can click on the various choices of flowers and drag it to vase to preview bouquet
Total amount adjusts according to quantity put into vase
Low-fidelity prototype
This is the first revision of the Low-fidelity prototype with the main features listed in each screen.
See link below:
https://www.figma.com/proto/bRVeoIVBv2
yJOLsGp4umRS/FloweShopApp?nodeid=1%3A5&scaling=scale-down&pageid=0%3A1&starting-point-node-id=1%3A2]
Usability study: findings
The first round, participants we confused with the layouts of the screens. After some revisions, most of the participants found the screens to be more clearly defined.
Round 1 findings
5 out of 5 participants thought the create your own section was confusing 1
Round 2 findings
1
Users liked the preview feature and had clear directions
2
Almost all of the participants agreed that confirming order was the easiest tasks
Most of the participants found the create your bouquet feature very interesting and attention grabbing 3
2
Participants saw clearly when delivery time and date were located
Process from start to finish was easy for purchasing 3
Refining the design
● Mockups
● High-fidelity prototype
● Accessibility
Mockups
We created the home screen with clearly defined buttons to make the order process user-friendly.
After
Before usability study
usability study
Mockups
Clear directions were noted as to how to create your own bouquet by clicking specific items to add to the “bouquet” in the center of screen.
Before usability study
After usability study
Mockups
High-fidelity prototype
Link available at:
https://www.figma.com/proto/bRVe
oIVBv2yJOLsGp4umRS/FloweShopA
pp?node-id=121%3A5&scaling=scaledown&page-id=121%3A4&startingpoint-node-id=121%3A5
Accessibility considerations
1 2 3
color palette in align with screen reading functions for easy navigation
Icon located at the bottom of each screen for language selections
Settings icon on each screen is used for various accessibility functions withing the application
Going forward
● Takeaways
● Next steps
Takeaways
Impact: What I learned:
The unique feature of creating your own bouquet seems to attract the participants since it is a feature not really seen in floral purchase applications.
“This is very different. I like it and I’d like to see what other ways can be done to create a bouquet.” Participant A
It’s very interesting the various opinions as well as similarities on how users view the floral app. It’s also surprising how some users had a contrast of opinions on how difficult or easy it was to use when navigating around the application.
Next steps
Another usability study will be conducted once more features will be added to several screens to make the experience more userfriendly.
Various ideas on how to create a bouquet will be explored to see how participants respond to the transaction processes.
Additional items for purchase to compliment floral purchases will be added to see if users will be encouraged to use the app more often.
1
2 3
Let’s connect!
For more information regarding this case study or to view additional studies you can contact me via email at: christineeusebio777@gmail.com
