Hacks/Hackers Manchester – looking forward

2015 New Year celebration with the date outlined by colourful fiery sparklers on a dark New Year's Eve night

Accessed from http://christmasstockimages.com/free/new_year/slides/2015_new_year.htm. CC By 3.0

In an attempt to shake off the sluggishness of New Year and all that, I met with my co-organiser, Rob, today to do some coffee-fuelled forward planning for Hacks/HackersMcr. Here are some of the ideas we’re working on. As always, do let us know if you have any suggestions for themes, speakers, events or skill-shares. Spread the word!

  1. Late Feb/March – Hack the Election! There’s an election coming up. (Had you noticed?!) But how could news organisations get younger people interested in politics? Are games, apps, cool tools the answer? We’re going to bring together hackers, games developers, Apps developers, journalists, students to work in informal groups on their own crazy ideas (you don’t have to actually build anything there and then! Just come up with an idea and maybe a few drawings). Then groups get the opportunity to pitch them and vote on a winner!
  2. May – Digital Mapping. Maps can illuminate ideas in all sorts of amazing ways so we want to bring together journalists, technologists, artists, geographers to tell us about the latest ideas for mapping the future. We’re expecting this to be a weekend event to give us a bit longer to play and we hope to arrange some mini-skillshares so you can learn a few new techniques.
  3. Learning Lunches. Bring your Own Lunch and learn a new skill! We’re thinking APIs, regular expressions – anything, really, that falls into the broad hacks/hackers remit. Again, ideas and offers welcome.

There are a few other ideas knocking around as well but these are the main ones we wanted to share with our members. We’re also going to be exploring some new venues so, again, suggestions welcome. Could your organisation offer a space, for example?

Beginner’s easy guide to digital mapping with TileMill

After the euphoria of learning how to GEOCode my spreadsheet data, I then had to learn what to do with it. Even the so-called beginner tutorials I came across weren’t quite beginner enough for me and so I’ve had to do a lot of rooting around for answers. I’m sure one of the generous members of Hacks/HackersMcr would have shown me all this, but I couldn’t wait for the next meet-up….

Why GEOCode in the first place?

It’s true, if you’re happy plonking a few markers on a google map, then you don’t need to GEOCode. Google Maps has an in-built GEOcoder which automatically converts your postcodes and addresses into longitude/latitude without you even realising it’s doing it. But sometimes we get a little bored of seeing yet another Google map, don’t we?? So if we want to create something a bit more styling’, we need to find a mapping tool which will allow us to do some cool customisation. There are many around but in this blog post, I’m going to be using TileMill by Mapbox.

So with TileMill you can really go to town and customise your maps, add layers of data etc. BUT, it won’t automatically GEOCode your data. So you need to go through the steps on the previous blog post to get your data ready for everything that follows from here.


Download TileMill. Just follow the instructions! It should work very easily. Now I’m going to talk you through how to create a map with two types of data (two layers of data). One is a spreadsheet of GEOcoded data to create markers. The other will show the boundaries of English Government regions (GOR) in the form of boundary lines superimposed on the map.

Click on New Project and give it a catchy name. Don’t leave any spaces between words; TileMill won’t like that. TileMill automatically has a layer (of data) pre-installed which shows the boundary lines of countries. It will look like this.

Screen Shot TileMill project

Import GEOCoded spreadsheet into TileMill

You can use this spreadsheet which is a list of universities and HE institutions that are members of Universities UK. (I scraped the data using Outwit but you can use any data for this exercise). It’s not perfect data but it gives us something to play with. I’ve already GEOCoded it. I then need to download it as a .csv file (comma separated file i.e. excel spreadsheet)

To get this data into your TileMill project, click on the Layer icon on the bottom left hand corner and then click Add Layer. Again, give it an ID without any spaces. Let’s call it Universities. Then go down to Data Source and click Browse. Go and find that GEOCoded spreadsheet you downloaded and click Done.

