▢  our-work

New Beginnings Community Church

SEO
Web Development
Website Management
www.nbccbayarea.com
Apps used
Facebook
Figma
Finsweet
Google Analytics
Google Tag Manager
Instagram
MailChimp
Webflow
Zapier
Features
404 page
Collections
Components
CSS Grid
Custom code
Forms
Interactions
Responsive design
Responsive navigation
Responsive slider
Symbols
Web fonts
Blog
SHARE
Twitter / XFacebookPinterestRedditTelegramLinkedin

Building a Scalable Digital Home for a Growing Church Community

New Beginnings Community Church (NBCC) is a vibrant, diverse Christ-centered community located in the heart of San Francisco's Bay Area. Their mission is to help anyone who believes in God believe in church again, creating a safe, welcoming place where people from all backgrounds can explore faith, ask questions, and grow.

When NBCC approached us, they were ready for a digital transformation. Their previous Squarespace site no longer supported the scale of their content or the flexibility their team needed. With more than 60 pages, a wide variety of content types, and many different audiences, they needed a website built to last for years, be stable, organized, fast, and easy for their team to update.

Understanding the Challenge

NBCC came to us with an existing design created by another agency. Our task was to take those designs and turn them into a fully custom, scalable Webflow build that functioned across dozens of templates, layouts, and dynamic content types.

This was a large-scale project with several core challenges:

  • Migrating a large website from Squarespace to Webflow
  • Building more than 60 pages with multiple unique template types
  • Ensuring every page stayed responsive and consistent
  • Creating a structure that would support continuous updates
  • Preparing the website for long-term growth, both spiritually and digitally

NBCC needed a platform that was powerful for developers, simple for staff, and reliable for the many visitors they serve every week. That’s exactly what we built.

A Solid Foundation for a Long-Term Build

Because NBCC’s website would continue evolving for years, we approached the development with durability and organization in mind.

We used the provided Figma designs as the blueprint and implemented:

  • Consistent components across all pages
  • CMS-powered content structures for easy updates
  • Clean styling for cohesive branding
  • Responsive navigation and grid layouts
  • Custom code enhancements where needed
  • Scalable architecture to support future features

Everything was built with a focus on clarity, stability, and ease of use, from the main pages to complex interior layouts.

Modern Webflow Development at Scale

This wasn’t a typical small church website. With dozens of unique layouts and content requirements, we developed a robust Webflow system that included:

  • Reusable components for shared sections
  • Multiple page “templates” that staff can populate with new content
  • Dynamic collections for ministries, messages, events, resources, staff, and more
  • Custom forms and integrations to support community engagement
  • A responsive structure that works across every device

This approach ensures that NBCC’s team can maintain the entire site easily, with no technical experience required.

Custom Blog System With Search, Filtering & Interactive Reactions

As part of ongoing website management, we later added a powerful Blog + Resource system fully integrated into Webflow.

This included:

  • A custom CMS-powered blog
  • A dedicated blog search (separate from the main site search)
  • Filtering by author, category, and publish date
  • Clean blog templates for easy reading
  • Optimized structure for SEO and content discovery
  • Custom-coded reactions powered by GitHub/Vercel, connected directly to Webflow CMS

The reactions system gives readers a simple way to respond to content (such as “helpful,” “meaningful,” or “inspiring”), and stores these interactions through a custom GitHub/Vercel backend. This brings a lightweight, dynamic layer of engagement to each post — without requiring any third-party plugins or heavy scripts.

Together, these features allow NBCC to publish devotionals, messages, articles, and updates that are not only easy to browse and filter, but also interactive and community-driven.

SEO, Tracking & Marketing Setup

To support NBCC’s continued growth, we implemented a strong SEO and analytics foundation:

  • Clean metadata and heading hierarchy
  • Semantic HTML for better crawling
  • Optimized responsive layouts and images
  • Google Analytics & Tag Manager
  • MailChimp and social integrations
  • Zapier workflows for streamlined communication and automation

This ensures NBCC is discoverable by those searching for hope, community, and faith in the San Francisco Bay Area.

A Long-Term Partnership

We’ve worked with NBCC since 2023 and continue providing active website management and support. With frequent updates, new content, added features, and ongoing optimization, the site stays modern, stable, and aligned with their growing community.

Results

NBCC now has a website that reflects who they are - welcoming, structured, and built for growth. Their new platform is:

  • Fast, modern, and fully responsive
  • Easy for staff to update without technical help
  • Built on scalable CMS systems
  • Equipped with a robust blog, search, and filters
  • Ready to support future expansion
  • Designed to serve their community for years

The final result is a digital home that supports NBCC’s mission: helping people take their next step toward God in a place where everyone belongs.

No reviews found.
SHARE
Twitter / XFacebookPinterestRedditTelegramLinkedin
Webflow
OUR PROJECTS

More from our workshop

Malone's Taphouse

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

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

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.