Week 2: The Four Themes / by Valzorra

Although I had come up with a series of starting points on the Friday of the Good Start and Bad Start Workshop, I was not entirely satisfied with them and I thought that I need a lot more in order to make a decision about the four I would look into further. That’s why I sat down and took a look at everything I had come up with on the Friday. Once I had written all of the topics down, I started filling that list with more and more topics which stemmed from each other and made connections between each other. During this process, I was mostly answering the questions “What interests me?“ and “What am I passionate about?“. It’s important to me to spend this year working on a project that I would really enjoy, and a project that would hopefully inspire and intrigue others in the topic. I want to end Year 3 with a project I am proud of and a project that represents me and my work in the best way possible. That’s why it only seemed logical to me to focus on topics I am passionate about as that would make the work flow infinitely easier. With this approach I came up with a large list of around one hundred and twenty topics, which is detailed below.

The first page of notes on topics I am passionate about and would enjoy researching.

The first page of notes on topics I am passionate about and would enjoy researching.

A second page of topics, all amounting to about 120.

A second page of topics, all amounting to about 120.

However, now that I had this massive list of topics, I needed a way to pick my four main ones that I would like to narrow down on and research further. As I wanted to make an educated decision on which topics to choose, I felt like I needed a better way to visualise the data and to represent the connections between individual topics. So many of these subjects were incredibly intertwined and it made sense to me to go for the topics that had the most links and connections with other themes and ideas. This meant that I needed to go down the rabbit hole that is Data Visualisation and to pick the best methodology of representing my interests and the relationships between them. I did most of my research into Data Visualisation from a fantastic website called D3, which deals with Data-Driven Documentation. From the dozens and dozens of graphs they had to offer, I found that a tradition Arc Diagram and a Radial Arc Diagram were the most appropriate for the type of information I wanted to represent. At this stage I knew what I was aiming for and now it was a matter of figuring out how to craft the diagram itself.

Just a fraction of the available diagrams at D3.

Just a fraction of the available diagrams at D3.

Upon further research into Arc and Radial Arc diagrams, I concluded that the easiest and most modular way to craft them would be through the use of HTML and JavaScript. That format allows for the addition or exclusion of new points of data without having to recreate the entire document as you would have to if it were created as an image. Additionally, if I were to create this diagram in an image editing software, I would have to manage separate layers for hundreds of connections between the different starting points, which would not only be incredibly time-consuming, but it would also be very heavy on my computer’s processing power. Therefore, the most optimal and time-saving solution for crafting Arc and Radial Arc diagrams is to use a bit of programming.

To create the diagrams I took advantage of a very useful JavaScript library called Provotis, created by Mike Bostock. That library has the majority of the code and logic behind the drawing algorithms of the graphs. In short, the library works by creating a point, a node, for each piece of data. In my case, there would be about 120 nodes in the entire graph, as that’s the number of interests I wanted to analyse. For the Arc Diagram, it arranges all nodes in a straight line and creates a half circle between two nodes with the diameter of that half-circle being the distance between the two points. That half-circle is what represents the connection and between the two nodes. The Radial Arc Diagram is very similar, however, instead of positioning all nodes in a straight line, it arranges them in a circle. The connections themselves are straight lines which connect one point from that circle to another. The more elements a single node is connected to the larger it’s point becomes, thus signifying that that object has a multitude of possible links and connections to the other 120 or so elements. Therefore, the largest points of the diagram, the ones with the most connections, would be the ones I choose to analyse further.

To begin the process of sorting and organising all of my interests, I first classified all of the data points into distinct groups. I ended up with a total of seven groups, which were Art, STEM, Design, Psychology, Poetry, Concepts, and Other. Once the elements had been arranged in that manner, I started to position them all on the appropriate nodes for the graph. Below I have given a small snippet of how all of the nodes were inserted into my .js file.

//Snippet of how I have structured the nodes. 
//Each group represents a category of interests.
//There are a total of 7 groups.

