Flower shop

Landing page | ORDER PROCESS

PROJECT OVERVIEW

Project Duration | november 2021 to december 2021

The Product

bluebell is a flower store website.
The focus is on a clean fresh natural look, ease of use and versatility of personalization. The quality of the images is an important factor to stand out to customers, which the app already focuses on.

Key challenges

Users find it frustrating to be visually overwhelmed, they want to search for products efficiently and customize them according to their needs.

The Goal

Development of the home page and ordering process for the flowers store to provide better interaction and user flow for the user. It should feel very high quality, fresh, light, natural and elegant.

My role

UX designer designing a homepage and ordering process for the bluebell flower store from concept to delivery.

Responsibilities

Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.

Target audience

Urbans, 20 to 60

UNDERSTANDING THE USER

User research | Personas | Problem statements

In SUMMARY, users want to determine exactly what they are looking for and how, in order to place their order efficiently and flexibly. They value a light and appealing appearance. The order should be easy without any distractions.

34 | Berlin | College degree | MaisonetteWedding & Event Designer


Seraphine

is an early riser, getting up just before 6am, opening the big windows to the busy street, to feel the light and the breeze, to create order out of complexity. Like well-told stories, beauty is dynamic and always in flux, so she believes that rhythm is what keeps her creativity going.

Goals

High quality flowers at competitive prices

Being able to customize your own order

Frustrations

Shopping experience is not seamless

Difficulties with complicated settings and menus

User story

As an event and wedding designer, I like to order as versatile as possible so that I can individually tailor the atmosphere of each venue.

Problem statement

Seraphine is a busy event and wedding planner who needs a simple and versatile app to put together her own flower order, as she is not tech savvy and doesn't want to waste time.

STARTING THE DESIGN

Digital wireframes | Low-fidelity prototype | Usability studies

DIGITAL WIREFRAMES

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. As the initial design phase continued, I made sure to base screen designs on feedback and findings from the user research.

LOW-FIDELITY PROTOTYPE

Using the digital wireframes, I created a low-fidelity prototype. The primary user flow I created was to mimic an ordering process so the prototype could be used in a usability study.

Research Insights

P01 | Users need better guidance on what steps are required to find the cart.

P02 | Users need a more intuitive way to order a product.

P03 | Users need a quick way to move forward in the ordering process.

Research Goal

Find out if users can complete the main tasks within the app.

How long does it take for a user to order a product?

How long does it take for a user to find the shopping cart?

How easy is it to successfully complete the ordering process?

REFINING THE DESIGN

High-fidelity prototype | Mockups | Accessibility | Takeaways | Next Steps

HIGH-FIDELITY PROTOTYPE

The final high-fidelity prototype provides a clearer user flow. It meets the users‘ need for a clear, easy-to-use architecture and a simple and fast ordering process.


HIFI PROTOTYPE

MOCKUPS

ACCESSIBILITY CONSIDERATIONS

Provided access to users who are vision impaired through adding alt text to images for screen readers.

Used icons to help make navigation easier.

Used detailed imagery and colours to help all users better understand the designs.


TAKEAWAYS

IMPACT

The app offers users a real help to put together their order easily and quickly and not get lost in the ordering process itself.

„The site is beautiful, I can easily understand it and get what I am looking for. “ Frances

 

WHAT I LEARNED

Through repeated interviews and improvement loops – the elegant and easy-breathing designs and the application of design principles – the app almost feels like part of a real product.


NEXT STEPS

Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed.

Conduct more research to determine any new areas of need.

Completing the app with the full range would be the biggest challenge.