Ironhack Pre-course Work, challenge 2 | Wireframing | Picnic app

Time for the second challenge of Ironhack’s pre-course work! This time, it’s all about wireframes.

For this challenge, I chose an app I use a lot, but I’m not a 100% fan of their interface and their logic behind the flow.

The app I chose is the app Picnic, a Dutch online-only supermarket. In this app, you can do all the shopping you need within a few minutes. From fresh vegetables to shampoo and from toilet paper rolls to cereal.

First wireframe sketches

Screenshots from the app

I chose to work in Sketch, because of a couple of reasons:

1. I wanted to know how to use Sketch for wireframing. I’ve used Sketch before, but not for this type of work.
2. I never used the prototyping feature in Sketch, while I’ve used Sketch for a couple of years.. it was time!
3. There was this free Ironhack Wireframe Template for Sketch I was really excited to use ;-)

I started off with just loose sketches on paper, and I then put them in Sketch. At first I was a bit struggling: how many details should I add? Are there different colored or lined buttons for different meanings or reasons? Or just whatever suits the message best?

Wireframing for the Picnic app in Sketch

But in the end, I’m quite proud of how it turned out for my first ever wireframing and prototyping in Sketch 🤩 I had a lot of fun doing it, and I can’t wait to develop my skills further.

Curious about the prototyping? I uploaded it for everyone with the link for my Google Drive.