Embodying a ~changed~ organization
Founded in 2012, HackDuke was the first collegiate hackathon to focus on creating solutions for social issues through technology. Students would create projects that solve problems in four predefined tracks: Inequality, Energy & Environment, Health & Wellness, and Education. We had a mascot-- a Russian Blue cat named HackKitty-- that entertained participants on stickers and swag. We wanted to reach out to students across all disciplines, even those with no coding experience, to contribute their perspectives on these issues. In 2014 we launched "From Scratch", a week-long series of classes/crash-courses/workshops preceding the hackathon that taught students basic coding and design principles. Every year following the first, we saw amazing growth in interest for technology and what HackDuke stood for -- in 2015, we had over 3000 applicants from all around the world.
We took a step back and realized we had something incredible to work with. Duke had never been known for its prestige in Computer Science, but now there was a growing community of students who were interested in tech but did not have many resources outside of class to pursue it further. We realized that our organizing team could extend beyond just the 48-hour hackathon and actually contribute to the growth of a tech culture at Duke.
After HackDuke 2015, the leadership team met together and decided to expand HackDuke's identity as an umbrella organization and the go-to student-run tech organization on campus. Under HackDuke's umbrella, several initiatives emerged in Spring 2016: HackDuke Education brought in many veterans from the tech industry to lead talks and workshops, "IDEATE: A Design Thinking & Innovation Conference" was the first conference in product design, Catalyst was the first social/pre-professional social tech-interest group, and we partnered with a local elementary school to teach children how to code.
For HackDuke 2016, we decided we needed a rebrand to 1) embody the transformation that HackDuke had undergone, 2) better emphasize the four tracks of social good for our hackathon, and 3) refresh our look.
My first ideas were all written and sketched out in my notebook. I had defined the goals of our organization and wanted a strong, timeless brand but did not know what direction to go next. I knew that I wanted the website to be illustrative because that was my personal strength and thought this would make our website stand out. The old website was dark and used a lot of gray tones -- I wanted to make HackDuke's new brand more approachable and more versatile by using a larger variety of brighter colors.
I also ran into a few HackDuke attendees in California who expressed their love for the HackDuke cat mascot. I decided that although it had little relevance to our school or the hackathon, the cat is what people use to identify HackDuke, and it was going to stay.
First few versions = dead end
I visited other hackathon websites and loved that a lot of them had strong branding because their hackathon was associated with a theme. Camping, space travel, wilderness...
I thought out different themes HackDuke could use:
- Travel the World/Global Impact --> social good impacts the world, not just the USA or the communities we grew up in/are used to. Could incorporate illustrations of famous attractions across the world.
- Space/Stars/Moon --> expanding on the idea of "the sky's the limit". Con: Princeton's hackathon already has a space theme. Dang.
- Journey/On the Road --> 'journeys' have so many applications, also aerial views of roads is aesthetically pleasing.
- Forest/Animals? --> Kind of overused as a theme already
- Underground? Underwater? Apocalypse/Utopia/Dystopian future?
I liked Travel the World, but I realized it was a little too specific, and was confusing as branding for a 'tech' organization outside of the hackathon. I decided to go with a classic glitchy effect.
I didn't like how unrecognizable the cat was in this version, and I felt more and more cliché using glitch effects. After a while, I ended up scrapping the glitch and the need for a specific theme, and started over.
Colors, Website, and Logotype
Through several team meetings, we decided to really emphasize the tracks in our rebrand. The tracks should be very prominent in the new website. In the previous website, they were slightly hidden as a drop-down menu in the nav bar. My new approach used the tracks as the basis for the redesign. I decided that for the new site, I wanted an entire section in the home page reserved for the tracks. I also wanted the whole brand to reflect the tracks in a subtle way.
I chose a large, bright color palette that would be used for the hackathon and branding for future HackDuke events.
A bit of idea generating led to the tracks being represented by ribbons of color, much like running tracks or train tracks. I abstracted this idea into wavy bands of color and roughly sketched out a stylistic version of what I had envisioned. I then recreated it using the color palette I had chosen.
I rough-sketched out a few wireframes and versions of the HackDuke logo before playing around more with the design of the splash page before coming up with a final version.
The final logotype uses the font Biko, a bold, circular, and quirky font that reflects the way we wanted to present the rebrand. The missing horizontal bar in the 'A' was a nod to the previous branding. The body text uses Avenir Next, a very versatile and similarly rounded font that complements the logotype.