Behind the scenes of an App
Nowadays it is a really good experience to find and use a great App. So, you open the app, use it, and you feel satisfied. But, what is there behind it? For sure, tons of work, discussions, thoughts, ideas….And, wireframing!
The second part of Ironhack's pre-work was to create a simple wireframe version and prototype of a chosen app. In my case, it was the Cabify App. They had to be based on the taken screenshots and be as simple as possible.
What is wireframing for?
It presents the information that will be displayed on the page. But most of all it helps us to understand the structure and the purpose of all the elements we have on the page. Exactly for that reason, we do it in grey, black and white colors. Because the least we need in this case is a distraction.
The Challenge
For the wireframing, I chose the Cabify Application. I really adore it! Its steps are very clear and understandable for the user. All the pictures and sections are very simple. So, let’s look at the App and its Skeleton.
These are the steps I chose for the wireflow (to avoid catching a Cabi :))
I find it a really enjoyable experience because all the steps are very clear. And the offered design is simple and easy on the eyes.
User flow for the Cabify App:
1. First of all, I decided to check the transport options I have for driving.
2. As I didn’t find anything nearby I clicked on the “Viajar” button to order a car.
3. The third picture offers different types of Cabify, prices and the button to order.
4. I wasn’t sure about the payment method, so I went to the Menu button to check them.
5. In the Payment Method Section, I chose the convenient one.
I consider it is very important to do Sketching before going to Figma and starting the Wireframing process. At least at the first steps when you are learning. From my perspective, low-fi wireframes are the first step, they can show us the main idea and easily modify them. So, I used my Sketching pictures I had from the previous exercise with the same App.
After that, I started creating wireframes in Figma and I really enjoyed discovering new tools and learning on my own.
Hope to learn more tips during UX/UI Bootcamp and looking forward to the course :)
