Wednesday, 11 June 2008

Achieve what you can imagine video

My younger brother Martin who is at Ravensbourne College was recently asked by Mark Johnston at Microsoft to make a short video to promote the 2008 UK Imagine Cup. Martin called me to produce the music (so there is a little bit of self promotion of my work here).

Martin came up with the concept, scripted and animated the whole thing himself and I think the end result is very impressive, even if I'm a little biased towards my sibling. Personally I think he should go into marketing so if anyone out there wants to give him a job snap him up quickly!

Friday, 28 September 2007

Web accessibility testing with Thunder screen reader

Most web designers know that well-structured and valid XHTML with CSS makes a big difference for blind and visually-impaired people surfing the web. As developers we can check our code with things like an accessibility validator, however I've never actually used a screen reader to find out how my web pages sound for a blind person. A search turned up a couple of interesting videos on YouTube about a free screen reader called Thunder which I downloaded and tried out.

As a visually unimpaired person it's a very interesting experience to surf the web using just the keyboard with your monitor switched off. Considering most of us strive to write well-formed code anyway testing it in something like Thunder takes little effort and ensures your site is as accessible as possible. For example I quickly noticed the benefit of placing your content before navigation or adding a "skip to main content" link to avoid hearing a list of navigation links at the top of every page. I also noticed the importance of label tags on forms to keep the input field correctly associated with the label.

Often accessibility is regarded as a secondary consideration by busy designers, but for a person with no sight the internet is a life changing tool allowing them to use email, IM, online shopping and banking amongst many other things. I think putting yourself in someone else's shoes with Thunder is much more involving than reading a list of do's and don'ts and quickly gives you a feel for what the real accessibility issues are.

As a side note I thought it somewhat ironic that the Thunder website employs an old-school table layout, generally regarded as a big no-no for accessibility. The website creator also displays the W3C logo claiming Level A Conformance to Web Content Accessibility Guidelines 1.0. However their site also uses a table layout which doesn't meet WCA Guideline 3: Use markup and style sheets and do so properly.

Wednesday, 29 August 2007

Usability and learnability

The difference between usability and learnability is something that always sticks with me from Joel Spolsky's brilliant User Interface Design for Programmers. He makes the point that when people talk about software usability they are quite often referring to learnability, or how easy it is for a new user to learn how to use an interface. Confusing the two can be bad because learnability is not always the most important part of UI design.

Anyone that uses a command line interface knows how powerful it can be, and indeed for many tasks command lines are simply the best interface. It's rather like the difference between becoming fluent in a foreign language or gesticulating your way by. When holidaying in a country where you don't speak the native tongue, simply pointing to items in a shop or restaurant is much easier than learning the whole language - but if you live in a place for any length of time you will soon find it frustrating and much quicker to get what you want by speaking at least some of the lingo. This isn't to say that hand/mouse waving isn't still appropriate in many situations but just that learning how to communicate in the local language can make your life in Computerland run much more smoothly.

In software we would tend to regard a GUI as more usable than the command shells of power users. The GUI is easier to learn but it isn't necessarily the best tool for the job. A power user might learn keyboard shortcuts or change the file extensions of 100+ photos with a single shell command instead of clicking and renaming each individually with the mouse. Shortcuts like these are invaluable to anyone that uses a computer interface on a daily basis.

The above are common examples where there is a so called user-friendly and power user approach for the same task. However what tack do you take on designing an usable interface when the underlying process is inherently complex? The risk is you are either going to overcomplicate the interface, thus reducing the learnability, or annoy experienced users by making them jump through hoops around an overly simplistic GUI as they try to find advanced features that have been tucked away.

A classic Microsoft approach to the problem is the "Wizard" which holds the user's hand through each option in a step-by-step fashion. This is highly usable but once you know what you're doing, flicking through ten screens to change a single option on the eleventh is not suited to an experienced user who can handle seeing everything on one screen, so the Wizard is often made optional to the full-fat interface.

