Ironhack Challenge #2: Wireframing

: Why Glovo

Glovo is my choice this time for the second Ironhack Challenge, which is about wireframing. As an art director, I’ve had the opportunity to work for the company a couple of times and as I am also a heavy user of the app, I thought it could be a good idea.

I also think it is a good example of UX/UI because it offers many options to users but all of them resolved in a very simple and intuitive way.

: User flow

We all know that Glovo allows users to accomplish many different tasks. In this case, the user flow I have been working on describes the journey of a hungry user from the moment that opens the app until the order is completed. First thing you have to do is to choose one out of the 8 different options you have in the homepage, “Comida” to be more exact. Then, click on “Restaurante”.

At this point, you can start scrolling through an eternal list of restaurants until you find the one that you fancy more. There is an option to filter the list based on the geographical zone but we are not going into it at this time.The chosen option is Goiko and to be more concrete the Big Veggi burger which is indeed one of my favorites.

The last step is where you indicate the delivery address and also the payment method. I usually order Glovo when I’m at home so the app already has the location and payment info that it requires.

And this is it, I hope you’ve find this challenge useful and I encourage you to taste this Big Veggi burger if you have the opportunity anytime.

: Lo-Fi wireframes

: Prototype

These are some of the UI elements that I’ve used:

• buttons
• toggles
• image carousels
• dropdown lists
• search field
• tags
• icons
• text fields
• accordion
• images

And now follow the link if you want to see the prototype :)

: Before leaving

I’ve found the challenge very interesting because I’ve never before converted a finished design into a wireframe, I’m more used to doing it the other way around. Maybe that’s why during the process I’ve found myself many times paying too much attention to details instead of simplifying which is what a wireframe requires.

This has also been my second ever exercise in Figma which means I have a lot to learn yet but I feel very excited about how efficient it is to build the wireframes and a quick interactive prototype in very short time.

Thank you for your time !