Squared Paper Internship Projects

For the last 3 weeks I did a really exciting internship with a small broadcast software company called Squared Paper. Their main product is called Busby, and it’s an  architecture system that connects a set of specialised micro-services with a centralised Enterprise Service Bus.

To start with I was given the task of creating an interactive gantt chart for one of their clients for the purpose of keeping track of producing film trailers in several different languages. I needed to learn a lot on the fly as I’d never done JavaScript, web development or user interface before, and I needed to use a library called D3 (Short for Data Driven Documents) which works quite dramatically differently than I was used to. I dealt with the learning bit by bit and started by making a very simple, feature light version of the chart. By the end of the week I finished a much more elaborate version with the following features:

  • Reads in JSON files
  • Draws arrows between dependencies
  • Tasks sorted into lanes
  • Hover behaviours- on task hover the dependency arrows associated with it are highlighted, a tooltip with the details is shown and the ticks on the x axis are replaced with one at the start and end of the task
  • X axis zooming and panning
  • Labels shorten with ellipses if the bar is too short for it
  • Labels stay onscreen if the bar is still visible but the start has been panned offscreen

My next two weeks were spent on the much more involved project of writing microservices for the Busby software itself. The best and most satisfying part of this was that it was completely configurable, and I can definitely bring the techniques for that into my projects going forward. I altered their exsisting code which sent a request to a big data service and dumped the resulting data into a report, and instead made it send a request on a repeating configurable interval, reformat the data into one that would work with NVD3 premade charts and send it onto a system diagram webpage, that I also wrote. It was odd working with the premade charts because I didn’t know what was going on “under the hood” as easily. The system diagram would also work with single data values to be shown on labels, and apply conditional formatting to them. The conditional formatting is also configurable, so if value meets a condition rule in the configuration file for a particular label it will apply the corresponding CSS.

It was an immensely challenging 3 weeks but such a valuable experience. When my software is in use I’ve been promised screenshots which will go on this post, but in the meantime I’ll just apply all my new knowledge to my projects going forward and show it off that way.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s