Apple favour leaving out the extra options. Non-essential functions tend to be hidden from the GUI if not completely removed, but sometimes this requires more in-depth knowledge of keyboard shortcuts (ctrl+click instead of a right mouse button) or even preference files for the advanced stuff. I have to say that from an average/casual user point of view I tend to prefer this approach but it doesn't work for everything.

After having a quick play with Apple's new iWork suite including their spreadsheet "Numbers" I am impressed. There are lots of innovative features such as instant alpha which meet the needs of the casual user. There are strokes of genius peppered with frustration when you want to do something more advanced.

Joel Spolsky makes the point that sometimes all you care about is high learnability, using the example of a tourist information kiosk where almost everybody who uses the interface will use it only once.

On the other hand Microsoft Office is used daily by millions and has hundreds of options, tool bar icons and keyboard shortcuts which might not be classed as user-friendly, however they make many people's computer lives easier and more productive once they've been learnt, so there is an argument for them in this scenario.

Spolsky draws the analogy of putting a new driver behind the wheel of a car and conducting a usability test. As the driver swerved dangerously around parked cars and stalled in the middle of busy junctions you would have to conclude a car is essentially unusable. However we all know that the learning process is worthwhile in order to control a car effectively and learnability isn't the most important factor. That's why the hazard lights button isn't inside the engine bay despite usability tests showing 99.5% of journeys will never need it or when you slam on the brakes in your car, a little dialogue box doesn't pop up saying "Stop now? (Yes/No)".

Thursday, 16 August 2007

Regional Spiceworks settings

If you live in the UK changing the $ currency sign to a £ in Spiceworks isn't very obvious but there is an option tucked away under http://yourservername/settings/advanced/pro.

Scroll down to the bottom of this hidden page and change the $ sign to £ (the HTML entity for £). You can also change the PDF page size to A4 in these hidden settings.

Apparently this feature was added last minute to Spiceworks 1.6 but hopefully in subsequent versions with be more apparent or pick up regional settings from the host machine.

Tuesday, 14 August 2007

Improving SD picture quality on an LCD/plasma TV

Today I unpacked and connected up my shiny new LCD TV. After trying a couple of DVDs and Sky noticed some very irritating video noise. I'm not by any means a videophile and I'm not planning on paying extra for Sky HD but I wanted the best possible picture from my SD (standard definition) equipment.

What follows are some quick tips to get the most from a large screen HDTV with SD sources via SCART such as a DVD player or Sky box (non HD).

The first thing I did in Sky was change the video output mode from PAL to RGB. To get to this option press Services, 4, 1. This improved the image considerably.

Next I did the same on my DVD player, this time there were a couple of small switches on the back of the player. Again this helped but there were still some very distracting cross-hatching patterns which were really bugging me.

Whilst reading up on A/V connections I stumbled across the solution on Wikipeida. The SCART input socket on many TVs also acts as a composite video out and the unscreened wires in my bargain basement SCART leads produced crosstalk between the in and out leading to noise and ghosting. The solution to this was simply open the TV end of the SCART plug and cut the composite video wire on pin 19 (shown below). This prevents the superfluous composite signal being sent back down the cable.

The Wikipeida article suggests it may also be possible to push the pin back into the plug for future use but if you do choose this method don't forget to insulate it so it doesn't short across other pins.

After this modification the cable becomes one-way for composite signals so it's a good idea to label it to avoid head-scratching in years to come when plugged in the wrong way round.

Once I put the cables back I was pleased to see the noise had gone and the picture was much better. At least for the time being my SD setup will keep me happy until HD reaches a more mainstream price.

Thursday, 9 August 2007

Spiceworks - network management software for free

I've recently been tinkering with a piece of network management software called Spiceworks. It's a comprehensive tool with a web interface that helps IT staff manage networks for SMBs with up to 250 devices. It includes monitoring devices, hardware/software inventory listing, alerts, reporting and a help-desk feature to track end-user issues. To top it all off Spiceworks is free.

