Mountains

A Github repository Visualisation Project for Work / Artwork

This is a post about the Github repository Visualisation Project I did for Work / Artwork.

I was approached by Arpad last year on this data visualisation project : Work/Art Work. The idea is simple : create a visualisation of any given GitHub repository. Arpad has already done the part of retrieving all the information from the repository, including commits, branches, authors, file structure ... etc. All I need to do is use this data to come up with an interesting design. It is a very interesting challenge so I took this challenge.

Inspirations

Born in a country filled with high mountains, I've always been inspired by the shape of them.

It occurs to me that Perhaps I can use the mountain range to represent the folder structure of the repository, while the peak of each mountain could be the node of each folder. I start looking for references and gathering a mood-board around this idea :

I was really excited about the idea with the reference image I've found and started experimenting with it :

The first experiment

I started with laying out the folder to a tree-like structure, and having the nodes spread out without touching each other, this will become the bones of the mountains. The next step is to generate a height map based on these bones by calculating the distance from each point to the nearest 'bone'. This works out nicely and I can generate a mountain look shape with this approach. And also start throwing in some noise texture trying to make it look a bit more realistic. 

Rework on the look of the mountain

This is a good first step as a proof of concept, however the result looks nothing like a real mountain. The shape was way too smooth and lacked the shape edges of the mountains. So I went back again reworking on the height-map, this time focusing on creating the shape edge of the mountain by mixing the smoothstep with exponential function and I got a good looking shape of the mountain. Then lastly apply some noise to the height map and also distort the mountain ranges to increase the realistic look of it. 

Adding decorations

At this stage I am pretty happy with the look of the mountain, so I start adding some decoration elements to it, including the contour line, longitude and latitude line to make it look more like a real map. Then start putting the name of the repository and the name of each folder to be the name of the mountains, and adding the authors at the bottom of the map. Which leads to the final result : 

The final result

I had great fun working on this project, from gathering ideas, trying them out, encountering problems then finding the solution for them. For sure there are still places to improve on this however I am happy to be able to achieve this look of a generated mountain. The final result was a print come framed and I was really surprised by the quality of it. 

And now it's sitting nicely alongside with my other prints :

Lastly there are other very talented artists creating stunning visuals for this project where you can find them here : Work/Artwork