Designing a Welcoming Digital Front Door
A modern, community-focused website for 3Circle Church.
A short interactive overview of the 3Circle Church website.
Summary
I designed a modern, community-focused website for 3Circle Church to better connect with both new visitors and existing members. Working within an existing brand system, the goal was to create an experience that feels inviting, spiritually grounded, and easy to navigate—while elevating the church’s digital presence to match its in-person energy.
The Challenge
The existing site felt outdated, lacked a strong identity, and didn’t clearly guide new visitors toward what to do next. At the same time, the design needed to stay aligned with established brand guidelines for color and typography.
The Approach
I focused on an emotion-first experience supported by clear structure and flow. The design uses an immersive hero to create an immediate connection, bold typography within the brand system to establish hierarchy, and soft, rounded UI elements to feel approachable. Content is structured to guide users naturally from inspiration to action.
The Outcome
The final design creates a strong first impression, makes next steps clear, and delivers a more modern, cohesive experience while staying fully aligned with the existing brand.
Teachings layout that makes content easy to browse and lowers friction to start watching.
Deeper Dive ↴
Context & Constraints
The church needed a digital experience that better reflected the energy and warmth of its in-person environment. The existing site lacked clarity and direction, particularly for first-time visitors.
A key constraint was adhering to an established brand guide, including color palette and typography. The challenge was to elevate the experience without redefining the brand.
Design Principles
Emotion first
Create an immediate sense of belonging through imagery and scale
Clarity second
Guide users clearly with strong hierarchy and obvious next steps
Community throughout
Reinforce that the church is about people, not just content
Elevation within constraints
Modernize through layout, spacing, and interaction rather than new branding
Ministries with community-driven imagery to reinforce connection and helps users find where they belong.
Key Design Decisions
Hero Experience
Full-width imagery and minimal copy create emotional impact. Primary actions are surfaced immediately to reduce friction.
Typography as Structure
Scale is used within brand constraints to create clear hierarchy and guide users through the page.
Shape System
Curves and circular imagery create a consistent visual rhythm and soften the interface.
Content Accessibility
Card-based layouts and clear calls to action make content easy to explore.
Community Emphasis
Real people and layered imagery reinforce connection and belonging.
Navigation
A frosted, translucent navigation keeps the interface lightweight while maintaining usability.
Visual System
Brand colors (navy and teal) are used with stronger contrast and more intentional hierarchy. Oversized typography improves clarity, while rounded UI elements and layered imagery create a more approachable and dynamic experience.
Outcome
The final design delivers a more engaging and intuitive experience that welcomes new visitors, clarifies next steps, and strengthens the church’s digital identity—while staying fully aligned with its existing brand system.
Designed to reduce time-to-action for new visitors and increase engagement with sermons and events.
Custom branded elements for 3Circle.