13 Mar

Web Dev: Information Architecture

The first thing I did was write down all the different elements of the proposed website.

I then sorted them into logical categories, to get a rough idea of content and navigation. The result is below.


I then created the following mind map on Mind42.com (a free online mapping tool) to sort these into something I could work with.

HomeThere isn’t a huge amount of content to sort, but allowing the user to get to the information they need quickly and easily increases satisfaction, and could ultimately be the difference between someone booking or choosing somewhere else.

Please follow and like:
10 Dec

Web Dev: Card sorting & IA

I used card sorting techniques to help with the information architecture for the new website.

Writing down each section and element that needs to be required in the project, and then sorting them will really help with organising navigation and arranging the elements priority within the page and the website itself. The following image shows the card sorting I completed myself.

Card Sorting Pic

I then used Optimal Sort to allow others to arrange the cards how they see fit. This will give me a different perspective on the matter, and see how other people naturally categorise elements. The following is an image of my online card arrangement.

Optimal sort

I created the following MindMap from all the information I’ve gathered over the last few months, which includes a brief design of the navigation and labels.

BOSH Run Home

I then finished my Site Map, which is a more organised version of the MindMap above. It shows the way I intend to organise the new website (download to view).


Click on the image to download and zoom in.


Please follow and like:
19 Nov

Web Dev: Competitor Analysis

An expert analysis can be extremely beneficial, in addition to user research. When talking to Scott Goodwin, creator of BOSH Run, he outlined his main competitors as Watford Joggers and Fetch Everyone. I chose to analyse their websites using HCI principles, heuristics, and user-centered design.

You can see an example of their website homepages below, along with BOSH’s current website.

Screen Shot 2014-11-19 at 11.57.09

boshrun.com (Screen Shot 2014-11-19)

watfordjoggers.org.uk (Screen Shot 2014-12-15)

watfordjoggers.org.uk (Screen Shot 2014-12-15)

fetch everyone.com (Screen Shot 2014-12-15)

fetch everyone.com (Screen Shot 2014-12-15)

The following table contains some critical comparison points, and a score out of 5 for each element. The questions are all examples of some essential design usability principles.
Screen Shot 2014-11-20 at 22.38.42

I used this data to create a series of radar charts, to visualise how well BOSH is doing against it’s competitors. The last chart is a comparison of all three.



It is evident that the current BOSH website needs work, but there are many areas for improvement on the other sites as well. The navigation is adequate but the design (particularly the graphics and overall branding) needs to be refined.

There is a very obvious difference in the amount of content on each site. Watford Joggers and Fetch both have substantially more, but this is mainly because BOSH uses Facebook primarily, and amount of user-generated content on social media is massive.


It will be important to integrate this content with the new website, transforming it into the main hub of activity for BOSH. With the appropriate tools, the members of BOSH and their contributions will allow for the new website to be one of the top running club websites in the area. Therefore, I am confident that the new BOSH website will score substantially higher on this competitor analysis board.

I also conducted a multi-faceted analysis of the information architecture of each site, as follows.


BOSH multi-faceted analysis of information architecture

Watford Joggers multi-faceted analysis of information architecture

Watford Joggers multi-faceted analysis of information architecture

Fetch Everyone multi-faceted analysis of information architecture

Fetch Everyone multi-faceted analysis of information architecture

These sketches allowed me to directly compare the page layouts of the three sites.


Please follow and like: