Lan’s Home Cocktail Bar
- Lan's Bar is a 3D web website designed to replicate the refined ambiance of my home bar. There exists a profound atmosphere during drinking with friends, and it is my aspiration to recreate this sentiment within the digital realm. Leveraging React technology, this project provides users with an immersive environment by 3D and the check out experience.
My Role
Designer/ Developer
Designer/ Developer
Project
Self-initiated
Self-initiated
Tool
React.js / three.js / Html / CSS / Figma / Blender
React.js / three.js / Html / CSS / Figma / Blender
Team
Yi-Chun Lan
Yi-Chun Lan
Overview
Background
Living miles away from my friends in Taiwan, I found myself missing those cozy nights when we'd gather around my home bar, sharing stories and laughter over cocktails.
Receiving messages from friends expressing their miss on my signature cocktails made me want to share my recipe and create an online experience for my friends with the warm, welcoming atmosphere.
Background
Living miles away from my friends in Taiwan, I found myself missing those cozy nights when we'd gather around my home bar, sharing stories and laughter over cocktails.
Receiving messages from friends expressing their miss on my signature cocktails made me want to share my recipe and create an online experience for my friends with the warm, welcoming atmosphere.
Project Goals:
- 1. Emulate Home Bar Experience:
- My goal is to create a digital space that feels just like my home bar – cozy, inviting, and filled with the warmth of friendship, no matter where they are in the world.
- 2. Share My Cocktail Secrets for Recreation：
- I want to share my cocktail recipes within the 3D viewing experience, allowing them to replicate their favorite drinks!
- 3. Express My Love in an Innovative Way:
- By offering users personalized digital receipts adorned with discounts and special offers, I aim to convey my appreciation for their virtual presence and my love.
Results
3D Experience:
Dynamic Receipt:
Reservation:
Reservation:
Site Map
-
![]()
Low Fidelity Prototype
- Wireframe and Programming Struture
![]()
![]()
3D Modeling & Development
![]()
![]()
![]()
![]()
Reflection
Reflecting on this journey fills me with gratitude for the opportunity to bring my vision to life and share it with those closest to me. Despite the inevitable challenges encountered along the way, the satisfaction of seeing this project evolve and become a reality has been incredibly rewarding.
As I continue to refine and enhance this website, I look forward to further enriching the experience for my friends and fellow cocktail enthusiasts, knowing that every enhancement brings us closer together in spirit, even if we're miles apart. 🧡
