At Klick Health, we constantly strive to innovate with design processes and toolsets to deliver better work faster and more cost-effectively. Focusing on our User Experience Design efforts, the most recent addition to our stable of capabilities is clickable website prototypes.
User Experience Design is typically articulated using wireframes – blueprints or schematics of how a website is supposed to function. These are often packaged as a PDF file and emailed to clients for review. Wireframes may be coupled with creative mock-ups, but for the most part these deliverables present no interactivity; that is, client and internal teams must visualize in their heads how a user might interact with website features and functionality. This introduces a significant misinterpretation risk that may become obvious after development is complete and changes become time and cost prohibitive.
Despite our best efforts, we’ve seen this happen repeatedly. How can we more clearly communicate our intended designs – especially when more complex site functionality is involved? Enter prototyping!
A prototype is a working, interactive model of how a website is supposed to function (prototypes are often referred to as clickable wireframes). Prototypes are shared with clients via a password-protected URL that can be launched in any standard web browser. Prototyping can be used for any type of project – websites, applications, mobile apps or even responsive layouts.
Utilizing clickable prototypes over static wireframes presents some significant benefits:
- Clarity: Prototypes allow us to more clearly communicate proposed website interactions to clients and internal teams
- Feedback: Observing users interact with the prototype enables us to identify and correct usability issues before development
- Speed: As with wireframes, we can rapidly iterate the design based on feedback and findings, directly in the prototype
- Empowers clients: Prototypes enable our clients to sell and evangelize concepts to internal stakeholders more easily
Granted, prototyping is not new to the UX community (our team has in fact delivered prototypes before, as early as 2008). However, only recently has the prototyping toolset stabilized. As a result, we have access to software that allows us to produce prototypes with minimal incremental effort above and beyond creating wireframes.
Other Prototyping Applications
Usability testing: Prototypes can be issued to conduct usability testing with real users. This allows us to accurately test sites without the cost of development. Since prototypes live on the web, distributing them to remote users is easy. For more on remote usability testing, check out my earlier blog post.
Incorporating creative: Prototypes can be generated using wireframes or even creative mock ups. This allows us to output rich, interactive prototypes that closely mimic the final product, without writing a line of code.
MRL possibilities: We’re excited by the potential of using prototypes with MRL teams. What we have found is that the mere availability of a prototype makes the possibility of an MRL concept review more likely, resulting in better MRL feedback and early buy-in. During formal MRL reviews, a prototype can enable MRL teams to more easily understand concept functionality, resulting in a smoother, lower-risk review.