Insight

Prototyping Implementation and How It Fits into the Creative Process

The following is based on interviews with Gorilla’s Manager of Design Technology, Doug Garofalo, and UX Architect, Tony Knaff. It is the second of a two-part series on prototyping. Read part one, which covers the fundamentals of prototyping, here.

Depending on the timeline and available resources of a project, prototyping can be implemented during every phase of the creative process, beginning with wireframing. As discussed in our first post, prototypes are important in the early stages of the project lifecycle as a way of generating ideas and setting expectations around the project. Prototyping is used to explore what the user experience on the site could look like by creating testable samples that can be used as blueprints in the design process.

Once a concept has been built into a prototype, UX designers will test its usability to troubleshoot before launch to the public based on the client’s goals. For instance, if the goal is to create a better user experience that leads to an increase in sales, our team will test the user’s click-by-click purchase path experience.

In order to gather meaningful data from user testing, our team must first identify the variable being tested, and the test group. There are many different way to test prototypes including sending out surveys, conducting A/B or recall tests, and tracking the user’s navigation through heat maps. It’s important to leverage an unbiased test group that is large enough to allow for accurate assumptions, but small enough to avoid diminishing returns. Unbiased test groups help uncover issues and/or opportunities that internal stakeholders may have missed. To minimize bias, set up the test carefully and get as much feedback as possible prior to creating the prototype.

Prototyping not only fosters collaboration with clients, it also encourages collaboration among internal creative teams, as many different roles play a part in development and execution. For instance, UX designers typically work on initial sketches and wireframes, and hand the sketches off to developers when the prototype requires HTML, interactive concepts, and visual designs.

In the beginning of the creative process, prototypes encourage designers and developers to understand what is and isn’t possible to produce. Once they are built out, prototypes can help serve as a blueprint for designers and developers during the front end development process. An interactive prototype serves as a quick and easy visualization, instead of a lengthy functional specification document that is often difficult to quickly understand. If a prototype is coded with HTML, front end developers are also able to use that code to their advantage as they build out the front end of the website.

whiteboard

We created a prototype for a B2B client that was seeking a unique approach to a traditional product detail page in order to assign products for purchase to specific business units and cost centers.


whiteboard

Our team performed user testing for drinkware client Contigo and used the data collected from a sampling of 30 individuals to guide and inform subsequent user experience and design decisions.


whiteboard

We created highly developed user personas to guide strategy and development decisions for the ecommerce channel of one of our clients based on each persona's demographics, objectives and key influences.