Web Application Prototyping using Microsoft Visio and Paint

Posted in Business Analysis | Posted on 14-11-2009

0

At my normal 9 to 5 job as a Business Analyst we use a number of different processes and tools within our development process. For web screen prototyping / mock-ups we use Microsoft Visio, however, the task can be quite laborious.

I was looking to see if there were any online tools which we could use and cam across Mockingbird which looks like it might be a great tool. Unfortunately my work still runs on a number of legacy platforms and we are restricted to Internet Explorer 6 ! – I know, it’s a nightmare. There are more and more broken websites and tools we can’t use on a daily basis but it is a common story. Anyway this made me come to the conclusion that I would be better to try and use the tools we currently have at our discretion.

I work for a medium sized finance company and our web platform has a number of style and display standards for our web platform so I basically mocked up some quick HTML pages using the existing stylesheet for our web platform. I created items such as checkboxes, input fields, upload fields, table headers, buttons, etc so I had a catalogue of the key components in our web platform.

Once I had these I did an Alt+Print Screen, pasted this into MS Paint (it’s the only graphics tool we have!). I opened up Visio and created a new Stencil. You can find out details on the Microsoft Website here. Once I had my blank Stencil I cut each element individually and pasted it into the Visio stencil panel and named them accordingly. Once I was happy with the stencil I saved it for later use.

I’m pretty sure having this Stencil for later use will speed up the process of quickly mocking up prototype web screens. I’m now trying to think if there is any other Stencils we can use since it really is a great tool when designing products with reusable components.

I’m interested to hear your opinions and ideas on this so please leave any comments you have.

Write a comment