Sometime last year I came across a little article by the Newfangled Web Factory about how they used “Grayscreen Prototypes” - clickable wireframes with some of the elements, such as menus, and text-links live. “That’s a nice idea” I thought, before deciding to leave the  mock-ups to the Web developers, working from my specs and wireframes.

Well, now a tool has popped up which promises to anyone capable of creating a wireframe, to turn it into a prototype with enough functionality built in so that a client can experiment with the navigation scheme and get a real feel for how the site works.  

It was a commenter to this blog - indeed the only comment in the life of this blog so far  - which asked whether I had looked at Protoshare, a relatively new online tool from Site9. I hadn't. But when 100% of your active audience suggests something, it seems churlish not to take a peek.

To get a decent understanding of what Protoshare is all about, it is worth looking at the tutorial videos. It's a slick subscription-based Web tool that allows developers to:

1. Create hierarchical lists of pages (aka site maps) and then:
2. Create wire-frame clickable mock-ups with working menus etc. for each page
3. Set up a collaborative discussion, where developers and clients can discuss and annotate the wireframes.

Overall, I like it. I have some niggles with usability, the pricing model and the support structure, but hopefully these can be ironed out as the product matures. There’s a 30 day free trial - give it a go. Though beware, you have to enter your credit card details and remember to send an e-mail asking to cancel, if you don’t want to be billed.

Being a curmudgeon, I’m going to focus on my dislikes first. One problem with building any drag-and-drop wireframe tool is the constant demand from users for additional drag-and-drop widgets. Some user is always going to want to place a  volume-slider, or some such into their mock-up.  That user is me.  Even so, s it stands, Protoshare’s selection feels a little thin - there are  no horizontal or vertical rules, no support for tabbed navigation and no palette of little icons,  to let you (say) drop in an RSS feed button.  Of course it’s possible to insert your own graphic assets into a wireframe, but who wants to bother with that,  for fairly common items.

Similarly, styling of textual elements is a mixed bag. If you create a box to hold rich-text, Protoshare gives you the works - font, size, colour, style can all be selected on a per-word basis. However, if you want to make the text of your bread-crumb trail smaller, or want to decrease the font-size of your navigation bar so that the text doesn’t wrap, you’re on your own. It's true that Protoshare lets you attach custom CSS styles to elements to control all aspects of their look and feel, but it doesn’t give you any CSS tools, just a ‘type your CSS in here’ page.  As a lazy IA, I don’t want to bother with code a CSS style to make my text fit on screen.

And while entering the initial page hierarchy for a new site is a joy, why does the software have to make me mouse across to a  separate  Title box for every single new page?  That gets irksome after the twentieth time. The box should be pre-selected as a page is created since the first thing that most people want to do is rename it.



On the other hand the collaboration system looks very nicely designed. Pages can have discussions attached to them and those discussions can have draggable push-pins associated with them (as illustrated above) to make it easy to see which part of the page they refer to. Each user can opt in and out of notifications when a discussion is initiated or added to.
Alongside the push-pins, ‘specification’ markers can be added. These act as ‘callouts’ giving the developer a place to explain the functionality of a particular page element.

Since this is a Web-hosted application, pricing is per licensed user per month. In effect this makes it a good tool for two groups:

1. An in-house enterprise team, which is developing a new site and may need the system intensively for a month or six, after which the subscription can be jettisoned
2. The dedicated high-end Web development house, which has a number of projects continuously on the go.

It is not particularly attractive to consultants, for whom prototyping is a task that crops up every few months, but stop-start licensers are unlikely to be on Protoshare’s list of top customers.

One area where the company really should move to make improvements, however is support. This is a Web-based tool, built on the premise that collaboration is important, and yet there is little effort to collaborate with customers. At this stage of the product’s life-cycle, I would expect to see a buzzing discussion board with the developers asking for feedback, finding out what the users’ priorities for improvement are and telling the users what developments are coming next. At the very least these online discussions act as a place for users to self-support and share hints and tips. Instead there’s a blog with comments turned off, and a rather thin FAQ. If you have a question, the e-mail form simply promises that a Customer Service representative will get back to you.

Site9’s marcoms team is missing a trick here, with little additional effort they could be collecting data on how to continuously improve their offering,  cementing the engagement of their existing user-base and impressing potential visitors with their responsiveness to customers. Perhaps they are just concentrating on super-servicing the super-big accounts, but even they will have "how do I" questions that are often best answered by fellow users.

Post Scriptum.
A couple of days after writing this entry Dave DeAngelis, Site9's  Director of Product Experience got in touch to say that the company is planning to improve it's Web support in November. He also pointed out that the mouse-averse can  tab across to the Title field when naming a page,  but
likes the suggestion of leaving the page name pre-selected on creation.