UI Prototypes V.S UI Storyboards – choose carefully

In this post I will share my experience with using UI Prototyping versus using UI Storyboarding. Fist let me start off by saying I think that both types of deliverables have their place.

UI Prototypes: Take longer to create, resulting in less options created and reviewed.

UI Prototypes are great at visualizing more clearly any unique and complex user interactions. In past projects I have used them for this purpose, but I have to say the need for this has been rare. Creating UI Prototypes in my experience always takes longer than UI Mockups or Wireframes put together into a UI Storyboard, allowing more time for creative changes. Also there seemed to be a greater resistance to change the user experience in the prototype because it just took longer which lead to more emotional attachment and less willingness to spend additional effort to explore other options.

UI Storyboards: Can convey more requirements than UI Prototypes

One problem I have always had with UI Prototypes is that it does not walk the reviewer through the user interaction flow. Instead the reviewer must explore and “find” the requirements by hovering, clicking, swiping etc. This can lead to some of the user interaction requirements being missed by the review. The second problem I have with UI Prototyping is that most tools used to create these interactive prototypes are not good at capturing and communicating additional information such as field size, validation rules, security requirements etc, that can easily be added to a UI Storyboard created in tools like PowerPoint. This means you typically need to create a supplemental document that references screen shots from the prototype, which creates additional work keeping the document and the prototype in sync.

UI Prototypes: If you are going to do them, use the dev tools!

I guarantee there are other valid views on this, but my view is that if you are going to go to the effort of creating UI Prototypes, it should be done using the dev tools you will eventually use to create the product. If you are building a web based product then this would be HTML5, CSS3, JS for example. You can create prototypes very quickly in most development tools with visual editors or even if you need to hand-code all of the UI, a good front end developer can create prototypes very quickly. This has the added benefit of kick starting the actual development work, and also positions you well for making changes to the prototype and integrate that with the on-going development work.

UI Prototyping is a very popular trend, but you should think carefully about the investment it requires and its true value compared to the more flexible, less time consuming approach of using UI Storyboards in common products like PowerPoint, which can convey more details about the requirements and not rely on reviewers discovering features hidden within UI Prototypes.