Prototyping and Testing: The 4i Way | 4i

Prototyping and Testing: The 4i Way

21 February 2017 ‐ 6 min read

The processes of prototyping and testing are essential for our business, but more importantly, to ensure that our clients succeed at attaining the business objectives attached to launching and implementing their mobile applications. Let’s take a look at how we prioritise these processes at 4i, and how they are implemented:

What is prototyping?

The Merriam-Webster Dictionary defines a prototype as: “an original model on which something is patterned” and “a standard or typical example”. At 4i, for us, creating prototypes is important, because they enable our team to conduct rigorous testing or open up unique opportunities with clients.

Using or creating a prototype can take on many forms, where we test existing products, or build our own to put it through the paces of usability testing.

The 4i Prototype Creation System

Prototyping and testing looks a little different for us, from project to project, depending on the client and what their requirements may be. Using or creating a prototype can take on many forms, where we test existing products, or build our own to put it through the paces of usability testing. Prototypes are often used to sell a specific idea to a client, solve navigation or execute ideas and flows. In some cases, our clients need a clickable prototype to pitch to their investors and it’s through providing this that they’re able to close the deal and get moving on implementation.

How We Build Prototypes

Our team builds prototypes using Marvel.  Marvel is an intuitive and highly useful platform, that enables us to create interactive prototypes for a range of devices and platforms. Marvel also has a key feature that’s really useful for client and site visits, because we can utilize the offline capabilities to test or showcase a prototype, even if there’s poor internet connectivity. Occasionally, we make use of InVision to create prototypes too, when we need to build for very specific platforms. The prototypes are built according to very specific user scenarios that require testing and can be downloaded as an actual “app” on a device.  

What Types of Prototypes We Use at 4i

A low fidelity (low quality) prototype: is used to purely test the concept and demonstrate the flow of the mobile application, consisting of only a few screens. The screens are grey scale, with basic click-through functionality.

High fidelity (high quality) prototyping: is the creation of designed prototypes used to test the flow and interface design This provides us with the flexibility to create designs, showing changes in UX and UI. Specific criteria need to be catered for, and they need to be built in a particular flow. This level of prototyping enables us to get to a desired screen, through a variety of ways, so we map out numerous user processes too.

Usability Testing

We conduct rigorous Usability Testing to test specific key success metrics. These metrics are, most often, defined through a collaborative process between ourselves and our client, but in the case of an internal project, we set out clearly defined metrics that our team regard as important. In the process, we record the tester’s face as well as the device to show what they are doing. As part of this intensive testing process, we set the criteria, define the demographics and try to find testers that match the target market. In all cases, we do try to test across a spread in ethnicity, gender and profession to provide well-rounded results.

Conducting Usability Testing

Implementing Usability Testing processes can take on a wide range of forms. Conducted in-office in most instances, stringent rules and processes must be followed to ensure that we’re fully equipped with as much user experience data as possible. Our PEP Banking app, was tested in-store with potential users, giving this testing process a very true-to-life format. As part of our testing process for LevelUp, our team went into schools and conducted on-the-ground testing with the target audience – school children.

After numerous rounds of usability testing are complete, we provide comprehensive results to our client

Testing Results

After numerous rounds of usability testing are complete, we provide comprehensive results to our client. We use screen flow for the videos displaying the face video next to the corresponding phone video, to make sure they are aligned and can be used in a feedback session for our client. We focus on clips that highlight specific areas where users struggled, and provide summary snippets of what worked and what didn’t. The Usability Testing process picks up everything from complications in the user journeys, to iconography, copy and so much more. The process is super helpful as we are then able to provide solutions and recommendations that will make the application work more efficiently, effectively and in a more user-friendly way. After the findings are presented to the client, we then update the wireframes and user journeys, improving the UX.

Do you need a prototype built, or require usability testing for your website or mobile application? We can help. Drop us a line on and let’s make magic happen.