VietBamboo Restaurant Web Design



Skills:
UX/Ui Design, Branding, Responsive Web
Roles:
UX/UI Designer, Visual Designer
Tools:
Figma, Adobe Photoshop, Illustrator
Duration:
2 Months (November 2023 - December 2023)
Overview of the project:
VietBamboo, a traditional Vietnamese restaurant, has made its mark in Downtown Toronto, offering a culinary journey laced with nostalgia. The task of developing a user-friendly website that perfectly mirrors their genuine taste and vintage ambiance had been commissioned. Features that elevate this website include an immersive menu, a convenient reservation system, and a sleek interface that caters to both mobile and desktop users, flawlessly porting VietBamboo's distinctive charm into the digital realm.
Target Audience:

Project Process

Moodboard:
The moodboard captures VietBamboo’s nostalgic and cultural essence through a vintage-inspired color palette, traditional textures, and elegant typography. It reflects the restaurant’s warm and inviting ambiance, setting the visual tone for the website to align with its authentic Vietnamese identity.

Morphological Matrix:
The morphological matrix was used to explore and combine various design elements, including layouts, color schemes, and visual components. This systematic approach helped refine creative possibilities, ensuring a cohesive design that aligns with VietBamboo’s brand identity and enhances the user experience.

Brand Logo and Icon Design:
The morphological matrix was used to explore and combine various design elements, including layouts, color schemes, and visual components. This systematic approach helped refine creative possibilities, ensuring a cohesive design that aligns with VietBamboo’s brand identity and enhances the user experience.
The chosen logo design incorporates a bowl of pho, a conical hat, and bamboo—three iconic symbols of Vietnam. The curved lines of the bowl and hat are combined to create a unique and cohesive image of a "bowl wearing a conical hat." Bamboo represents the restaurant's name, VietBamboo, while also serving as a visual highlight. Additional elements, such as the red star (symbolizing Vietnam's flag) and a phin coffee filter, further emphasize the connection to Vietnamese culture, representing the nation's culinary and cultural heritage.





Wireframe:

Reflection:
This project, which combined both branding and web design, was a true challenge as it required managing two distinct aspects simultaneously. Through designing the brand logo and icons, I learned the importance of combining design elements to effectively convey and maintain the core values of the brand. Equally important was arranging these elements strategically to enhance brand recognition. For the restaurant website, UX design played a key role. I chose a grid-based layout to showcase the restaurant’s variety and implemented box containers with images and ingredient details, catering to customers with specific dietary needs. Overall, this project has significantly enhanced my skills in branding and organizing design elements.
Final Product:
Feature #1
Desktop Version
The desktop version offers a spacious, visually rich layout that highlights VietBamboo’s charm, with intuitive navigation for menu browsing and reservations.
Feature #2
Mobile Version
The mobile version is touch-friendly and streamlined, providing easy access to the menu, reservations, and key information on the go.



