Mobile app development Part 3 – Low fidelity Paper Prototyping

This is the third part in a series of how development of a commercial educational  app was conducted. In the first part we looked at the need finding activities used to evaluate what features to include into the application. In the second part explored the creation of personas to reflect target user goals and motivations. In this post we look at the need for prototyping and user testing as being key in creating the perfect experience for the user.

The process of bringing features to life begins with creating user stories. In other words we need to explore the environment and context the feature will be used in. Analysis of the context and task, can then inform the prototyping phase. On this post we will analyse one of the common activities students do, getting the time for the next campus bus/shuttle.

Contextual inquiry

Contextual Inquiry has to do with understanding the context and environment in which a user completes a task by exposing oneself to the user’s environment. Getting onto the campus, carrying books and pretending to take classes gave first hand insights into the user’s world and their goals. Currently students use various sources for information on shuttle timetables. One can view at the bus/shuttle stop or view them online from the campus website. There are several disadvantages to these two mediums.

  • One has to be at the shuttle stop to look at the timetable so no knowledge upfront of the schedule.
  • Timetables change during the year due to holidays and semester breaks so timetables unreliable.
  • One has to access a computer to view timetable from campus website.

Storyboarding

User flows were drawn up on paper of how a student would get to the desired information from the existing online website.

User flow for  Shuttle service

Paper prototyping

A prototype is simply a series of hand-sketched wireframes of screens that sum up user scenarios. These wireframes show layout and functionality but no focus on visual design. What is important is getting feedback from users as early as possible in the design process.

Using the user flows, rough sketches of the mobile application wireframe screens could then be drawn up using pencil and paper. We refer this to low functional fidelity as it is not as interactive or visually polished as the final product. Using a medium like paper makes it easier to present to users, easily revise and cheaply make changes on the spot. Users will also feel more relaxed about giving honest opinions about such work because its on paper and not a full blown application on the phone.

Wireframe sketches

Low fidelity prototypes are helpful in answering structural questions. Such as:

  • Does the user flow make sense for a mobile phone?
  • Does the system have all the required features to support the user’s goal/activity?
Using a prototyping software called Pencil, the border of a real looking phone was printed and cut-out to make the paper prototype screens more realistic. This is what gets presented to users and their feedback is recorded and quickly incorporated into the designs.

User flow for finding the next shuttle time

The next part in this series describes how and why the high fidelity prototype was created from this paper based one and the prototyping software Pencil.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s