blog

My First Hackathon

by | Oct 15, 2013 | Design, Developer Blog | 8 comments

Berlin Geekettes Hackathon

Berlin Geekettes Hackathon – Berlin, Oct 11th, 12th, 13th


After working from “home” for the past dozen or so years, it just dawned on me. Other than what I see on my screen, I’m entirely out of touch with my fellow designers and developers! Suddenly, I had a craving for some human interaction in my professional life and decided to venture out and sign up for a few meetups and local tech events in Berlin.
A friend told me about the Berlin Geekettes, a community of women dedicated to helping aspiring and established females in the tech industry. They offer a mentorship program, they host lectures and workshops, and… an all-women hackathon? 
Perfect!
I signed up.

Berlin Geekettes Hackathon

Daisey showing custom Coke can.

A personalized souvenir.
Nice touch, Coca Cola!


The Berlin Geekettes Hackathon was held at the Coca Cola Deutschland headquarters, a massive, shiny red mosaic riverfront building. As soon as you walk in, everything is red and white with bubbles and bigger-than-life images of people drinking bigger-than-life fizzy beverages. I used to collect vintage Coca Cola memorabilia when I was a kid, so being at the Berlin HQ was like visiting my childhood Fizzy Land of Oz.
I was greeted by Jess Erickson and Denise Philipp (founder and co-founder of Berlin Geekettes) standing by the door, greeting everyone by name, including myself, a first timer. I could tell I had just stumbled into a positive group of people. I set off exploring, walked around the lounge, checked out the work area, and soaked in the creative energy of everyone fluttering around, excited about getting started.
Friday was Hackathon Prep School: an introduction from all the sponsors and how to work with their APIs. There were reps from SoundCloud, Developer Garden, Mailjet, Xing, EyeEm and Paymill. I immediately knew I wanted to work with the SoundCloud API.
I had the pleasure of talking with Tiffany Conroy (a SoundCloud developer) about my  concept, so I already had a pretty good idea of what could and couldn’t work with the their API. As the conversation progressed, new features were popping into existence, like sharing, commenting, slicing and looping. She brought me back to reality and said I should zoom in on one or two features for the demo, but much of it could be mocked and hard coded for the sake of the presentation. Good to know!
Berlin Geekettes Hackathon

Berlin Geekettes Hackathon


Saturday was the official kickoff. There were over 100 people from all corners of the world, most now living in Berlin, but also a group of girls from the Hamburg Geekettes. It was interesting hearing everyone’s stories, how they got into the industry, what career paths they chose, their specialties, their inspiration.
There were 26 ladies, myself included, who pitched ideas to hack.
We had 24 hours to build a team, explore, discover, build and develop a demo.
Annnnd… Go!

My Hack

In addition to being a UI designer, I’m also a singer/songwriter. I’ve been publishing music with my husband for several years: he produces the music and, collaboratively, we write the lyrics. He’ll hand me an mp3 and I’ll wander off with headphones and a notepad and lose myself in the music. I’ve searched for songwriting apps, and sure, there’s a few out there, but they don’t really support the natural work flow. There’s nothing more “flow breaking” than working on a verse and having to fumble with your player to back the track up to exactly 1:17 where the verse starts. Nobody’s got time for that!

The pitch…

Modern day song writers often write lyrics over beats in mp3 format. When writing lyrics you need the ability to jump around the track so you can work on separate sections, like the chorus, verse 1, outro, etc. You need the ability to jot down ideas, both as written lyrics and as recorded rough takes. The beat maker and the song writer need the ability to collaborate.
This is how songs are written.
It’s an iterative process.
SoundPad would integrate the process of listening to SoundCloud files, looping audio segments, writing lyrics, recording rough takes, sharing private files, and creating interaction between the song writer and the music producers – in one app.

The team…

Image of Daisey

Daisey
UI designer / developer


Alexandra - Java developer

Alexandra
Java developer