nodes:[
    {nodeName:"Art", group:1},
    {nodeName:"Abstract Art", group:1},
    {nodeName:"Anatomy", group:1},
    {nodeName:"Cubism", group:1},
    {nodeName:"Impressionism", group:1},
    {nodeName:"Surrealism", group:1},
    {nodeName:"Asymmetry", group:1},
    {nodeName:"Composition", group:1},
    {nodeName:"Golden Ratio", group:1},
    {nodeName:"Salvador Dali", group:1},
    {nodeName:"Helen Frankenthaler", group:1},
    {nodeName:"Architecture", group:1},
    {nodeName:"Brutalism", group:1},
    {nodeName:"Structuralism", group:1},
    {nodeName:"M.C. Escher", group:1},
  // (...) 
    {nodeName:"Punk", group:7},
    {nodeName:"Neon", group:7},
    {nodeName:"3D Modelling", group:7},
    {nodeName:"Fantasy", group:7},
    {nodeName:"Magic", group:7},
    {nodeName:"Super Heroes", group:7},
    {nodeName:"Super Powers", group:7},
    {nodeName:"Supernatural Fiction", group:7},
  ],

Once I had listed all of my interests and turned them into nodes, it was time to establish the connections between them. Each node in this array has a reference number starting from 0. In order to establish a connection between two nodes one must simply enter the reference number of the source of the connection and the reference number of the target node. Additionally, based on how significant each of the interests and connections are to me, I have added a value to each connection, although most of the nodes have a base value of 1. Below I have attached an example of how the connections between nodes look.

//This is the basic structure of the linking system.

links:[
    {source:0, target:1, value:1},
    {source:0, target:2, value:1},
    {source:0, target:3, value:1},
    {source:0, target:4, value:1},
    {source:0, target:5, value:1},
    {source:0, target:6, value:1},
    {source:0, target:7, value:1},
    {source:0, target:8, value:1},
    {source:0, target:9, value:1},
    {source:0, target:10, value:1},
    {source:0, target:11, value:1},
    {source:0, target:12, value:1},
    {source:0, target:13, value:1},
    {source:0, target:14, value:1},
    {source:0, target:15, value:1},
 // (...)
    {source:76, target:66, value:2},
    {source:76, target:63, value:2},
    {source:76, target:62, value:2},
    {source:76, target:58, value:2},
    {source:77, target:58, value:1},
    {source:78, target:58, value:1},
    {source:79, target:58, value:1}
  ]

After I had entered all of the connections I found between all of the elements I was left with a complex, but accurate graph representing the different relationships between all of these interests of mine. Based on the number of links between them, there were a handful of categories that stood out and connected with dozens of other elements. The category with the most connections was Mathematics, followed by Art, Geometry and Geometric Rotation, and Poetry. Although I have attached both an Arc and a Radial Arc Diagram, I strongly prefer the Radial Arc Diagram as it is much easier to read through and to see the connections between the separate nodes.

Finished version of the Arc Diagram.

Finished version of the Arc Diagram.

Finished Version of the Radial Arc Diagram.

Thoughts and Reflection

After this examination of my main interests and passions, of how they fit into categories, and how each element links up to the others, I have successfully narrowed down my search to the four topics with the most connections of all. These topics are Mathematics, Art, Geometry, and Poetry. Overall, I was quite pleased with this entire process for a few reasons. This was a fantastic way to break from the traditional mind maps that I typically do, and offered me a new way to look at data and to examine crucial connections between data points. Additionally, working with HTML and JavaScript is not something I typically engage in, so it was quite fun and challenging to practise those skills and to further familiarise myself with the languages. I may very well use these skills for Data Visualisation in the future as well, simply because it is a very clear and precise way of showcasing large and complex information. Finally, I was also really happy with the results from this exercise, because I am highly interested in all four of the most popular topics. Additionally, they are all quite abstract and will provide me with an extensive range of research opportunities and avenues. I am super excited to begin diving into these topics a bit further and presenting them all to the course this Friday. So far, so good!