FLORA
A Flower Catalogue Application
Project Overview
Flora is a conceptual project undertaken as part of the Google Ux Design Certificate. The project was developed from the Sharpen prompt, design a flower catalogue for a florist. It provides users with detailed information on flowers and allows them to purchase flowers/bouquets online.
My Role
UX Designer
Research
Wireframing
Prototyping
Testing
Goal
Design an app that provides users with easily accessible information on flowers and their care.
Duration
October 2021 - December 2021
Problem Statement
Users would like increased ability to customize bouquets and greater convenience when acquiring flowers.
Design Process
-
01. Research
User Interviews
Competitive Analysis
-
02. Define
Personas
Storyboards
-
03. Ideate
User Flow
User Journey Map
-
04. Prototype
Sketches
Lo-Fi Wireframes
Hi-FI Prototype
-
05. Test
Usability Test
Insights
01. Research
User Interview
I interviewed three participants. I also assumed people wanted to order flowers online and door to door delivery. These assumptions were subsequently validated after the interview process.
What country and state/parish do you live in?
What do you do for work?
Can you tell me about a typical day in your life?
How often in your daily life do you use technology?
What do you mainly use technology for?
Why do you use flower catalogues??
What would you use a flower catalogue application for?
When using a flower catalogue application, is there anything you expect to be included?
If you were using a flower catalogue application, what features would you like to see? or what would you like to see this application do?
What feature would you hate to see included?
What other products/applications have you used to purchase/discover flowers?
What do you like and dislike about using those other products?
Competitive Analysis
Key Takeaways
Aftercare Instructions
Users were frustrated that when they took their bouquets home, they did not know how to care for them.
Proposed Solution: Including aftercare instructions in the application
Customization
Users expressed the desire for the ability to further customize their bouquets.
Proposed Solution: Custom Orders
Convenience
They also did not want to travel to purchase flowers.
Proposed Solution: Online Payment And Delivery
02. Define
Personas
Storyboards
Big Picture
Close Up
03. Ideate
User Flow
User Journey Map
04. Prototype
Paper Sketches
Wireframes
Problem #1: Unable to create customized bouquets
Solution: Addition of Custom Orders
Problem #2: Feels frustrated that there is no information on flower aftercare
Solution: Inclusion of Aftercare in the product description
Problem #3: Hates travelling to purchase and collect flowers
Solution: Online Payment and Delivery
Mockup
HomePage
Checkout
Users can pay online via credit/debit card payment as well as see their delivery date ad fee.
Product Page
This page includes care information when customers are purchasing bouquets. It also shows if that bouquet or flower is in stock.
Custom Order
A progress bar shows the user where they are in the process of making a custom order. Users also have the ability to select the types of orders as well as add desired flowers or accessories.
05. Test
Usability Test
Five participants participated in the tests via Maze.
1st Round of Testing- Low Fidelity Wireframe
Research Goals
Determine if the app is easy to use.
Determine if changes are necessary to the user interface to improve the user experience.
Insights
For some users, the layout and content on the customization page are not clear.
Users need better cues to identify where things are and where to go next.
The checkout flow is broken. Most participants gave up on completing the checkout as they were stuck.
Labels, titles and buttons need to be clearly defined so that users can identify what is clickable more easily
Changes
Detailed titles/headers were filled in.
Appropriate Icons were also added in.
2nd Round of Testing
Research Goals
Determine if the app is easy to use.
Determine if the changes made solves the issues the user experience with the app previously.
Insights
Most users are not getting stuck in the checkout process
Users didn't find the customization flow easy to follow
Users need more cues and familiar processes to make the flow more intuitive
Users found difficulty with the type on the buttons
Users need more detailed/unambiguous labels for buttons
Changes
Added a Progress Bar to the customization process..
Swapped ‘Next’ in the customization section to ‘Continue To Accessories’ and ‘Continue To Checkout’.
Swapped ‘Add Card’ to ‘Use This Card’ as some users were confused with the term add card / save this address when they are checking out as a guest.
Next Steps
More usability testing regarding the customization feature.
Conduct A/B Testing
Expansion of the search and a filter feature so users can search for specific flowers easily and quickly
Include Order Tracking Feature