Flora + Fiona
UI/UX Design • Branding • Product Design
A portfolio project developed for the Google UX Design specialization. Flora + Fiona is a local boutique with set and custom arrangements. Below are social graphics, UI samples for the website and mobile delivery app, and notes on the UX.
Creating a User Journey
To create the user experience for Flora + Fiona, I developed a series of user personas and recruited real-life participants to understand their pain points around ordering floral arrangements. I then asked the real-life participants to conduct a card-sorting exercise to develop the UX features and start a journey map. I used an online AI model to simulate a card-sorting activity for fictional personas.
Example 1: Sally Concepcion, 32 years old
Persona: Sally recently graduated from UPenn with a JD and Masters in Computation and Information Technology. During school, she gave birth to the beautiful Jana. While school was difficult, she lived close to her family, who were able to support her during busy exam seasons. Her job as a first-year associate, however, is in LA. Her office bestie has a birthday coming up; Sally wants to show she cares.
Goals
Deliver a floral arrangement to her best friend with her favorite flowers on her birthday.
Save money to support herself and her daughter.
Find a service she can rely on to impress her friends.
Frustrations
Busy, doesn’t have time to get to a florist.
Needs to stay within budget.
Not many florists open after work.
Journey (Mobile)
Sally looks into floral arrangement delivery options and comes across Flora + Fiona. She enters the mobile site where she is prompted to sign in or continue as a guest. Sally arrives at a welcome screen and has the option to set her preferences in a welcome quiz.
Sally browses the home page and can filter her options by occasion, color, or mood. Sally also can set budget constraints. Sally sees options for pre-made and custom arrangements. While scrolling, Sally adds viable options to a Favorites section.
After comparing her options, Sally adds her choice (custom arrangement) to the cart and selects the option to add a vase and a custom message. Upon checkout, Sally is prompted to enter her custom message and describes her friend’s aesthetic preferences for the custom arrangement. Sally then sees her total and verifies delivery details, delivery dates, and payment information.
Sally arrives at a confirmation screen. She is given the option to contact Flora + Fiona if she needs to adjust her order. She receives an email with the same information.
On the delivery date, she receives a photograph of the delivery in her email. Sally may provide feedback or leave a review.
**The mobile site must have similar functionality to the app since many people look to floral delivery as an occasional gift. Regular users may download the app and have easier access to saved options and preferences.
Sally can trust Flora+Fiona’s taste since she can access their floral portfolio on Instagram, through a product gallery, and on their website.
Example 2: Angelica Jones, 26 years old
Angelica is a powerhouse! She worked in event planning throughout college and is now an independent event planner. Entrepreneurship is no joke. She has to coordinate all the vendors and ensure all her clients are happy. She needs a reliable florist with a good eye.
Goals
To create a beautiful atmosphere specific to her client’s personalities.
Display love and care in every aspect of event planning.
Adapt to client aesthetics while minding client budgetary constraints.
Frustrations
Differing client specificities.
Limitations around bulk ordering.
Needs a reliable florist that can be available at random times due to differing events.
Journey
Angelica is looking for a local florist to assist with events. She comes across Flora + Fiona when doing an online search for local options. She finds that Flora + Fiona has an event planning window. She saves this for a later date.
She also notices that she can order custom arrangements. Angelica favors Flora+Fiona since she can easily order custom arrangements with specified preferences for smaller events.
Angelica is planning for a corporate dinner this weekend. She orders five custom arrangements with vases. She does not need to add a message. She goes to checkout and can add preferences in the comments section prior to purchasing her cart.
** The site/mobile app needs to have a chat function for user changes and questions. The chat will have an automated function and option to speak to the floral team during business hours.
** The rest of Angelica’s journey is not pictured.
Angelica comes back to Flora + Fiona for an event she’s planning six months from now. She fills out the online contact form and receives an email for Flora + Fiona event planners.
Idea: Flora + Fiona can have a separate site for event planners.
Angelica can view pre-made arrangements or set up a call to develop a custom aesthetic for her event. Angelica still has the option to input event details such as floral preferences, quantity, etc. Flora + Fiona offers discounts for bulk ordering in advance.
