Hackdays aren’t just for the tech department

With a little effort you can make your hackday inclusive to more people

Sophie and Alice getting some HTML done

At Songkick we had a hackday with a theme around “discovery”. People pitched ideas at the start and formed teams. We were to think of an idea, make some things and the show the results to everyone at the end.

I’ve run a fair few hack days and workshops and one thing I’ve struggled with is getting people outside of tech involved.

I talked to my workmate Ed, who had experience with doing this before and he said at the very least getting people involved in the ideas stage and being part of a team was important.

Usually teams start by brainstorming, which we did. Next unfortunately what normally seems to happen is product/tech go off and build it while everyone else just watches.

My idea was to take what Ed said and merge it with a HTML/CSS workshop so that everyone built it not just product/tech.

The team and our idea

Our team comprised of Alex, Alice, Brandon, Chris, Scott, Sophie and myself (Ed sat with us as a lone JavaScript maverick). People not normally in the tech department.

Our idea was around Physical Web beacons at a festival, objects broadcasting URLs via Bluetooth to people’s mobile phones.

We’d be able to serve up very specific information depending on where you are in the festival. Say you’re at the main stage: here’s the line up. I’m in line at a food stall: here’s a pre-order food form.

Each person would make a website for different areas of the festival.

Physical Web illustration of pay meter, dog and some art broadcasting information to a phone.

Learning and making at the same time

Really this was a HTML/CSS workshop in disguise, at the beginning I went through the basics and showed some HTML elements/CSS. Then I showed them the resources they’d need such as references on MDN.

Each person picked a site and we all helped each other build them, I floated around helping people when they needed it.

The beauty of HTML is how forgiving it is, couple that with a live updating editor like Codepen and it’s actually a very fun environment to learn.

I think its easy to get caught up with thinking about semantic HTML or perfect usage of elements but really you can ignore that for now. Get people excited with <marquee> tags and GIFs.

The web is fun, let people have fun.

The results

Alex, Alice and Sophie made stage line-up sites, Brandon made a first aid site, Scott made a merch site and Chris made a taco pre-order site.*

For Alex, Alice and Sophie this was the first time they’d made a site.

*Tragically, Chris lost his work half-way through but I can confirm it was the best looking taco pre-order micro-site ever made. (He was the true software developer that day)

Sophie and Alice’s Codepen website, complete with emoji link easter eggs
Alex’s line up site, with some JavaScript for the first time!
…I was surprised at how rewarding and gratifying the learning process was. Normally when you are learning a completely new skill (which this was for me 100%) there’s a long period where it’s really boring you don’t see any results of your new skills for ages. Using Codepen meant you can instantaneously see that ‘outcome’… — Sophie

At the end we showed everyone the concept and then the sites we’d made, showing not only what we’d learnt but a more well rounded hack idea.

The gang demoing their sites
Brandon showing us his first aid site

Brandon said something great to me afterwards: It didn’t take much to get everyone up and running and now they have some tools to prototype ideas.

I think not only that, it gives valuable context as to what building products/services look like and where people can be involved.

We can and should be involving everyone in hackdays. If you don’t empower the people in your company you’re missing out on the massive potential they have.

If you want me to write more stuff you can like this article. You can also follow me on Twitter.

📸 Snaps by Aaron, thanks!