Screen Shot Add Layer

Now click Save and Style and you should find red dots appearing all over your map. Voila!

Screen Shot Red Dots


Adding a Shape File

This bit’s a little trickier and took me some time and searching to get it to work. A shape file is a file that ends .shp. It contains data that will show up as boundary lines on your map e.g. countries, counties, regions. I’m going to use a shape file that will show the boundaries of English Government Regions (GOR) which you can find online here. Click to download. This will give you a zipped folder containing a number of files only one of which is a .shp file. BUT, TileMill will need the full contents of this folder in order to make sense of the .shp file. You can’t simply copy the .shp file and put it in some random folder on your computer and hope to put that into your Datasource in TileMill. You’ll get a nasty error message like this.

Screen Shot Error

Unable to determine SRS for layer “GOR” at /Users/lizabethhannaford/Documents/MapBox/project/UniversitiesDemo/layers/GOR/Regions.shp

Not nice! That’s because the .shp file has become separated from all the other files it depends on in that zipped folder and so it no longer makes sense. So save the entire zipped folder somewhere sensible that you’ll be able to browse to once you’ve downloaded it. There’s no need to try opening any of the files inside it. Now browse to that zipped folder in the Datasource window.

Screen Shot Folder
Look how cleverly the Regions.shp file now stands alone! Click on it to add it to the end of the Datasource. That file path should now end in .shp so click Done. Then click Save and Style. NO error message this time. Yay!

Screen Shot Boundaries
So we can see the boundary lines but the green fill colour has obscured our dots, annoyingly. But don’t worry! We can fix that by tweaking the CODE in the right hand column. This code is called CartoCSS and, as the name implies, it’s a particular form of CSS that works for styling maps.

Look for #GOR and you’ll find the styling instructions for the shape file layer we just added. We need to reduce the opacity so our dots show through. Let’s change it to 0. Whilst we’re at it, let’s make the boundary line a little thicker by changing it from 0.5 to 1.

Screen Shot tweaked CartoCSS
OK, so it’s no work of art, but it does get us started and opens up some fun possibilities.

Next Steps….

  • Find different shape files to display different boundaries and other features
  • Learn more about CartoCSS and experiment
  • Are there stylesheet libraries that are available to copy and paste?

GEOCode – an (absolute) beginner’s guide

Hacks/HackersMcr – Skill sharing

Hacks/Hackers is about discussions, networking and skill sharing so here’s my fave takeaway from December’s Hacks/HackersMCR meet-up. Thanks to my co-organiser, Rob, for passing on his digital mapping knowledge….

Explaining geocoding at Hacks/HackersMcr

JSON in the basement


So GEOCoding is the process of getting richer data about a location. Typically, you have street addresses or postcodes and you want to convert them into coordinates with longitude and latitude. This helps you to do more fun things with maps (which I’ll get onto in a future blog post).

Latitude and Longitude on Ayr Harbour Wall

Latitude and Longitude on Ayr Harbour Wall
© Copyright Colin Park and licensed for reuse under Creative Commons Licence (CC BY-SA 2.0)

One of my students needed to do this for a project he was working on but, unfortunately, this HHMcr skill share came a bit late for that.

You can do this super quick in a Google spreadsheet!

GitHub? Are you serious?

So if you missed the December HHMcr meet-up, you can find out how to do this in this very useful blog post from Mapbox. Or you can read on and I’ll attempt to explain in a quick and easy way that even non-coding journalists like me can understand. It involves going to GitHub but DON’T PANIC! I went to GitHub and came out again unharmed. If you haven’t heard of it, GitHub is a huge, social platform for collaborating on projects. Yes, it started out as a place for very clever programmers but it’s evolved into so much more and we should all resolve to spend some time there.

Go to GitHub and copy this code. I don’t pretend to understand the code but I do know how to Copy and Paste so I’m good to go.