After my pitch, a tall, soft-spoken developer approached me and said she liked my idea. Alexandra, from St. Petersburg, Russia, is a Java programmer who came to Berlin several years ago to attend Humboldt University.
A team of two was born!
Let’s start hacking!
The other teams were roughly 4-8 people, consisting of designers, marketers, developers, etc. For whatever reason, my pitch only drew one developer, which was fine by me! I had a pretty solid idea of what I wanted to build, so I was looking for someone who knew how to plug into the SoundCloud API. However, I do think it would be a high-energy learning experience to work in a larger team. I’m curious to compare this to future hackathons.

The process…

Alexandra and I discussed ways to tap into SoundCloud’s API. Their developer docs only show how to connect via Ruby, Python, PHP or Javascript SDK’s. Alexandra is a Java developer, so we had to research and take a different route to be able to authenticate and pull data. Ultimately, she created a servlet with the Java web framework, Wicket. Then, she was able to make requests to the SoundCloud API using the Java SDK. It was a joyous high-five moment when we pulled our first song title!
I used the Foundation 4 framework which allowed me to quickly put together a template for us to use as a playground. I threw up some ideas and continued building the overall interface, complete with a slide out library, drop down widget player, color coded song parts and a scrolling timeline with jump-to points.
We sat side by side, diligently working, sharing our challenges and accomplishments along the way. We took a yoga break and stretched out on red mats in the CocaCola lounge for a  moment to unwind. We earned it! The hack was coming together and we celebrated with high fives and free CocaCola products. We still had to figure out how to merge our efforts, but we decided to save that for the next day. Alexandra packed up for the night, I continued working for a few more hours, until I decided it was time to go home and get some much needed rest.
I packed up, took a taxi and got home around 4am. For most, it wouldn’t be such a problem to have to wake up at 8am, but I live in Berlin and work California hours, so I’m very much a night owl… who had freakishly already started the day at 8am. Plus, the anticipation of the nights leading up to the hackathon: researching, exploring, discovering.
My mind was too active to sleep. But I tried.

”Finish each day before you begin the next,
and interpose a solid wall of sleep between the two.
This you cannot do without temperance.”
~ Ralph Waldo Emerson

The hack…

It was possible to pull everything we needed from SoundCloud and repurpose a few of their features. For instance, the “track” is actually a SoundCloud “playlist” and the “song parts” are songs in that playlist. That way, we could use their existing hierarchy as a way to group and label info. SoundCloud’s song “details” field can be repurposed to populate the lyrics, elegantly broken into CSS color coded song parts.
I do plan to share the app once it’s further along, but for now, here are a few screenshots.

authentication screen

authentication screen


work mode, song parts, player, notepad

work mode, song parts, player, notepad


slide out library

slide out library


drop down widget

drop down widget


 

Demo Day

The alarm went off at 8am and I felt a stiffness up my neck and horrible throb in my brain.

Oh, my poor brain. I can’t do this. I’ll just lay back down for a bit…

The phone rang. 2:30pm. It was my friend Yvonne, calling from the hackathon:
“Daisey! You overslept. You still have time. Take a taxi. Come on.”

Ughhh… It’s a migraine. I just can’t do this.

I Skyped Alexandra and explained what was happening. I missed the final hours of merging our work together and preparing the demo. She told me not to worry, she would still present the app as best as she could. And she did. I followed the @BerlinGeekettes twitter updates and heard the the whole thing streamed online. It was cool hearing everyone present their hacks. Some were funny. Some were educational. Some were non-profit ideas supporting women’s health.
But all were done in 24 hours by a group of women who love to code! 
Kudos to the Berlin Geekettes for organizing such a cool event, CocaCola for providing a colorful place for us to work, and the IT sponsors for taking the time to teach the community how to interact with your APIs. It was well worth the experience.

Would I do it again?

Oh, absolutely!

Advice to First Time Hackers?

My advice to anyone planning to attend a hackathon: make sure you get your sleep! Not just the day/night of the hackathon, but more importantly don’t rob your body of the rest it needs to prepare for that night. And by all means, don’t get a migraine. I’m not sure there was anything I could have done to prevent that, but I’m sure sleep deprivation didn’t help.

+ more

Accurate Timing

Accurate Timing

In many tasks we need to do something at given intervals of time. The most obvious ways may not give you the best results. Time? Meh. The most basic tasks that don't have what you might call CPU-scale time requirements can be handled with the usual language and...

read more