Three smart UI prototyping techniques

When designing a solution usually we need to show some slick and simple pictures showing user interface we plan to implement. This seems to be the only language both developers and customers seem to understand. Or maybe let me rephrase it to be more specific – screenshot has the highest likelihood that its interpretation by all parties will be similar. Preparing such images takes a long time – the most popular approaches I’ve seen so far are:

  • use your favorite graphic editor – e.q. Gimp,, Photoshop, Illustrator, etc. The result usually looks good, but is a nightmare to maintain, especially when you need big chunk of text or new large field.
  • mock the UI in Word – get a ugly wire-frame of the window only to forget to group the boxes and see them flying around the document after any change
  • … or Excel – Excel is good for everything, isn’t it?
  • create a form in html – happy styling, call me next week when you’re done!

The process was usually time consuming, but not any more! This week I’ve seen three smart prototyping approaches:

  • Balsamiq UI modeler – application to create any UI layout using drag&drop. The web-based demo (functional!) version is available
  • Microsoft Visual Studio Express – free, fully drag&drop RAD environment. It seems like an overkill to use it only for this reason, but consider the price tag!
  • Microsoft Visio – especially 2010 edition – nice, easy and integrated with Microsoft Office Suite

All above applications let you create both static window images and interactive UI prototypes. Next time you talk with your customer show him a “working” demo next day after you got first requirements – he will love you! And hopefully he will understand what you are actually trying to achieve.

How British police made me set up my next project on the cloud

Today British police made available their new service – a complete street level map of crimes in England and Wales. The webpage made to all possible headlines in daily papers, tv and radio. The effect is that the service is virtually down and won’t be usable until the novelty wears out.

All web pages have a peak from time to time. It can by due to various reasons – PR publication, Facebook craze, advertisement campaign, algorithm change at google or change of cosmic radiation. You can predict some peaks, some will come as a total surprise. In both cases the effect is the same – the system overloads and you’re starting losing users. That’s bad, really bad.

What could site owners do to prevent this? There are couple of options:

  • Scale IT infrastructure to handle the traffic during peaks. This sounds good until you start calculating cost. If you scale for a peak 10 times larger than normal traffic, you will spent 10 times more money. And how can you be sure the peak won’t be 11 times normal traffic? Or 101 times? Or 1001? And what would you do if when the peak is over? You can donate unused computing power to Seti@Home, but I doubt your CFO will appreciate this.
  • Deploy to a cloud. When your application is running in a cloud and you foreseen incoming peak, because you’ve bought nation wide TV ad campaign for exmaple, you allocate more resources for some time (for example start some new instances on Amazon EC2). And when the peak is unexpected? You allocate more resources when it happens! Or if you set up the cloud to allocate additional resources automatically for you, you just sit and monitor if everything works smoothly. When the traffic calms down, you just switch off unwanted resources and stop paying for them.

“What’s the catch?”, you may ask. There is none. The whole process just requires some planning in advance. Designing application for scalability is slightly tougher, but it’s not a black magic. And it’s not even rocket science. There are many infrastructure scalability patterns detailed on web. You will have to make some technical decisions on load balancing, session sharing, fallback procedures. The testing is also bit more complicated, but only due to fact of additional features. The rest will be exactly the same as normal design and development job.

I have always known that police is a useful force ;)