Ironhack’s prework : Mathilde Gau_Challenge 2

Mathilde Gau
3 min readJan 15, 2021

For this second challenge of my Ironhack prework, I have learned how to build wireframes on Figma, and also to create a wireflow !

Here are the different steps I took for this assignment and I will develop them a bit :

  • Choose an app I want to work on.
  • Choose a User Flow for this app : between 5 and 8 screens that I will use to create the wireframes.
  • Build Lo-fi wireframes on paper.
  • Build Mid-fi wireframes on Figma and a wireflow.

For this challenge, I have chosen the Deliciously Ella app. The tagline of the application is “Delicious ways to feel better”. Basically you can access tons of delicious recipes, and also yoga and meditation classes. I mostly use the app for the recipes because I am a huge foodie and I really like cooking. There are also some really useful and time-saving features such as the notes, the possibility to add all the ingredients you have to buy on your shopping list, a meal planner and other ones.
I use this app frequently, I find it really simple and intuitive, and the content is really rich !

Deliciously Ella mobile application

For this challenge I have decided to show you the workflow I use the most often, which is when I want to cook something with a recipe from the app. This goes from the selection of the recipe according to some criteria, to the detail of the recipe with the ingredients you have to buy, and the method.

Lo-Fi wireframes

The objective of the lo-fi wireframes is to understand the structure of each screen, and which elements are important. By doing the lo-fi wireframes, I realized that this was harder than I thought because for this app, the text and images have an important role in the understanding of each screen.

Mid-Fi wireframes

Here are the wireframes I made with Figma. I also created the wireflow, so you can see how the user interacts with the different screens. I thought it was easier to have consistency between the screens by doing the wireframes on Figma.

I really appreciated this exercise, firstly because it helped me to get my hand on Figma, which is a type of tool I had never used, and create my first Userflow. It also helps for the training that with the wireframes you just focus on the core of the app.

Thanks a lot for reading me and I would love to have your feedbacks on this :)

Mathilde

--

--