FamReynaBrain/projects/emi_church_inspiration_2026.md

---
Date: 2026-07-13
Tags: [emi, church-website, inspiration, design]
---

# Church Website Inspiration — for EMI International Hub redesign

## Goal
Current emmint.com = WP blog-as-homepage (posts paginated). Needs landing like modern cool churches.

## Reference Sites (researched via curl + BareBrowse attempts, heavy JS video bgs)
### 1. VOUS Church (vouschurch.com) — Miami, Judah Smith style
- **Vibe:** Editorial magazine, big serif + sans mix, editorial grid, monochrome with color accents, huge typography, negative space
- **Hero:** Full-screen video/still with huge stacked type: "VOUS" vertical, minimal nav top, location pill
- **Design cues:** Black/white, serif display (Reckless/Playfair), image as mask, sticky nav with blur, shop as equal hierarchy, locations as cards
- **Steal:** Typography scale (h1 96-120px), overlapping text on image, editorial blog grid

### 2. Transformation Church (transformationchurch.tc) — Tulsa, Michael Todd
- **Vibe:** Bold, Gen-Z, high contrast, yellow/black, Memphis shapes, collage, kinetic type
- **Hero:** Split hero: left huge "TRANSFORMATION" chunky bold, right video card with rounded 32px, yellow blob shapes
- **Cues:** Brutalist borders 2px, rounded cards 24px, yellow #FFD60A accent, marquee banners, social proof numbers big
- **Steal:** Marquee "THE MANDATE CONTINUES" scrolling, bold CTA buttons, archive grid with filters

### 3. Passion City Church (passioncitychurch.com) — Atlanta, Louie Giglio
- **Vibe:** Minimal luxury, white space, thin serif, muted earth tones, architectural, gallery-led
- **Hero:** Centered serif h1, thin rule, subtle grain, no video, breathing room
- **Cues:** Beige #F5F1EB bg, charcoal #1A1A1A text, thin lines, image aspect ratios 4:5 editorial, soft shadows
- **Steal:** Content-led, teachings as large cards 4:5, giving as story not button

### 4. Life.Church (life.church)
- **Vibe:** Product/tech, app-first, clean sans, blue primary, feature grid, open-source Bible app heritage
- **Hero:** Left-aligned massive h1, right illustration, top nav with "Locations, Watch, Give, Tools"
- **Cues:** Blue #0066FF, sans Inter/Geist, rounded 12px, system UI, features with icons
- **Steal:** Locations finder UX, app download section, tools grid (Bible, Kids), YouVersion tie-in minimal

### 5. Elevation Church (elevationchurch.org) — Steven Furtick
- **Vibe:** Dark mode premium, video hero with gradient mesh, orange #FF6B35 accent, cinematic
- **Hero:** Full bleed video with gradient overlay, bottom-aligned huge type, play button, sticky player
- **Cues:** Dark #0A0A0A, orange accent, glassmorphism nav, sermon player persistent, giving bar
- **Steal:** Dark mode + light toggle, sermon-first IA, eFam community

### 6. Hillsong (hillsong.com)
- **Vibe:** Global, map-first, network, editorial, black/white, locations as filterable grid
- **Hero:** Map + "Find a location near you", global family language very close to EMI: "A global family"
- **Cues:** Location cards with city image, service times, language tags, map markers
- **Steal:** Global locations directory UX = exactly what EMI needs for subdomain per rep

### 7. Mosaic (mosaic.org) — LA
- **Vibe:** Artsy, architectural, huge whitespace, brutalist nav, image-led sermons
- **Cues:** Image as background, type as overlay with blend, no borders

## Patterns to steal for EMI
1. **Hero = Big editorial type + subtle motion** — Not generic gradient boxes. Think VOUS bold serif "FAMILY" 120px + small sans subtitle, image masked in O shape
2. **Global map = Hillsong-style** — Not pins on ugly map. Clean list + large cards with city image, service times, subdomain link, language
3. **Subdomain per rep = Location cards** — Each card is not flat box: city image (portrait 4:5), flag, leader avatar, service times, CTA "Visit site →" to subdomain
4. **Vision = Editorial split** — Left sticky text "A Family in the Kingdom", right scrolling stories/images parallax
5. **Teachings = Passion editorial grid** — 4:5 aspect, title overlay, category pill
6. **Colors:** 
   - EMI current: no system
   - Proposed: Ink #111827, Stone #F5F1EB paper, Gold #C8A951 (kingdom, not yellow), Slate muted, accent Teal #0F766E for trust
   - Dark mode version for hero, light for content — toggle
7. **Typography:**
   - Display: Reckless/Playfair Display or Instrument Serif — for "Family" word huge
   - Body: Inter / Geist — readable for ministry content multi-lang
   - Size: Hero 80-120px, section 36-48px, card 18px
8. **Interactions:** Subtle not ChatGPT: grain texture, blur nav, rounded 20-32px but not all same, image hover zoom, marquee for "THE MANDATE CONTINUES", sticky location filter

## What Fam Reyna did right (vs EMI ugly)
- Reyna Family landing: dark editorial with gradient orbs, glass cards, space, custom classes hero, gcard — felt designed
- EMI ugly: Tailwind-less inline styles, same radius, no type scale, no image, no grain, no editorial rhythm — looked like ChatGPT v0

## Next prototype directions (pick one)
A) **VOUS Editorial** — Black/white serif massive, image masking, location cards 4:5
B) **Passion Minimal** — Beige paper, thin serif, breathing whitespace, teachings as gallery
C) **Hillsong Global** — Map-first, global family directory, location finder UX for subdomains — BEST for EMI subdomain per rep requirement
D) **Elevation Dark** — Cinematic video hero, dark mode, sermon player, premium

Recommendation: **C) Hillsong Global + VOUS Editorial hybrid** — map for international family (core), editorial for vision.

## Concrete components for EMI Hub v2
- Nav: blur backdrop, logo EMI wordmark, links: Vision, Map, Directory, Teachings, Events, Give, Social App
- Hero: Full-bleed image (Chiapas gathering photo) with grain + gradient, layered type: small pill "International Hub" + h1 "A Family in the Kingdom" with "Family" in serif italic gold, sub 20px, two buttons primary black + ghost
- Marquee bar: "THE MANDATE CONTINUES • TUxtla Sep 26-Oct 4 • FLORIDA • CUBA • PANAMA • CHILE •" scrolling
- Vision split: left sticky, right 3 stories with images
- Map Directory: Left list filter (region), right large cards 4:5 with city image + subdomain badge
- Teachings: Editorial 3-col 4:5 cards
- Events: Chiapas banner image + countdown
- Footer: Global footer with language switcher EN/ES/FR/PT/AR/RU (Polylang migration note)