Claiming to be the "iTunes for IT management" the software is very easy to setup and use so apart from a small problem with Windows firewall and WMI I was up and running very quickly. The Ruby on Rails based server runs on Windows and the interface being web-based can be accessed from any other machine with a web browser, it also doesn't require any client agents to be installed but rakes in a lot of data about devices on your network via WMI and SSH.

It can deal with Windows, OS X, Linux, switches, routers, printers and more. Once it has scanned the network you can investigate the devices and there are some useful predefined reports that can be produced showing things such as computers without anti-virus, disk usage and services running. you can also create and save your own reports.

The inventory listing is a useful feature for small businesses trying to keep track of their software as it can be very time consuming to do this manually or extremely expensive to buy software to do it automatically.

The real "selling point" for Spiceworks is that is is free and anything comparable is either a nightmare to configure or prohibitively expensive for most SMBs. The obvious question is "where is that catch?". On delving a little deeper I discovered it is funded by advertising on the web interface. Of course advertising in software isn't a new idea but they've been sensible with the Spiceworks ads policy and there are no distracting Flash animated banners goading you to punch a monkey in the face but mainly just plain links to IT articles. These links lead to sponsored white-paper style articles on various IT technologies. There is the occasional animated advert but nothing you don't see around on the average tech website.

I can imagine this will work well considering IT departments tend to have money to spend and the advertising can be tailored to their networking needs. SMBs need hardware, software and training so advertising in a tool like Spiceworks can tap into this. For example Spiceworks could detect that your computers don't have antivirus so show you some related ads for AV products, or similarly if your server is running low on hard drive space suggest a retailer selling replacement drives. Combined with a very well written piece of software that is used by IT staff on a daily basis it sounds like a very clever business model.

One problem I have noticed is that running the server from my desktop PC seemed a little slow although I'm not sure if this is processor usage or the interface waiting for ads to load. Although I've only really been experimenting with Spiceworks so far I definitely think it will be a very useful tool for managing our network and plan to install it on a more permanent home soon.

Wednesday, 20 June 2007

Essential Firefox extensions

When working on websites I've tested them in Internet Explorer and Firefox for some time but until recently still used IE as my main browser. A couple of months ago I decided to take the plunge and switch completely to Firefox. There are so many things that make Firefox better than IE, especially for web development. What follows is a list of my current favourite extensions:

Spell checking
I always found it ridiculous that IE doesn't have a built in spell checker. Firefox has many languages available for download so you can add spell checking to your web forms.

This is probably one of the most useful tools I have come across for web development. It allows you to inspect and edit CSS, HTML and Javascript on-the-fly directly in the browser. I find it particularly useful for debugging CSS layouts when I'm just not sure where a mysterious 50 pixel wide gulf between elements has come from.

Flash adverts can be very annoying when I use RDP to connect to my desktop remotely. This extension lets you decide whether or not to run them.

Greasemonkey is an extension that allows scripts to edit the way pages look. For example you can add extra links to ebay that only show negative feedback, or perhaps show a clock counting down to the end of the auction. There are hundreds of free scripts for all kinds of popular websites available at

IE tab
Firefox is great but sometimes you need to check a page in Internet Explorer. To avoid the sick feeling clicking the blue 'e' icon produces IE tab allows you to render pages using the IE engine within a Firefox tab. It also allows you to set certain sites such as Windows Update to always open in the IE engine.

Web Developer toolbar
This is a Firefox toolbar with various useful options. Similar to Firebug it reveals the structure of the page and has lots of handy features for working with forms and images.

Not really a Firefox extension but hugely useful, Fiddler is a free HTTP debugging proxy. Basically it sits between your browser and the server showing you everything your browser requests and allowing you to "fiddle". You can view anything from raw hex, to XML to an image as well as build requests. It's invaluable for troubleshooting all kinds of web applications and also just exploring how they are put together. Whilst being Windows only (it's from Microsoft) there is also Charles for OS X.