Prototyping is a key part of the design process. A prototype can be used to sell ideas, create a shared vision, test and refine an interface, and provide the development team with exact specifications. Students gain hands-on experience in creating prototypes using paper, software, and web-based applications (Balsamiq and Figma) by working on a realistic sample project step by step. In addition, prototyping will be introduced in the context of the Design Thinking process. Students learn what types of prototypes work best at different stages in the design process and will identify the appropriate level of fidelity required in your prototype.
Crate Escape Final Prototype
Presentation of Paper Prototype
Crate Escape Final Prototype Presentation
Crate Escape Website Prototype - The Step by Step Process
Crate Escape, my final prototyped site for the Bentley Prototyping Course, included many steps to get to a finalized piece. The steps were as follows:
Defining a Persona. In this case, it was Sarah, a young teacher who just got a puppy and needed services for the puppy.
A Customer Journey Map was created stating Sarah's needs and desire to look around at local ads and compare services at local dog care places.
A Key Path Scenario was defined for the Crate Escape site. Sarah continues her search and stumbles upon Crate Escape and wants to immediately look at the dog services. She enters in all of her search criteria to see what comes up. From there, she proceeds to look at a "Best Fit" Pet Professional's profile to get more detailed information. She becomes very convinced that the really is a best fit and proceeds to book her service. She follows the pop-up boxes guiding her to create a new portfolio. Once set-up, she continues to check-out, provides payment and receives her thank you message.
A Paper Prototype was then created, based on the Key Path Scenario, and a video presentation was recorded showing how the site was intended to be used.
Version 1 of the Digital Prototype was then created, using Azure, based on the Paper Prototype.
Version 1 was then user tested and a Validation Scenario/Findings document was created. Several improvements were revealed and discussed.
Version 2 of the Digital Prototype was created with all discussed findings and improvements.
A video was recorded showing the Key Path Scenario being used and accomplished in the final prototype.
A final Power Point presentation was created bringing together all pieces of this project. If you are interested in viewing this presentation, please click here.
A Few Key Takeaways from This Class
Learning how to create that initial persona...and how important it is!
Creating paper prototypes are extremely effective and much more fun with it being such a physical process.
Iteration, always iteration! User testing and validation will only bring you to a more improved product.
Intro to new prototyping/wire framing tools out there.