Wireframes

In our 3rd week we were assigned to design the wireframes for a sign-up process that would be engaging for the user. My tactic was to start working on a blank project instead of trying to improve an existing one, so I went for a fictive FitnessApp.

For the first stage of the week I only wanted to focus on the visual hierarchy and placement in page of the elements and fields, with no visuals, to be able to test how the users will perceive it as.

After the first test, I received lots of feedback from the 4 people that I tested with, and also some suggestions for improvement, such as adding features like a forgot password link/page, and adding visuals to the design itself.

After the first iteration, my wireframes had many more details, gradients and even the silhouette of a running man in the background, making its purpose clearer.

Evaluation and reflection

This time I perceived the testing to be much easier as the wireframes were digital, and could be tested by the users right from my phone, offering a much more real feel to it. Creating the wireframes was also easier for me as digital wireframing is something that I have already done on several occasions and I’m familiar with.