The Challenge
In order to produce this year's hackathon, our team needed a responsive and adaptable website to serve as a hub for hackers, company representatives, volunteers, and mentors.
My Role
I took the lead in wireframing and prototyping the website using Figma. I worked as part of a small team of other designers and developers that helped me iterate through designs and make improvements.
I also took charge of implementing a pixel-perfect version of our website design.
Among those people, Anthony Teo oversaw creative direction for this year’s version of TAMUhack, and Vivian Yu and Ricky Bengani helped iterate designs and create other promotional materials.
Since this was the first time I brought a design to code for TAMUhack, Nathan Reddy acted as a mentor in teaching me the languages and tools our organization used for development.
The Process
Our design process started with brainstorming and ideation for a visual theme. While collaborating virtually, we developed a moodboard for some direction.
Moodboard
When we finalized a new TAMUhack logo and visual theme, we began iterating wireframes for the website in Figma.
Initial wireframe
Final wireframe
After we came up with a final wireframe that we believed best represented our goal, it was time to for me to transfer the design into code.
The team tasked me with implementing the design. I first familiarized myself with the stack that has been used previously, and then got to work developing the site based on our prototype. The website was implemented using Vue.js and TailwindCSS, a CSS framework.
The Outcome
You can visit the live version of the website by clicking here!
The TAMUhack 2021 website will serve as the hub for hackers, company representatives, volunteers, and mentors throughout the event on January 30-31, 2021.