Vetka Flowers is a local flower designer shop which serves Boulder county, Colorado. They need an app that will simplify the process of ordering flowers online. Target audience are people who live within 10 miles of the shop, active smartphone users, those who like to buy flowers as a gift and for their own home. The goal is to design an app which will let users preview, choose and buy a bouquet for any occasion and get it delivered within 10 miles from the shop.
PROJECT DURATION: March - June 2023
MY ROLE AND RESPONSIBILITIES: as a UX Designer I was responsible for conducting interviews, paper and digital wire-framing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
During my research I interviewed 4 people who regularly buy flowers from Vetka Flowers in-store and online. Then I built an aggregated empathy map, identified user’s pain points and created two personas that reflect two major types of customers in the shop.
For most users who buy flowers as a gift, it takes a lot of time to go to the shop and select a bouquet there.
Users who buy flowers as a gift often want to buy some small presents extra. Chocolate, handmade items…
Prepared arrangements in the shop start from $50. Florists can make you cheaper bouquets, but it will take some time
Some customers need specific flowers, which can be out of stock today, but can be ordered in adavance
Based on these findings, I created two personas that reflect two major types of the customers.
Taking the time to draft iterations of each screen of the app on paper ensured that the elements that made it to digital wireframes would be well suited to address user pain points. For the home screen, I prioritized quick delivery form, trending or seasonal flowers arrangements and the scrolling of complete of all flower arrangements available.
The main screen reflects the main user needs
Hamburger button menu allows the user to see all the categories of the florist shop, search by keywords, filter by different categories and build their own unique bouquet
Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected was selecting and ordering a flower arrangement with an additional gift, so the prototype could be used in a usability study.
Two rounds of usability study have been conducted. The findings of round 1 revealed:
Users need to see delivery cost before choosing it
Users need an order review page with cost details
Users need a clear and simple way to put together a custom bouquet
The findings of round 2 revealed:
The main screen has too many unnecessary components
The fact of adding a bouquet to the cart should be more visible
Users need a clear cue how to build a custom bouquet from the main page
The final high-fidelity prototype presented cleaner user flows for ordering a bouquet and checkout. I also added a clear cue for ordering a custom bouquet. Please view the high-fidelity prototype made in Figma here
✔️ Foreground colors and a background colors used are in compliance with Web Content Accessibility Guidelines (WCAG)
✔️ Provided access to users who are vision impaired through adding alt text to images for screen readers.
✔️ Added an opportunity to search with voice instead of typing
Takeaways and what's next
Vetka Flowers hasn't had an app till this moment. I hope this design will expedite the process of developing an app. It should attract more new customers and make the current ones happier. The florist herself rated the result highly. Vetka Flowers app was my first project as a UX designer. I learned how to do it from scratch in Figma. The biggest insight for me about this process is the importance of the feedback. The final version of the prototype looks nothing like the first paper wireframe. Two rounds of usability studies helped to identify the parts of the user flow where users get stuck, and to fix it. Every step of the way is crucial for the best result.