What’s Hackweek Again?
Here at Chartbeat, we have a Hackweek every 7 weeks. Hackweek is a time to learn, explore, and just try something new. At the end of October, we had Hackweek 31 (that’s 31 x 7 = 7 months of hacking over 4 years). Lately we’ve been doing team hacks, which are 3 or more people doing a project together. This is a short writeup of just 4 of the projects that got done during our last Hackweek.

Team Gibson (Paul, Matt O, Anastasis)

Here’s a little known fact about AWS Redshift: it was previously known as the “Gibson” project at the Ellingson Mineral Company before that whole Hack the Planet / DaVinci virus scandal drove the company into the ground in 1995. Amazon acquired rights to the project in subsequent years and turned it into the data warehouse we know and love. To the disappointment of programmers everywhere, the product managers at Amazon decided somewhere along the way it would cut costs and ease adoption to remove the original graphical interface to the database and replace it with the Postgres-compatable one we have today.

Okay, not really. The Gibson was the supercomputer featured in the 1995 teen sci-fi thriller, and now cult-classic, Hackers. The movie energetically explored and sensationalized the early Hacker subculture and effectively inspired a whole generation of kids to become computer programmers. Myself (Paul Kiernan) and two other initiates of the hackerverse (Matt Owen and Anastasis Germanidis) came together over the past hackweek at Chartbeat to make the original Gibson interface a reality and perhaps even bring it to the Oculus Rift.

We began by investigating the Oculus Rift SDK and frameworks we could use to include an existing C++ project that emulated the Gibson interface. Unfortunately, it quickly became clear we would be unlikely to produce anything in a reasonable amount of time if we had to struggle with the lack of support for the SDK on OS X, learn how to use openframeworks, and refactor the existing project to include Redshift adapters and work generally with VR in c++. So we researched alternative platforms and settled on the widely accessible combination of WebVR and threejs.

WebVR is an experimental Javascript API that provides access to Virtual Reality devices like the Oculus Rift. Combined with threejs, a wonderful javascript framework around WebGL, we were able to create a Gibson-like interface to one of our Redshift clusters that runs entirely in the browser. The final product queries our cluster to get a list of tables and their sizes and paints them as buildings on a 3D landscape. Buildings are arranged randomly on a plane and their heights are a function of the number of rows in a table they represent.

Here you can see two videos of the gibson interface hooked up to one of our production Redshift databases (with table names obfuscated for, you know, security reasons).

2D Gibson: https://youtu.be/t5PbktJ8YBU

3D Gibson: https://youtu.be/UCUC2aIroJI

The Gibson project can be hooked up to any Redshift cluster so let us know if you’d be interested in playing around with it!

Hack the planet!

-paulynomial (Paul Kiernan)

Team Faceblocker (Dvd, Nate, Immanuel, Jess)

With all the recent uproar about ad blocking, the Faceblocker team went to work figuring out (a) how to make an ad blocking extension of our own and (b) how to replace ads with something even better! We wanted to put a little soul back into the ads… to help make advertising personal and relevant. So we decided to jack into the user’s webcam.

Faceblocker is a chrome extension that replaces ads with YOUR FACE. Unfortunately, after using it for a couple days, we started getting a little tired of staring at ourselves in 300x250s, so we cooked up a couple different options, including: Darude’s Sandstorm and this inspirational music video. Finally, we experimented with a chat-roulette style video streaming server that replaces each ad with a random feed of another user’s webcam who is also using the extension. A little creepy, but endlessly entertaining when you get enough folks using it.

– Dvd (David)

Team Mobimon (Alex, Tom, Jeremy, Mike)

Team Mobimon crafted the game Mobimon. We focused on the peer to peer aspect of the game’s original intention, which lead to a play on limited time turn based games. The stack behind Mobimon was React with redux, and Firebase. React was chosen for view management, Redux for state management, and Firebase was the crutch we relied on for pvp communication. The team, being all front end developers and a designer, decided to use Firebase because of the ease of use. We didn’t really use Firebase to persist data, but more for its websockets. We had the host player start the game and via websockets would push to Firebase which would then sync any other players with the current state and commands.

The stack was something new to all of us but through pair programming, we were all eventually able to go from crawling to running and contributing. We learned a ton, especially about redux’s strengths and its annoyances; let us not talk about the boilerplate around setting a simple http request. Overall, the game turned out awesome; in a week we not only learned about the whole new stack, a new implementation pattern, but produced something tangible with it.

– Alex

Team Confidence Interval UI (Ashley, Brian, Jenn)

Lately I’ve been interested in ‘explorable explanations’. Working with Brian Tice and Jenn Creighton from the frontend team, and Dan Valente and Josh Schwartz from the data science team, we decided to demonstrate the effect of sample size on the type of information you could reliably take from a normal distribution of data.

A good portion of the week was dedicated to first understanding the topic ourselves. The goals for the design were to use common English as much as possible, to interactively visualize the data being graphed, and present visualizations inline with their descriptions when possible.

A somewhat unexpected hurdle was using common English, as many words we use to talk about data vary in meaning from their technical definitions. Another challenge was finding an analogy that allowed us to cover the points we thought were necessary to understanding the concept.

Our solution used a narrative set in space (a standard science fiction strategy, as well as personally amusing), wherein the user imagines themselves a tailor tasked with outfitting an unknown population. Given a certain population size, interested in taking the minimum reliable number of samples, and aiming to match the current sizes in production, the user adjusts ranges setting the breadth of sizes available (translating to the range of the distribution and the target mean), as well as the sample size (creating a distribution that over time will match the target distribution.) Both ranges have small graphic representations next to them, the complete graph is displayed below, and all three adjust in real time.

– Ashley

Why Hackweek?
Some of the other projects that got done that week included “Team 404 – Death of the Shark” (a new interactive 404 page), “Team Clojure API’s” (rewrite APIs in Clojure, just for fun), “Apple TV Big Board” (a Chartbeat Big Board for Apple TV) and others. As you can see, we take our Hacking seriously. It’s an important part of our culture of learning, growth, and making great products. Come hack with us!