The basics of Prototyping

* This content is primarily targeted at early-stage EdTech Entrepreneurs, but should be useful for other early-stage entrepreneurs as well. 

Definition:

An easily developed, low-cost, low-risk, learning-rich early sample used to test a concept or process

Aim:

It provides a complete user experience for the testers by simulating the real product interface and functional interaction

Basic Prototype Categories:

• Proof-of-Principle Prototype serves to verify some key functional aspects of the intended design, but usually does not have all the functionality of the final product.
• Working Prototype represents all or nearly all of the functionality of the final product.
• Visual Prototype represents the size and appearance, but not the functionality, of the intended design.
• A Form Study Prototype is a preliminary type of visual prototype in which the geometric features of a design are emphasized, with less concern for colour, texture, or other aspects of the final appearance
• User Experience Prototype represents enough of the appearance and function of the product that it can be used for user research. 
• Functional Prototype captures both function and appearance of the intended design, though it may be created with different techniques and even different scale from the final design.

*For our purposes here, we are going to be focused on a User Experience Prototype.

Develop a Prototype Mindset:

Prototype mindset - no matter what solution you are working on, there is a way to prototype it. 

This is a way of thinking that you as the founder and your team need to adopt. This will help you approach challenges and turn them into actionable plans. The prototyping process is meant to help you work through an idea you think will help your company achieve your long term goal.

A façade is defined as an appearance or simulation. The process of building a prototype can also be referred to as “building a facade”. During the process of creating a realistic façade/simulation, try to make sure that it is close enough to what your idea/solution will look like so that you can gauge the user’s reactions and get their feedback.

Tips for building a good façade/prototype:

1. Prototype only what is critical
2. Use real stock images/icons where possible to elevate the appearance of your prototype
3. Don’t use placeholder text - actual content will stimulate end-user more
4. Use real devices e.g. phone, tablet or computer
5. Keep it simple

Work with your team to Build a Façade:

1. Make note of all the main items that you would want to include in your prototype/aspects you want to test;
2. Come up with a basic design showing what you want your prototype to look like. Have a look at products that are similar to yours for inspiration. 
3. Come up with rough drafts of text and images to include in the prototype

- - - - - - - 

Some resources you can use for prototyping include paper sketches and various prototyping tools that make the process of creation much faster and easier. These tools allow UI/UX designers to explore ideas and ensure that the correct decisions are made for the users. 

Proto.io is an example of a tool used when prototyping. We encourage you to use it as it is very easy to use, and there are multiple tutorial videos on youtube that are freely available.

We have included some links to other prototyping tools in the resources at the end. You are welcome to take a look at those as well.

Video 1

• How to use the Dashboard
• How to use the Editor
• Exploring basic wire frames
• How to link two screens

Video 2

• How to create reusable containers
• Creating scrollable containers
• Creating tab bar controller

Video 3

• Creating states & formatting
• Animating states
• Creating and using containers
• Adding screen interactions

Education Portal

• Enrolled Courses with course overview
• Calendar with assignment due dates & exam dates
• To do List
• Notifications
• Messages

Visit the link to interact with this prototype. This prototype has some basic content that will help you understand the envisioned functionality.

Playablo

Enabling learning through gamification

Playablo is a comprehensive gamification platform that complements school learning. The platform aligns to the syllabus of education boards thereby providing learning that is focused on students’ academic growth, with competition that is global.

Play the video and also follow the link to read more about this product.

Key Take-Away

Prototype mindset - you can prototype anything. Build just enough to learn, but not more. The prototype must appear real. 

Create a prototype with just enough quality to evoke honest reactions from users.