A prototype is an introductory, interactive visual that helps show off the look and feel of an app, software, or website. It allows the client and potential users to test basic functionalities and react to the overall design. This insight is valuable to allow for adjustments and pivots in design before a lot of time (and money) is put into development. Prototypes don’t need code; that is implemented during actual development later on. Prototypes can be built-in programs like Figma, Adobe XD, or Sketch.
3 types of deliverables bring product designs to life, and they all have different focuses. Wireframes are built by a designer focusing on user experience design. It’s a bare-bones roadmap of how the user will travel through the product. Next comes the mockups. Mockups are where user interface design is implemented. They show off the icons, images, and colors using the blueprint laid by the wireframes. The final deliverable that is used in development is a prototype. It takes what was established by the wireframes and mockups and presents it as an interactive experience. You are able to click and interact with a prototype to see how a user will eventually experience the app build.