Hacker Application Portal
Hack the North is Canada’s biggest hackathon held annually at the University of Waterloo. Every year, over 1,000 students from different parts of the world spend 36 hours to collaboratively design and build projects of their choice.
My Roles
I worked with a graphic designer, a team of 4 developers, and an application lead to design the application portal for students to apply to the event.
Results
A working responsive application portal used by over 7000+ applicants around the world to apply for Canada's biggest hackathon.
Application Portal at a Glance
Every year, Hack the North receives thousands of applications from students around the world. Based on the statistic from previous years, we expected to receive about 8,000 applications this year. The application portal is an important platform as everyone who wishes to attend Hack the North has to submit his/her application through the portal. Having a creative application process could provide an exciting and memorable user experience for those who wanted to participate.
High-Level Planning
For 2019, we wanted to connect hackers together and promote diversity as well as a collaborative work environment. We arrived at the idea of allowing hackers to tell their stories and share them through the application process. Mapping this idea with the theme chosen by the team, we were looking to design a unique comic-themed application portal with illustrations that customized to their answers.
The application portal would consist of five different parts, including creating a robogoose, filling out personal information, logging in or creating account, answering long questions, and viewing application status.
Customize Your Goose
Since the Robogoose is the main character in the comic, the users will begin their application process by customizing the color and the accessory of their Robogoose.
If the users apply through their mobile devices, the customization process will be broken down into two steps due to the constraint from the smaller screen size. They will select the color first before clicking next to select the accessory.
The Comic Section
Once the users have customized their Robogoose, they will enter the comic creation process. In this step, the users will fill out their personal information such as their name, education information, traveling location and hackathon experience.
For the education information, the users will provide their study level and graduation year. Here, the illustration of the comic background will change to the lockers, shelves with laptops and books, the office based on the users’ response whether their study level is high school, undergraduate or graduate.
Next, the users will provide the name of the school that they are currently attending as well as their study program. If the users attend one of the seven schools that has the highest Hack the North participation rate, the illustration in this comic panel will also change to the iconic building of their school.
For the traveling location, the users will let Hack the North know from which city they will be traveling to the event. The map will zoom into the city that they enter.
Finally, the users will answer whether they have been to a hackathon before. If this will be their first Hackathon, they will get the illustration of the first time hacker badge. If they have been to other hackathons before, the illustration will change to a bunch of hardware and gears.
Account Creation
After completing the comic, the users will get to create an account or log in to an existing account, if they have applied to Hack the North before.
In a case that the users forget their password, they will have an opportunity to reset it here.
Application Questions
Finally, the users will answer questions that will enable Hack the North team to learn more about their skills and their motivation to attend the event. Since this process has a significant impact on the chance of being accepted to Hack the North, I designed the interface in a way that the user would be able to focus on answering one question at a time.
The users will be able to review the application and edit any information before submitting it.
Submission & Application Status
Once the users have submitted their application, they will be able to download their personalized comic or share it on social media. They will also be able to view the application status here.
Learning
Working on this project for Hack the North gave me valuable opportunities to practice the design thinking process, enhance my interactive design skills, work collaboratively with various groups of people, and learn about the design-development handoff.
