Here at Parallax we’re a team passionate about keeping on top of current trends, whether that’s in a work capacity or in our personal projects. We’ve found it to be extremely important to allow people to express their creativity in a place where they have all the tools they need at their disposal, as well as giving staff a well earned break from client work. Thursday 16th August marked our 20th hack day at Parallax and, to celebrate, we’ve outlined below how to do a hack day as well as what we came up with this time around.
How To Hack Day
There are a plethora of different ways to run a hack day and mostly, they’re completely dependant on your business and what you’re looking to achieve. Some companies would cringe at the thought of dedicating an entire day on what could be billable time, but we’ve found using this time to further our knowledge of how we implement certain ideas is well worth it.
As with almost anything, the key is in the planning. We’ve quickly bulleted five key things to think about when undergoing a hack day.
1. Plan ahead and book a day in your calendar months in advance. This way you can manage client expectations if your team is slightly slower to respond than usual.
2. Decide what your hack day will be. Are you looking to solve a specific problem company wide? Think about a clear brief and assign teams. Are you allowing staff to pick their own problems and teams? Make sure you set certain parameters; like a presentation of the project the day after.
3. Consider meeting the day before and brainstorm as a team. This will allow people to team up, as well as enable you to prioritise the best idea.
4. Make sure all the ideas decided are achievable within the time frame. This is important to make sure you have something tangible at the end of the day. If you think the idea might take longer, think about presenting it as a ‘proof of concept’.
5. Don’t start the hack day cold. Allow people time to work on their chosen project the evening before the day itself; maybe the last hour or so of work.
Hack Day At Parallax
We’ve found following the above usually results in a successful hackday. We tend to side towards allowing people to come up with their own ideas, as opposed to everyone following the same brief. This eliminates the competitive angle, but if you wanted to add an incentive to a winning team, we understand that this would be a brilliant way of creating a solution to a common problem while giving your staff something back.
This hack day, we tackled some fun ideas, common headaches and the fateful HipChat to Slack migration – which we will talk about in full in another blog post. For now, we asked those who took part in this year’s hack day to outline, briefly, their projects.
Prevent People Dying in a Fire – Andy Fitch
“As we have flexi-work time, we have our own system for clocking in and out at Parallax. It also manages holidays, sickness, leave and even our FIFA and Mario Kart leagues. Our Account Director Jack recently suggested a good feature in the case of fire. The system now presents clock-in and holiday data together so our fire wardens can quickly find out who is clocked in, in the case of a fire. Let’s hope we never have to use it!”
WebPageTest Slash Command For Slack – Brad Cornes
“We use our agency wide communication tools to do a variety of things, not just chat to each other. To add another string to our bow, I created a “slash command” for Slack which makes it easy to run WebPagetest tests. You can just type `/wpt [url]` to create a new test and the results are posted back to Slack when it’s finished. The tests run on a private WebPagetest instance running on Amazon EC2.”
Photoshop Basics – Emma Grandich
“I took hack day as an opportunity to further my design skills and learn a new tool. I chose Photoshop as it’s widely used for web pages by designers and thought it would help me get a more thorough understanding of the different techniques used to make certain UI elements. Before using Photoshop I had a fairly solid understanding of Sketch, so learning this tool was always going to be an interesting experiment to see the nuances between the two tools. I had a lot of fun replicating a blog page by Blume – a favourite website of mine – in Photoshop and learnt how to make basic shapes and warp them. I often find that a great way to get used to designing web pages is to copy the best; it helps to get a real understanding of spacing, font and element sizes, among other things. By emulating current UI and UX design practices, I’ve started to notice themes about what works and what’s in trend.
“I thought it was super interesting learning the processes of making – what I once thought were – complex elements and seeing them develop. I think after a day of using Photoshop I’m still a Sketch devotee (as I love the simplicity and intuitiveness of the interface) but I’m interested in carrying on my learning of the two to see the strengths and weaknesses that each hold.”
WebVR Prototype – Gareth Battensby
“I Implemented WebVR support to our in-house WebGL engine using the Oculus Go. I used progressive enhancement to detect VR headsets and enable switching to and from VR rendering seamlessly. I also decided to add support for the WebGL multi-view extension so rendering can be done in one pass instead of two.”
Cat or Dog – George Baker
“I was interested in learning neural networks and how they worked. I initially thought they were a complex tree of if statements and loops but the core part of machine learning is actually advanced mathematics. Understanding neural networks requires a lot of time and effort in order grasp more than the basic. I created a basic cat and dog image detector using a convolutional neural network and Keras. I fed 4000 images of cats and dogs into the network in order to train it and identify one or the other. It took 55 hours for the model to complete the training.”
Parallax Backlink Checker – Andre, Emir & Sam
“Parallax had no way of checking the status of backlinks from websites which were talking about and linking to the company, something we needed to keep an eye on for any search clients. So we decided to create an automated link tracker. We’ve used the experience of developer Sam Beevors to produce 3 separate scripts, which can directly crawl a website’s page status – feeding back as ‘alive or dead’, and additionally, a link status on the page.
“The functionality behind the ‘sheet’ proved difficult at times, there were some troubleshooting involved as the links sometimes weren’t crawled successfully. A change in some of the scripts brought back the status codes though and the project was a success. Sam had a great idea of developing this for a Google Chrome Extension tool, which in the future we hope to launch.”
Parallax Dev Documentation – Harry Parton
“I improved the developer documentation that we have available as the old site was annoying to make changes to and was focused more around the different versions of Expose. The new version of the site is a static site built from markdown files using VuePress which makes it much easier to update – which hopefully means it will stay up to date and will be much easier to add to in the future.”
Slack Migration & Music – James Hall
“After HipChat and Stride were discontinued, we decided to make the jump to Slack early. The login/registration of new users seemed buggy with HipChat and SSO so it made sense to move. I developed a way of porting across the emojis and notifications using the exports along with automated testing tools.
“We’ve also long had an issue with office music. We found an app called Jukebot which we’ve combined with a VM and a shared company Spotify account which seems to get us most of the way there. You can add songs to the playlist through the slack channel, then skip, shuffle and control volume using a slash command too.”
Magic Guestbook – Katie Miles & Andy Hart
“Magic Mirrors are very popular at the moment, with cool animations and an array of hand held props. We wanted to challenge this idea and create a magic mirror guest book, which allows the user to be even more interactive when taking those most important selfies as well as writing messages, hashtags and adding a couple of emojis for good measure!
“We implemented this using the new Face Detection API built in to Google Chrome. We took a live feed from a webcam and tracked Snapchat-like filters over all detected faces using a JavaScript and HTML canvas. The filters we used were simply transparent PNG images. Once we had composed an image by merging the video and canvas data together this was uploaded to a server from where the touchscreen could periodically fetch the latest image. This then allowed us to implement a touch library for drawing over the photo on the touchscreen and once again saving back to the server as a finished image. Emoji support could also have been added on the touchscreen.
“With more time, we would also have liked to show all the previously saved images which could then be viewed again or shared to social media.”
Hack The Aircon – Lawrence Dudley
“Much like probably any other office, we have something known as “Aircon Wars” whereby different people like different temperatures and you inevitably end up with some people shivering and others sweating.
“To make things worse, we’re in a 200-year old building and I have a feeling the air conditioning was installed in about 1920 so it has a habit of blowing both hot and cold in different parts of the room.
“I initially took one of the units apart as some of the Mitsubishi units seem to have a serial port embedded inside them that you can hijack to control the units but unfortunately ours are too old so there was no serial port. I’d chalk this one up as a failure but I did find a jumper that let you set all of the units to use the same thermostat so at least now they all blow hot or cold at the same time.”
Hack Day Success?
We’d say about an 8/10 this time around!
If you’re interested in any of the technologies or services we’ve talked about, don’t hesitate to get in touch. As you can see, we’re always up for a challenge!
https://parall.ax/blog/view/3272/hackday-keeping-people-engaged