Week Beginning 9th September 2013

The majority of this week was split between two projects:  DSL and Mapping Metaphor.  For DSL I created two further mockups based on feedback from Ann Ferguson and the SLD people.  There were quite a few further refinements to make and it was good to return to my original designs after a few weeks to see how else I could improve them.  In addition to implementing the requested changes I also created a version with a different colour scheme, tried out some different font possibilities and also created a much nicer ‘compact’ menu that gets displayed when viewing the interface on a tablet / smartphone.  I will need to wait to hear back from Ann to see if any further changes are required.

Most of the rest of the week was spent on the Mapping Metaphor project, building upon the work I started last week using the D3 Javascript visualisation library.  I was intended to create some further interface mockups this week but got sucked into the visualisation side of things instead.  I’ve managed to make a bit of progress with the ‘Hierarchical Edge Bundling’ visualisation this week, with the help of Ellen who provided me with answers to all the questions I sent her way.  First of all I incorporated ‘top level’ category names into the diagram, in addition to the category letters.  This was more tricky than you might think as the system uses the text for both display and as IDs behind the scenes.  If the text contains invalid characters (including spaces, commas, brackets, slashes and full stops) then the script stops working.  I’ve implemented a bit of a hack to separate out display and ID versions of the text, but eventually I’ll need to make this work better.

I have also created a new version of the diagram that works slightly differently.  With this version you actually have to click on a node to make the connecting lines light up, and once you do so the lines stay lit until you close the popup or open a different one.  This should make it easier for a user to click on a highlighted connector to access information about the join (for example in this aggregated diagram the line popup could display the number of subcategories within the two joined categories that link to each other – e.g. “Education – Life: x categories within Education link to y categories in Life”).

Also within the node popups in this version of the aggregated diagram there is a ‘show connections’ link.  Click on this to ‘drill down’ into a category.  Doing so displays a new diagram that lists all of the subcategories within a category, plus all of the other categories that each one links to (both within and without the top-level category). This diagram is actually generated on the fly based on the letter passed to it.  PHP takes the letter, queries the database and then formats the JSON output which is then pulled into the Javascript to generate the diagram.

There’s still lots to be done – the next big thing will be to see if it is actually possible to make the highlighted connecting lines clickable.  I’m not in a position to include URLs for these mockups yet as I’m not sure the project would want me making the data available publicly, but progress is definitely being made.

I also spent a bit of time this week reading over the bid materials that Marc has written for the ‘big data’ call and gave a little bit of feedback with regards to this.