THEME:
Hackathon
CLIENT:
Club Based
YEAR:
2024
EXPERIENCE:
Web Design
HackBMU 6.0
introduction.
HackBMU 6.0 was our university's annual 24-hour hackathon, one of the biggest student-led tech events we host every year.
While my primary role was as the Operations Head, I wanted to go beyond the usual coordination side of things. I took up the challenge of designing and leading the website's Ul/UX ensuring it not only shared event details and sponsors but also carried the energy and identity of HackBMU itself.
It was about continuing a legacy, but with a refreshed and elevated design approach something that truly felt like "HackBMU 6.0".
research & insights.
Before starting, I spent time exploring how other hackathon and tech event websites present themselves especially focusing on visual engagement and user clarity.
Here's what i gathered:
• Many hackathon sites focused heavily on function but missed the excitement and visual energy of the event.
• Key touchpoints that mattered most were: event overview, sponsors, themes, and a simple registration path.
• Since the actual registration was through Unstop, the flow needed to clearly redirect users there without confusion.
• Visual consistency with our event theme and sponsors' brand elements was essential to keep it professional yet student-driven.
These insights helped me strike a balance between clarity, vibrance, and flow.
design direction.
I started collecting references from Behance and Dribbble, focusing on layouts and micro-interactions that made event pages engaging.
Using Figma as my main design tool and Adobe Creative Cloud for generating playful Al doodles and symbols, I shaped a design that was clean yet vibrant something that reflected the creative rush of a hackathon.
Key design choices included:
• Bold typography and strong visual hierarchy for easy scanning.
• Subtle motion and illustrations to bring life to static sections.
• Sponsor grid layouts that balanced visibility and design flow.
• A clear CTA to redirect users to Unstop for quick registration.
user flow.
Even though the website was mainly informational, the flow needed to feel effortless.
User flow overview:
• Landing Page: Quick event intro + CTA to register.
• About Section: Overview, theme, and past editions.
• Sponsors Section: Recognition and visibility.
• Stats & Highlights: Numbers from previous editions.
• Redirect: Seamless transition to Unstop for registration.
final designs.
I began with low-fidelity wireframes to structure the layout and test the navigation flow.
Once the hierarchy felt right, I moved to high-fidelity designs in Figma adding visual elements, color systems, and illustration details.
I collaborated with our tech lead to ensure every element translated well into the developed version and remained responsive across devices.
testing & feedback
Before the final launch, I shared the prototype with a few teammates and previous hackathon participants to gather feedback.
The insights helped me refine a few things:
• Improved visual clarity of sponsor logos.
• Added quick navigation to registration and schedule details.
• Adjusted text contrast for better readability in darker modes.
reflection & next steps.
Being part of HackBMU 6.0 was more than just a design project it was about creating a digital identity for an event I had already worked so closely with operationally.
It taught me how even a small detail, like an icon or CTA placement, can shape user engagement and excitement.
For future editions, I'd love to build an interactive registration dashboard within the website itself, to make the process even more intuitive and self-contained.
key takeaway.
Design isn't just about what's seen it's about how people feel when they interact with it.
For me, HackBMU 6.0 was proof that design can make an event experience come alive even before it begins.
