▢  our-work

Malone's Taphouse

SEO
Web Design
Web Development
Website Management
www.malones.bc.ca
Apps used
Facebook
Figma
Finsweet
Google Analytics
Google Tag Manager
Instagram
MailChimp
Tock
Webflow
Features
3D Transforms
404 page
Collections
Components
CSS Grid
Custom code
Forms
Interactions
Responsive design
Responsive navigation
Responsive slider
Symbols
Web fonts
SHARE
Twitter / XFacebookPinterestRedditTelegramLinkedin

Overview

Malone’s Taphouse is a vibrant pub in Downtown Vancouver, known for its 38 craft beers on tap, great food, and weekly events. Their previous Webflow site no longer reflected their atmosphere or brand identity, and they needed a modern, simple, and easy-to-use redesign that captured the cozy, lighthearted feel of the taphouse.

Challenges

  • Outdated design and aging components
  • Needed a more modern, earthy, and welcoming visual direction
  • Limited usability for menus, events, and bookings
  • No efficient system for managing and displaying upcoming events

What We Did

1. Fresh Design Direction in Figma

We created a new visual style that matched Malone’s personality, warm, earthy colors, strong black and white contrast, and a clean, modern layout. The goal was to translate the pub’s cozy, lively vibe into a digital experience while keeping navigation simple and intuitive.

2. Custom Webflow Development

The finished design was rebuilt entirely in Webflow with a focus on speed, clarity, and seamless usability. The new structure uses modern layouts, components, CMS collections, and fully responsive features that allow the team to easily update menus, weekly specials, and upcoming events.

Interactions were kept subtle and smooth, modern enough to feel fresh, light enough to keep the website fast.

3. A Custom CMS-Powered Events Calendar

To help Malone’s promote weekly happenings, we built a custom Webflow CMS events calendar. The team can now add or modify events through simple CMS entries, and the calendar updates automatically on the website.

This makes it easy to highlight special events, game nights, and new promotions, without needing plugins or complex workarounds.

4. Tock Reservation Integration

For a smoother booking experience, we integrated Tock, allowing guests to reserve tables directly through the website. The connection between Webflow and Tock ensures quick, reliable access to reservations without sending users through multiple steps or external pages.

5. Full SEO & Analytics Setup

To improve discoverability and performance, we implemented:

  • Proper metadata and heading structure
  • Schema markup for LocalBusiness
  • Optimized load times and responsive images
  • Clean semantic HTML
  • Improved URL architecture
  • Google Analytics & Tag Manager setup
  • MailChimp and social integrations for marketing

This created a strong SEO foundation for searches such as Downtown Vancouver pub, Vancouver craft beer, sports bar Vancouver, and more.

6. Ongoing Website Management

After launch, we continue to manage updates, new event postings, seasonal content, and overall site performance. This ensures Malone’s stays fast, up to date, and aligned with modern digital standards.

Results

The new Malone’s Taphouse website is warm, modern, and easy to navigate perfectly capturing the pub’s character. With improved responsiveness, cleaner structure, a custom events calendar, and a seamless reservation experience, the site now supports bookings, events, and day-to-day customer engagement far more effectively.

Visitors get a clearer, more inviting impression of what Malone’s offers, and the team can keep everything updated without hassle.

Martin is an awesome graphic & web designer
Really enjoyed working with him for the launch of our cocktail website. Not only he coded the website but he also took care of the photography and videography! He is super receptive with feedback and easy to work with. Totally recommend!
SHARE
Twitter / XFacebookPinterestRedditTelegramLinkedin
Webflow
OUR PROJECTS

More from our workshop

Summer Latin Cruises

SEO
Web Design
Web Development
Website Management
Figma
Finsweet
Google Analytics
Google Tag Manager
Instagram
MailChimp
Ticket Tailor
Webflow
Zapier

Take Out Shack

SEO
Web Design
Web Development
Website Management
Graphic Design
Figma
Finsweet
Google Analytics
Google Tag Manager
Instagram
MailChimp
Webflow

Vancouver Latin Fever

SEO
Web Design
Web Development
Website Management
Figma
Finsweet
Google Analytics
Google Tag Manager
Instagram
MailChimp
Ticket Tailor
Webflow
Zapier
LottieFiles

Hannah Florman

SEO
Web Development
Website Management
Finsweet
Webflow

Cask & Keg

SEO
Web Design
Web Development
Website Management
Figma
Finsweet
Google Analytics
Google Tag Manager
MailChimp
Webflow

Mango's Kitchen Bar

SEO
Web Design
Web Development
Website Management
Facebook
Figma
Finsweet
Google Analytics
Google Tag Manager
Instagram
MailChimp
Ticket Tailor
Webflow
Zapier

New Beginnings Community Church

SEO
Web Development
Website Management
Facebook
Figma
Finsweet
Google Analytics
Google Tag Manager
Instagram
MailChimp
Webflow
Zapier

Lucky's Liquor Store

SEO
Web Design
Web Development
Website Management
Figma
Finsweet
Google Analytics
Google Tag Manager
MailChimp
Webflow

Lasocare (Medistellar)

SEO
Web Design
Web Development
Figma
Webflow

Intertie

Graphic Design
Adobe After Effects
Figma
LottieFiles

CPC Advisors

SEO
Web Design
Web Development
Figma
Webflow

The Cambie Malones Group

SEO
Web Design
Web Development
Website Management
Adobe XD
Google Analytics
Google Tag Manager
Webflow

The Cambie Hostels

SEO
Web Design
Web Development
Website Management
Facebook
Figma
Google Analytics
Google Tag Manager
Instagram
Cloudbeds
Webflow

Predny SLM

Web Design
Graphic Design
Figma
Adobe Photoshop

The Cambie Bar

SEO
Web Development
Website Management
Facebook
Google Analytics
Google Tag Manager
Instagram
Finsweet
Webflow

Umbre Window Blinds

SEO
Web Design
Web Development
Website Management
Adobe XD
Webflow

Our 3-step
creation process

STEP 1

The Deep Dive
We start by getting to know you, your business, and the universe you operate in. This is where we uncover what’s working, what isn’t, and what you and your team dream of.
Web design software interface displaying a website preview titled 'Exploring the You-niverse' with a Learn More button and descriptive text below.

STEP 2

The Masterplan
Then we design a solution and build a budget that matches reality. This is where concepts evolve into blueprints and your project starts looking like something you’ll want to show off.
Digital interface showing a website draft for Mangos Kitchen Bar with menu sections and workflow diagrams, overlaid with Mailchimp, Zapier, Instagram, and another app icons.

STEP 3

Developing stuff
After the design process is completed, we start the development. During this stage, we test the solution, make any required changes, and make sure that it is working correctly.
Web design interface showing a webpage with the headline 'Everyone matters to God. Everyone matters to us.', a button labeled 'ABOUT US,' and a footer text 'You're invited!'.

Get in touch

Want to get started on a project, or just need some brainstorming? Let us know.