The fidelity of your prototypes is an important consideration as well. They can be very basic. They can be very complex, and there's a time and a place for each one of those. So let's look at some different examples of fidelity for our purposes. You can think about Fidelity is some level of definition. When you think about high fidelity, you think about high performance, something that looks good that looks sophisticated on the Y axis we have interactivity is the thing. going to do something if we press buttons if we touch parts of the screen? If we begin to kind of maneuver or manipulate the prototype with our hands, is there going to be any kind of outcome? Is there going to be any kind of result? The most basic type of element from a fidelity standpoint, would be a hand sketch, a drawing, a drawing on a piece of paper, a drawing on a napkin. It is fairly low fidelity, not very refined and also not interactive. It is just something that I can look at. I can't do anything with it. The next step up infidelity would be a static wireframe, meaning that if I'm developing an app. I'm going to have perhaps six or eight drawings of the various screens within that app, but they're very basic. There are no pictures there, no graphics. There are no colors. It is just essentially a blueprint of where are the pieces of the page. Where are the pieces of the app going to go? And we'll look at an example in a moment. If I can click on some of those wire frames and I get a level of feedback, that would be something that will be interactive. So maybe I could look at these six wire frames on a phone or on a computer. And when I click on something, something happens. I can see how the pages might interact with one another. Move another step to the right with static, mockups. Think of this as a wireframe with some images with some colors, with some fonts, with something that looks more like the real thing. Still not the real thing, but at a glimpse highly similar with clickable mockups a little more interactive, the buttons actually do something. The buttons will guide me across page to page, and I began to really get a good feel that simulates. What is the final product going to look like? Lastly, on the far right high fidelity, high interactivity is some interactive prototype. This is almost the real thing, so this is a product. If its a physical product, maybe it is 3D printed. Maybe it's out of plastic, but the buttons and the clicks and the various lovers and mechanisms of the physical product work just as it would in real life may be in real life. My version is going to be metal or some other type of material, so it's not the final thing, but it is really similar. Alternatively, an interactive prototype for a app or a piece of software may look and behave very much like the real thing. Now you might have fake data, data that's kind of a placeholder. It might not be connected to servers. It might not be producing and doing calculations and making decisions as the real product would. But it's going to give you a great simulation, a great kind of pretend experience of what's it going to look like? And how is it going to behave for the end user? So with the low fidelity wire frames for an app, for example. This is fine. It gives you a version one. You're just trying to get some of your basic ideas on paper. Well, for an app, maybe there's some log in screen. Maybe there's some homepage or some home for the user after they've logged in. Will they do a profile. Maybe I can search within the app, and I'm searching for prospective plumbers. Or I'm searching for dog walkers or house painters or a tutor or a physical therapist or an attorney. So, whatever it is, maybe there's some search results. I may get a detailed view of the resulting person or company or restaurant or whatever I found in the search results. And then there might be some review screen that gives me some sense of ratings or how people felt about that provider. And there might be some submission element in this scenario, maybe for me to submit my own review. So here six low fidelity wire frames that are intended just to provide an example of what we mean. Just getting ideas on paper and here sheet of paper and a pen, and you begin to get there and you'd want to do these for all the various screens within your app. Some apps may only have three or four screens. Others are going to have dozens. So with that, it gives you the opportunity again to begin getting some ideas on paper. The next step up from this would be medium fidelity. Here you're sitting down with a tool like balsamic or some other wire framing tool, and these things are out there for cheap or for free. In some cases, where you can begin to draw some boxes and use some of their icons to drag and drop, what's it going to look like in practice? You can see here. It's not very high fidelity. We don't have images. We don't have colors. We might not have the perfect font, but you can begin to draw and drag and drop and move and scoot and adjust things where you are able to go through and get a good sense of what's it going to look like. And once you have something that's kind of medium fidelity, that's fine. To begin showing some prospective customers, you don't want to spend a lot of time painting the house unless you know you have the walls in the right place. So think about medium fidelity. Is that as well? We're just trying to verify the blueprint. We're not trying to make it beautiful. We're not trying to make it look finished. We're just trying to know. Do we have a basic sense of what this app is going to look like? High fidelity get you a bit further. So with high fidelity and particularly if this is going to be interactive and clickable and do things, it's going to look almost like the real thing you're able to go through add colors. Get your fonts right. Get your placement just right at some images, things of that nature. And again, you can use some wire framing tools to simulate this as well. So you don't need to be a great graphic designer. You don't need to go into Photoshop and spend days or weeks trying to be a Photoshop expert. You can just go to some of these wire framing tools that are out there and use some of their features and functions and templates to go through. And do a fairly solid job of getting a high fidelity wireframe together for customer feedback so give us some consideration to what timeline makes sense. And when you'd like to develop each of these along that time frame.