Next, open your Google spreadsheet and click on the tab Tools>Script Editor. Paste the code you just copied into this space (getting rid of the default wording that’s already there). Call it Geo, save and close and refresh your spreadsheet. As if by magic, you’ll now see a new tab has appeared called Geo.

Now the fun starts. Select the addresses/postcodes you want to geocode – it could be a whole column or just a few cells. Click that Geo tab you just cleverly created. Then click “Geocode addresses.” It’ll ask you to authorise this. If you’re happy using MapQuest to find your data (at this stage, you are), just click Geocode. You might need to be a little patient, but this should create three new columns in your spreadsheet with your longitude and latitude coordinates. The third column (geo_accuracy) helps you check, erm, the accuracy of the coordinates. It’ll usually say something like “residential.” If it says something unexpected, it might be a sign it’s not found the correct coordinates and you may need to put more/slightly different information into the address. So, as always, check and check again.

Allow yourself a well-deserved fist pump.

That’ll do for now. I’ll blog more about some stuff we can do with this (JSON, yeah!)

Hacks/Hackers Manchester – December Meet-Up – Wakelet

Wakelet – collect and organise everything!

One of the things we like to do at Hacks/HackersMcr is showcase local tech companies and, hopefully, learn from their experiences. So we were very pleased to welcome Wakelet (the whole team!) to our December meet-up.

The idea behind Wakelet is that it allows you to bring together all your beautiful/important web content into one place – either for your private use or to share publicly. Each collection is called a Wake and they’re easy to embed on your existing website. Here’s a seasonal one!

I’ve also seen one of my former journalism students at the University of Salford create a Wake of  libel cases in the news to help him with his Law and Ethics Module. He shared it with fellow students on FaceBook as a potential useful learning resource.

So I like Wakelet and I think it’s got potential. It’s FREE and I see it being a really useful learning tool in class to curate and share resources around a subject.

And to show you how easy it is to use, here’s my first Wake….

HacksHackers Manchester – The Launch

In the basement of a cool bar on the edge of Manchester’s Northern Quarter, the latest chapter of  HacksHackers was born on Wednesday night. My co-organiser, Rob Carroll, and I were amazed with the turnout – a real range of talent and interests.


HacksHackers Mcr brings together Hacks (the journalists) and Hackers (the developers) to find inspiration for rethinking media and information. We also had designers at our first meet-up which completed the magic triangle.

Thanks to the longstanding HacksHackers chapter in Helsinki for giving us a wave!


Launch photo edit Launch photo 2 edit

What I loved most about the meet-up was listening to the general buzz you get when a group of creative technologists get together. It’s just exciting to hear about so many projects taking shape on our doorstep and seeing how people make new connections.

So what’s next for HacksHackersMcr?

So the launch was great but where do we take things from here? Each chapter of HacksHackers around the world is different; there’s no set formula. So Manchester will take on its own personality and we were keen to find out what the attendees wanted to get out of it. A few ideas came up on our hi-tech A3-paper-and-pen user interface.

  • It’s important to have plenty of time to mingle. This seemed to be most people’s favourite aspect of the meet-up
  • A few lightning talks/guest speakers e.g. designing for digital journalism, exploring specific journalism tech challenges
  • Hands-on events/challenges e.g. civic engagement/democracy ahead of 2015 general election. What tools could Hacks and Hackers come up with?

So Rob and I are getting our heads together to plan our next meet-up. If you have suggestions, do let us know. Who should we invite to talk to us?

And if you’re curious about the direction of digital media/journalism/communications, then I highly recommend visiting our meet-up page and coming along to our next gathering. Or follow us on Twitter.

Manchester – a Data Journalism hub?

I wrote a guest blog post for Open Data Manchester looking ahead to the Data Journalism event they’re holding on Tuesday 23rd September at MMU’s trendy new digital innovations space, The Shed.  Here it is….

Photo by Yan Arief Purwanto on Flickr (CC BY-SA 2.0)

