HALO HALO HAUS
Scoop. Sip. Halo Happiness
PROJECT OVERVIEW
Role
UI Design
Timeline
3 Weeks
Toolkit
Figma, Webflow
Halo Halo Haus is a Filipino-inspired cafe concept and responsive website that celebrates Filipino culture through a modern, brand-driven digital experience. Rooted in personal identity, the project focuses on responsive design, user experience, and visual clarity, moving from early wireframes to a refined design system in Figma and a fully responsive build in Webflow.
01. THE CHALLENGE
Challenge
Designing a Filipino-inspired cafe website that introduces halo halo to a broader audience while balancing cultural storytelling with an intuitive and responsive interface.
Approach
Develop a cohesive system through wireframing and design in Figma, then translate it into a responsive Webflow build focused on clarity, consistency, and usability.
02. RESPONSIVE WIREFRAMES
Low-fidelity wireframes showing how layout adapts across desktop, tablet, and mobile.
DESKTOP
TABLET
MOBILE
03. VISUAL IDENTITY
Visual explorations informed the final visual system, including symbolic elements, typography, and color palette.
DESIGN SYSTEM
04. FINAL UI
High-fidelity wireframes showcasing the final responsive design.
DESKTOP
TABLET
MOBILE
05. THE FINAL PRODUCT
Final mockups highlighting the responsive design across desktop, tablet, and mobile.
