Low-fidelity prototyping is one of the best ways of getting closer to an actual design. There are three different types of low-fidelity prototyping. One of them is sketching/ paper prototyping, digital prototyping, and native prototyping. The prototype I will be using for this project today is a sketching/ paper prototype. During this class, I have been working on an app for a town municipal site by the name of Town of Randolph. I have recently made a mock flowchart and named the town app “All About Randolph”.
According to Ben Coleman, author of How To Make Paper Prototypes, all you need is common office or home supplies to get started on your prototype. Coleman gave a list of supplies needed for a low-fidelity prototype which I will list down below:
• Paper with a grid or dot grid (preferred)
• Sticky notes (never leave home without them)
• Pencils
• Eraser
• Pens (Sharpies in different colors and thickness are ideal)
• Scissors or craft knife
• Glue (preferably re-stickable)
Coleman also gave a list of items that might be great to have in the house while completing your prototype.
• Index cards
• Mountain putty
• Adhesive tape (preferably removable to move items around)
• Highlighter pens
• Double-ended marker pens with fine and normal nibs
• Transparent sheets and markers
• A box for filing or transporting your prototype
When creating a prototype, you can create one for any screen size you want like an iPhone, computer, tablet, and much more. In my particular prototype, I created screens for an iPhone because I am used to looking at iPhone screens.
Many people may ask, why prototyping? Well, you wouldn’t want to turn in a big term paper without a rough draft first. This is similar to making an app. You wouldn’t want to jump right into creating an app without a mock app first. This may cause problems.
Authors of the blog post The Art of UX Sketching and Paper Prototyping state that you can come back to your prototype and do quick fixes to the designs you have recently created. The authors of this blog post listed a few reasons why paper sketches are great. Here is this list:
• Designer/ product manager is thinking through all the initial ideas running through his head
• Outline the steps in a user flow
• Explore and validate a variety of layouts
• To show the basic app structure
When creating your prototype, you want to be sure the viewers understand where they can click and go into a certain section of the app. You can do this by having a common color throughout the prototype and labeling what it means. In my prototype, I used a purple arrow to represent where the users can click and navigate into another page. Click HERE to see the low-fidelity app I created for All About Randolph.
While creating this app it took a while to come up with how I wanted to present the material on screen. The quickest and easiest screens I created was the main navigation pages for the app. This consists of the pages Home, Residents, Town News, Calendar, and Report. These main navigation pages are also what are in the hamburger menu at the top of each page so that the user can quickly get to them.
At the footer of each page I created, I made sure to put the Facebook and Twitter app logo at the bottom and the actual site page for the user to visit. The reason I put the actual, non-app site at the bottom is that some of the links on this app are not represented as it may not go well with the app. Users can go to the website for further information.
For some of the app screens like Pay Bills, I used a different navigation layout other than the block touch in screens like Report and Local Government. Because this is a low-fidelity prototype I am creating I will most likely go back in and change the screens to one or the other touch options, possibly the block form as it is easier for users to click. In the screens I made, I placed a purple arrow over the sections that users can click and interact with.
The app I created is a simple app for users to use but may need some adjustments if it were to go into a final stage for user testing. Most of the navigation I created for the users to get around in the app is due to creating a better user experience for the user. Making the screens readable and big enough is one of the goals of making a great app. Click HERE to see the PDF of the app screens I created.
NATURALLY BRI 