El Jardín de los Colores App
The Challenge was to design an app to give people the possibility of having a more reliable, easy and friendly way to buy flowers and the florist their self’s the opportunity of having flowers stock and the products related available and reachable.
El jardín de los colores, an app design to make users shop experience more easy allowing them to personalize and schedule purchase to be picked up at the store.
Project General Description - App for florists
This app design, comes up after identifying the imperative need florist have and also their customers to be able to purchase in advance, making processes more dynamics, saving time and effort.
This project is one of the case studies executed during the Google Professional Certificate User Experience (UX) Design, was a six month course where I play the role as lead designer.
Metodology
Mission statement and user flows
This project emerges in response to the challenge to design an app for catalog flowers for florist.
Interviews, getting insights, empathy maps, creation of “persona”, user stories, and users journey maps were the used tools in this case study to try to help broad our comprehension of the final users who are finally the ones we are designing for, trying to analyze and understand pain points and developing ideas to solve them.
User Persona
Margarita, is the “user persona” she works as a landscaper, she is 31 years old, lives with her parents and her two younger sisters, in Bogotá, Colombia.
She is a flower lover and since she is actually, in an self conscious interior change, she is trying to integrate flowers to many aspects of her life, mostly because this new life philosophy establish that is positive to try to found mindful connections and find balance with her environment through natural elements.
Problem Statement
Margarita is a raising career young landscaper who needs to be able to configure her own workspace at her own way because that would help her to get more physical and mental balance
User Story
Fictional story told in one sentence, from “the persona” point of view to para inspire and implement design decisions.
“Be able to configure a workspace consequent with my new life philosophy”.
StoryBoards
There are two types of storyboards: 1. Big picture and 2. Close up.
Series of panels or frames that visually describe and explore and user experience with a product. It is a tool to visualize potential solutions to problems users are facing and usually formed by four key elements:
Character: The user in your story
Scene: User environment
Plot: Benefit or solution of the design
Narrative: The user need or problem and how the design will solve it
Big picture storyboard:
Focus on the “how” and the “why”, What the USER needs, Their context and why the digital product will be useful for them.
The sketches must be user centered.
The sketches must indicate the context or space where the user is.
The sketches must be user need centered or pain point centered.
Close up storyboard
Focuses on the what, the PRODUCT and how the product works
The sketches must be product centered instead of the user who is going to use the product.
The sketches must indicate how the user interacts with the product, preferably using screen draws.
The sketches must indicate the transition between screens or the different steps or stages that the user have to go through.
User Flow
The path taken by a typical user on an app or a website, so they can complete a task from start to finish.
Margarita’s user flow, shows examples of some of the steps she should follow to get from point A to point B inside the app flows, or to execute a precise action, in this case, personalize a bouquet, schedule the pick time and check out.
Prototypes:
It is an early model of a product that demonstrates functionality, without actually building the entire product. Helps and allows users to experience how it feels to use the product.
There are two types: Low fidelity prototype and High fidelity prototype:
Look and Feel
High fidelity prototype:
Working on the visual getting, to the right look and feel.
Steps to create a high fidelity prototype in Figma:
Layout the mockups
Connect the screens
Add interaction details
Adjust the animation
Complete for all screens
Share your work
Design Kit
Flows:
Flow 1: Actions taken by the user from home page to product purchase.
This journey stars at home page clicking on menu button, navigating to product category screen, searching for a product that the user likes, next step is adding the chosen product to the cart, scheduling the pick up assigning a date and a time, navigating next to checkout page and getting the purchase confirmation on the thank you screen.
Link to functional prototype in Figma:
https://www.figma.com/proto/7oQXKmTy3ovkeAh7KbiUKH/El-Jard%C3%ADn-de-los-Colores-APP?node-id=491-4&scaling=scale-down&page-id=491%3A2&starting-point-node-id=491%3A4
Conclusion
The outcome results from this project was an capable to give the stakeholders what they ask for in terms of product inventory, process purchases digitally and provide their clients with and easy, fast and secure way to buy their products.
Concerning the user, the app allows them to choose the product from a catalog, schedule the pick up and purchase in an easy, secure way.
The app improved the user experience, facilitating the purchase process and also, as a consequence having a digital product, the florist has been able to reach more people.