To make sure our prototype is both technically right and easy to use, we conducted a series of usability tests.
Compatibility Tests
Although the prototype was only designed to work in Google Chrome, it is worth testing its compatibility with other browsers to see how far it would be from being functional and releasable as a product. To achieve this, we tested it under popular web browsers (IE6.0, IE7.0 IE8.0, IE9.0, Safari, Chrome, Firefox) in different Operating Systems (Windows 7 and Mac OS X Snow Leopard).
The results show that webpage crushes in IE6.0 (WINDOWS 7), 
Image shown normally in Chrome, Safari and Firefox (see the image underneath)
but image frames disappeared in all IE browsers (see the image underneath)
Image frame not shown in IE Browsers
Apart from this, the prototype works fine.
Tools used: IE Tester, Chrome debugger, Firefox debugger
In the second part, we traced the behaviour of testers (who used the system for the first time) by recoding their engagement with system. We recorded the sessions using Silverback 2.0. This session is split into three phases:
before testers do the test, they are asked to answer several questions:
*Have you seen the taggr advertising video?
*Have you used taggr before?
*Have you used other tagging systems before, for example facebook photo tags?
during the test, they’re asked to perform several tasks, as most of them are amateurs, we asked them to speak out their mind loudly, then we can record what they really want to do clearly. These tasks include:
* Tag one of the people in the photo.
* View that person’s other photos.
* Remove the tag you just added.
After the test, testers are asked to give feedbacks if there are any.
Test Subject 1
Test Subject 2
- This user tried to right click twice, once when placing a tag, and once when trying to remove it. This needs consideration over what is more appropriate, retaining the original right-click functionality of the site, or making it work “as expected” for users who right click. I certainly think a right click menu to remove tags could be a useful idea.
- She clicked the name rather than the “Photos” link, taking her to the account rather than the other taggr photos. We need to look at a better way of highlighting the difference.
- At the end there is a software bug which prevents her from removing the tag, however she performed the action correctly.
Test Subject 3
- Performed well due to the familiar facebook-like interface.
- Tried to remove a tag when he didn’t have permission. Maybe we should hide the remove button when it’s not permitted.
- Didn’t like being unable to click through from the photo list to the full photos, however this is obviously not the photo list we would actually use.
- There was no confirmation on remove tags. Maybe we need to think about adding one.
- There was a bug where “Finish tagging” didn’t appear although it should have.
Test Subject 4
- tried to remove tag but couldn’t – hide it if you don’t have permission?
- tried to drag
- couldn’t spell my name – we can’t deal with this 😉
- looked for remove before “Start tagging” – maybe offer some option to remove tags without needing to “Start Tagging”?
Test Subject 5
- Didn’t realise the need to “Start Tagging”
- Noticed delay between clicking tag and tag placing
- First viewed Facebook profile instead of photos. This isn’t obvious
- Tried to remove tag without “Start Tagging”
Conclusions
Dragging to create a tag is definitely something to be included. We have done this in more recent prototypes. Remove the delay between adding a tag and confirming – perhaps show a loading indicator so people know it hasn’t just frozen. Find a better way of linking to different aspects of a user’s profile (photos, etc.) because people seem to just click the name. Maybe add a confirmation when removing tags, and don’t show the tags which the user doesn’t have permission to remove.
We regret that we could not perform more usability tests at different stages in the task but it was difficult to get together the group of people and the appropriate environment to conduct the tests. In future we would definitely conduct more tests as we feel this gave useful feedback on problems which we didn’t realise existed.
Technically, bugs detected should be fixed. From user experience point of view, the text in the following image is too hard to recognize sometimes as the colour of the text is very close to the background colour. In the following example image, you can hardly recognize there’re texts underneath the Chinese man. A proposed solution is to analysis the pixels of the background and make the colour of the text reverse of the colour of the background.