Designing Meadra Bar's digital presence across two phases: before opening, and after.
TOOLS Figma
TIMELINE 2 Weeks
VISIT SITE meadra.ch
Meadra's brand identity was developed by Studio Nu, logo, color palette, typography, and I translated that identity into a working digital experience across two distinct phases: a teaser landing page before the bar opened, and a full website once it did.
Working from Studio Nu's brand guidelines, I translated Meadra's visual identity into a dynamic scrolling experience. The concept, structure, and copywriting all served one purpose: offer a glimpse into Meadra's world and build anticipation before it opened. With layered animations and a slide-style format, the design invited visitors to explore, pause, and feel a sense of arrival, without ever stepping inside.
Once Meadra opened, the digital presence had to grow with it. I transitioned the landing page into a full website that kept the same energy while prioritizing clarity: opening hours, menu, and philosophy needed to be genuinely easy to find, not buried under atmosphere. Copy ran in both German and English, since that's who actually walks through Meadra's door. Dark backgrounds, on-site photography, and generous typography carried the mood, while contrast, rhythm, and subtle motion kept the site feeling considered rather than staged, artistic enough to match the brand, approachable enough that it never felt like it was trying to impress you.
Where it stands today
meadra.ch is live today, representing Meadra as an operating bar.
- Brand Translation: Interpreted Studio Nu's brand guidelines for digital use, colors, typography, and identity, across web.
- Pre-Launch Landing Page: Built a scrolling, animated teaser experience to build anticipation before opening.
- Full Website Expansion: Evolved the teaser into a complete site prioritizing clarity, essential information, and bilingual copy.
- Tone Balance: Designed for artistic, high-quality feel without reading as expensive or unapproachable.