"Let's play a game: Programming Language or Indie Band?"

With that challenge, our friend Jon stumped us with a difficult game of discerning between obscure programming languages and even more strange, underground band names. We wanted to grow his idea beyond the scope of our lunchroom table and into an interactive web game where users could be challenged with the very same premise.


The primary reason that each of us attended this hackathon was to gain exposure to new frameworks, technologies and methods of working. Thus, discovery was the main theme that we wanted to convey with our app. Regardless of level of experience, we hope that users of our app will feel motivated to explore the technologies that we share with them. In early prototyping, we actually found it quite comical that some of the most experienced people here at the hackathon didn't perform any better at our game than newbies. In the world of CS, there's always something new to discover, and that's the attitude that we want Code x Culture to convey.

What it does

Our web app allows users to drag cards left or right if they think the randomly shuffled card presented to them is either a computer programming language or indie band. Inspired by the addictive Tinder UI of swiping, we wanted to tap in to a familiar interface to highlight the fun, topical nature of our project. Users can also click on card titles to learn more about the topics that are presented.

How we built it

Our web app was built with Javascript, HTML, and CSS. This was our first time using javascript, and we utilized the swing.js library for our swiping interface. We all had background in HTML, CSS, and graphic design, and wanted to explore more languages of front end development.

Drawing upon our experience working in a design studio, we utilized the agile work flow. We began with branding exercises to capture the emotions and characteristics we wanted to capture in our project—cheeky, surprising, educational, familiar—and then moved breaking up our objects into a project backlog, spring backlog, spring progress, and review. We were constantly focused on building a MVP that was functional, and focused on adding features and enhancements as time went on.

Challenges we ran into

Initially picking a path to take in terms of frameworks was difficult due to our lack of front-end experience. We first explored using React, but eventually happened upon a more fitting solution given our time constraint. Installing and tinkering with the swing.js library was a challenge all in itself, but thanks to Marc from Robin we were able to navigate the interface. We each got further practice with git, node, express and other workflow technologies that we previously only had minimal experience to.

Accomplishments that we're proud of

We are really proud of playing with a new language, and building a product that is fun to use and show to friends. Our team was able to work collaboratively within both design and development, and we all had a good time working across our disciplines.

What's next for Code vs. Culture

We are interested in creating different themes for the site, comparing programming languages to all sorts of topics like Renaissance painters, Shakespearean characters, poem titles, etc. We hope to use our site to expand knowledge and discovery of programming but also different art and entertainment topics. Also, having only focused on web development this weekend, we hope to be able to see this concept expand to mobile.

Built With

Share this project: