HACKATHON BUILD · LEARNING THROUGH PROJECTS
BluePrint
Don’t build it for me. Help me learn how to build it.
MY CONTRIBUTION Interface design & iteration / CONTEXT RowdyHacks XII / PLATFORM Web
The build bulletin · A mission-inspired visual direction
From “what should I build?”
Technical learners have plenty of tutorials, repositories, and AI tools. The harder part can be choosing a project, knowing where to start, and following through. Our team built BluePrint to turn that uncertainty into a project with a direction.
My part in the process
I explored roughly four design iterations during the hackathon, working through wireframes and competing visual directions in Figma. The interface evolved toward a stronger identity inspired by the event’s heist theme: each project becomes a mission with a plan.
Guidance that keeps the learner involved
BluePrint connects project discovery, planning, mentorship, and progress tracking. The central design principle is to help someone understand their next step while keeping them responsible for building the project.
Discover · Find a project that fits your interests
Plan · Turn your own idea into a structured starting point
Sketching before polishing
We reconsidered the initial interface about five hours into development. The process involved sketches, visual experiments, and scope decisions under a deadline. These early artifacts show how the product’s structure and personality developed.
Early wireframes · Exploring the main project-building flow
Turning a plan into something actionable
The team built the web application with Next.js, TypeScript, and Tailwind CSS. GitHub data supports project discovery; Gemini supports planning and mentorship; ElevenLabs adds voice interaction. Project dashboards bring tasks and progress into the same experience.
Project workspace · Tasks, progress, and learning guidance
The hard parts
The team had to shape AI output so it could support the interface, coordinate changes across branches, recover from deployment problems, and choose which features belonged in the core experience. Clear communication mattered as much as the tools.
What I’m taking forward
A learning tool needs more than a fast answer. It needs a useful next step. I would keep refining the mentor’s guidance, test the onboarding and project flow with learners, and explore a wider range of projects and learning resources.
A working hackathon build
BluePrint moved beyond a static concept into a working web application. The Figma screens document the design direction; the repository and deployed demo let visitors explore the implementation. This is a hackathon-stage product, with further usability evaluation still ahead.