Photo by Yan Arief Purwanto on Flickr (CC BY-SA 2.0)

Journalists don’t do maths.

It’s a sad cliche but there’s a lot of truth in it. Journalism is traditionally considered a “humanities subject.” In fact, I’m convinced a lot of people go into journalism precisely because they think it means never having to do maths ever again.

But increasingly journalism is becoming a numbers game. It’s no longer just about searching for scarce information; journalists need the skills to filter and analyse the over-abundance of data that’s out there. Other industries are already using Big Data and journalism can’t afford to miss out on this vast source of stories and hard evidence.

We’re very lucky here in Manchester. We already have journalists doing great things with data which we’ll hear more about at ODM’s next event on 23rd September. Some of you may have met Data Journalists and wondered how they got to be that way. I’m guessing most of them didn’t learn how to do it at journalism school. They’re probably self-taught enthusiasts who saw the way newsrooms needed to move and made sure they acquired the necessary skills.

So that’s why I approached ODM to see if they could help bring together the worlds of data and journalism here in Manchester. I believe our city has the potential to become an important hub for developing the next generation of journalists who will be numerate and digitally literate as well as having all the core journalism skills we still need. We already have the building blocks – ODM itself, a sizable tech industry, no shortage of journalists and hundreds of journalism students who want to acquire skills that will make them employable after they leave university. The challenge is to get these elements working together, learn from the experts already working in our midst and make sure that filters through to the classrooms where journalists learn their skills.

It may also mean encouraging people who really like numbers to consider a career in journalism.

So with all this in mind, we’re launching a Manchester chapter of the global movement, HacksHackers which is all about creating networks of journalists (the hacks) and technologists (the hackers) who together can “rethink the future of news and information.” Manchester seems the perfect city to do this! We’ll be organising informal events ( including hack days) that bring together our city’s journalists, developers and designers. We’ll be announcing details of our first meet-up very soon so look out for #HHMcr and if you’d like to keep in the loop, do leave a message in the comments here.

Join the ODM community for an open data journalism special on 23rd September.

How International is the Tour de France? A Data Journalism project.

Which countries have riders in this year’s Tour de France?

TdF Map 2014 ridersThis is one of the first visualisations I’ve produced with the Tour de France data I’ve been working on. It shows very clearly how international the race is these days but there are still large swathes of the world which are not represented. I expect far more African riders (check out Team Africa Rising in Rwanda) to hit the Champs-Élysées in the very near future and that will be really exciting for cycling. And for my map….

TdF Brit Riders chart

The maps and charts I’ve produced so far have been very straightforward but I want to experiment with timelines in the next week or so. I’m also hoping to play around with Tableau Public which is now available for Mac. As I’ve written in a previous blog post, finding accurate Tour de France data was far more challenging and time-consuming than I thought so I’m a bit behind with this project.

TdF French riders

If you’d like to follow my progress – and see how international the Tour de France is – then you can follow my Tumblr blog or my Pinterest board. My most recent pins are in the sidebar.

There are lots more questions I’d like to answer. For example:-

  • Is the peloton becoming more English-speaking? I need to produce a line chart showing Francophone countries and Anglophone countries taking part.
  • Europe dominates the Tour numerically. But how do the other continents compare?
  • Which countries have most riders/capita? I’m pretty sure Luxembourg punches above its weight at the Tour!
  • I’d like to produce a timeline or something similar to show which countries first entered the Tour in which year. For example, I was surprised to see that Japan had a rider in the Tour in 1926 – Kisso Kawamuro – long before Great Britain did.

If you have any other ideas for questions I could try to answer with this data, please let me know.


I’ve just noticed that when I save my Google map visualisations, the .png file shows no result for Great Britain as if there were no riders from GB. It’s fine in the actual Google spreadsheet chart. So I’ve had to take screenshots instead of uploading. Annoying. Anybody else had this problem?