Overview
The product:
Flowers with Feelings is a flower delivery app that aims to reduce the time, effort, and stress involved in placing a flower order in person. The app is aimed at a variety of demographics who order flowers from a florist at least once a year.
Duration:
March - June 2023
My role:
Lead UX/UI Designer and Researcher
Responsibilities:
User research, wireframing, prototyping, user research, and UI design
The problem:
There isn’t a suitable florist app to order customizable flower arrangements from. The apps that do exist are complicated. The other alternative is to physically go to the florist shop, which takes a lot of extra time and energy, especially for those who live in a big city.
The goal:
To solve the problem, a user-friendly and intuitive mobile app needs to be implemented to save time out of the user’s busy schedule when ordering flowers. It would also make ordering flowers more comfortable for users with anxieties.
Understand in the user
User research:
User research was performed to discover possible pain points experienced in physically going to a local florist to order flowers for delivery. Initial assumptions were confirmed that the primary pain point was in the great amount of time and energy it took to go to and from the florist shop to order floral arrangements for delivery. The traditional way of ordering flowers was inefficient for users.
Pain points:
1. Time consuming - Time is valuable, and users don’t like to hassle with going to the florist to order customizable flower arrangements.
​
2. Complicated - The current mobile apps for ordering flowers are very complicated and difficult to use. Most users don’t even bother using them. It’s nearly impossible to customize anything.
​
3. Inefficient - To order flowers, the user must drive to and from the florist shop twice. This also entails trying to find parking each time.
​
4. Crowds - Users tend to avoid busy, crowded places. It is usually busy at the florist shop. People with anxiety have a difficult time dealing with all the extra people.
User journey map:
The main pain points could be relieved by creating a dedicated mobile app (Flowers with Feelings) that allows the user to filter their flower choices, order, pay, and have options for delivery. The app should be intuitive and user-friendly with a simple flow. It should also include a screen reader and alternative text for images.
Starting the design
Paper wireframes:
Below are 5 different versions of the homepage layout, along with a more revised version (lower right)
Digital wireframe #1:
This wireframe includes elements such as an expandable Navigation menu, a company logo with the tagline, as well as arrangement options to choose from.
Digital wireframe #2:
This wireframe displays a “Showroom” slideshow highlighting popular arrangements, a way to filter the user’s purchase options, and easy steps to follow for placing a customized order.
Low-fidelity prototype:
The low-fidelity prototype allows a user to do basic functions, such as open/close the Navigation menu, place/cancel an order, and easily get to the homepage from any page. For a closer look, please follow this link.
Usability studies:
I conducted two usability studies. The first usability study used low-fidelity prototypes, and provided improvements to create in my mockups. The second usability study revealed more refined improvements to incorporate in the mockups to help improve the overall user experience.
Round 1 findings:
1. Users need a more intuitive way to exit the Navigation menu
2. Users need a way to confirm cancellation
3. The homepage could be more visually appealing if the logo was repositioned to the top left
Round 2 findings:
1. Users also need an option for ordering from all pre-designed/curated flower arrangements (non-customized)
2. Users would like to see more images in the carousel on the home page for more of a quick view right away.
Refining the design
Mockups:
The initial homepage design felt too crowded and visually distracting. There was also no way to order from all curated designs – bypassing customization options. I fixed this by adding a way to order from curated designs, and I removed distracting elements. The removed elements are now available from the Navigation menu instead.
Mockups:
After tapping “cancel”, the initial design did not confirm that the user really wanted to cancel their order. I added a pop-up to confirm that the user really wanted to cancel their order, and in case the button was tapped in error, there is an option to continue where they left off. It also reminds the user that the action (canceling the order) cannot be undone.
High-fidelity prototype:
I added several more functionality options, a better-designed navigation menu, another way to create an order (from curated designs), and much more. View Flowers with Feeling’s high-fidelity prototype.
Going forward: Takeaways
Impact:
The app offers an easy way for users to order customized or pre-designed floral arrangements quickly from the comfort of their own homes or office.
One participant stated, “This looks very nice and simple. Things are laid out logically, and it uses easy-to-understand language for everyone.”
Additional considerations:
1. Users can see simple icons that visually cue them to what certain button elements do.
2. There is more than one way to do the same action.
3. The app follows federal guidelines for users with visual impairments. Considerations were made with contrasting colors, increasing font-weight, and more.
What I learned:
While designing the app, I quickly came to realize there are many more iterations to creating the final design than I originally thought. The usability studies were the most helpful in knowing what the users actually needed rather than what I thought needed to be changed.
Next steps:
1. Conduct more usability studies to address the “finalized” product at least one more time.
2. Find more ways to make the app even more accessible to users, especially those with visual and language impairments.
Let's connect:
Thank you kindly for your interest in reviewing my work. If you would like to view more of my designs or share your thoughts, I would love to hear from you. My contact information is below.
Email: juliegeersdesigns@gmail.com
Phone: (616) 477-4849
Website: www.juliegeersdesigns.com