import * as React from "react"; import { CalendarHeart, Inbox, MailCheck, Sparkles } from "lucide-react"; import { EmptyStateStoryDrivenMarketingCampaignTwo } from "@/registry/empty-state-story-driven-marketing-campaign-two/empty-state-story-driven-marketing-campaign-two"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; type ComponentProps = React.ComponentPropsWithoutRef< typeof EmptyStateStoryDrivenMarketingCampaignTwo >; const templates: ComponentProps["templates"] = [ { id: "welcome-journey", label: "Welcome journey", description: "High-touch storytelling sequence that blends product education, founder moments, and success path CTAs.", cards: [ { id: "founder-note", title: "Founder welcome + product teaser", description: "Day-zero message with embedded product teaser and optional referral bump.", promise: "18% lift in week-one activation", kpis: [ { id: "open-rate", label: "Avg. open rate", value: "52.3%", helper: "Benchmarked across early access cohorts over the last 90 days.", }, { id: "reply", label: "Reply sentiment", value: "+31 NPS", }, ], microCtas: [ { id: "preview", label: "Preview email", href: "https://usenextbase.com/templates/founder", }, { id: "duplicate", label: "Duplicate flow" }, ], preview: { mediaType: "video", duration: "2:18", description: "Walkthrough of the founder-led welcome story arc and personalization hooks.", highlights: [ "Dynamic hero using customer industry", "Optional video embed with auto-generated transcript", ], }, advancedToggles: [ { id: "time-windows", title: "Send window curfew", description: "Limit delivery to golden hours per timezone for higher reply intent.", }, { id: "vip", title: "VIP routing", description: "Route C-suite prospects to AE-assist follow-up within 4 hours.", }, ], }, { id: "storyboard", title: "Story-driven product storyboard", description: "Three-part narrative with social proof cards and interactive feature hotspots.", promise: "22% boost in template-to-campaign conversions", kpis: [ { id: "template-saves", label: "Template saves", value: "+47%", helper: "Users saving the template to their workspace to remix later.", }, ], microCtas: [ { id: "view", label: "View storyboard", href: "https://usenextbase.com/templates/storyboard", }, ], preview: { mediaType: "image", src: "https://images.unsplash.com/photo-1522199992905-8fd6f05f245a?auto=format&fit=crop&w=1200&q=80", highlights: [ "Persona chips for founders, marketing ops, product", "Interactive timeline with optional audio narration", ], }, }, { id: "nurture", title: "Customer nurture with journey branching", description: "Adaptive follow-up path reacting to replies, clicks, and Salesforce stages.", promise: "14% faster time-to-first-meeting", kpis: [ { id: "meetings-booked", label: "Meetings booked", value: "+36%", }, ], microCtas: [{ id: "auto-magic", label: "Enable auto-branching" }], advancedToggles: [ { id: "salesforce", title: "Salesforce journey sync", description: "Automatically pause nurtures when AE marks opportunity as engaged to avoid duplication.", }, ], }, ], }, { id: "product-launch", label: "Product launch", description: "Amplify launches with teaser mini-sites, live webinar invites, and usage-based follow-ups.", cards: [ { id: "teaser", title: "Teaser landing page sequence", description: "Countdown microsite with interactive product hotspots and waitlist capture.", promise: "3.4x click-to-waitlist ratio", kpis: [ { id: "waitlist", label: "Waitlist conversions", value: "41%", helper: "Calculated over early-access launch cohorts in the SaaS benchmark set.", }, ], microCtas: [ { id: "launchpad", label: "Launchpad checklist", href: "https://usenextbase.com/templates/launchpad", }, ], preview: { mediaType: "video", duration: "1:46", description: "Prototype fly-through highlighting personalization moments and CTA layering.", }, }, { id: "webinar", title: "Launch webinar invite + reminder", description: "Multi-touch nurture around the live announcement with calendar embeds and speaker bios.", promise: "19% uplift in attendance", kpis: [ { id: "registrations", label: "Registrations", value: "+28%" }, { id: "attendance", label: "Attendance", value: "+12%" }, ], microCtas: [{ id: "calendar", label: "Add to calendar" }], advancedToggles: [ { id: "timezone", title: "Timezone segmented sends", description: "Auto-adjust schedule for APAC, EMEA, and AMER cohorts.", }, { id: "reminder", title: "Smart reminder thresholds", description: "Add SMS reminders only for registrants without product logins.", }, ], }, { id: "post-launch", title: "Post-launch case study spotlight", description: "Narrative follow-up pairing customer testimonial video and feature recap blog.", promise: "11% lift in expansion trials", kpis: [{ id: "trial", label: "Trial conversions", value: "+18%" }], microCtas: [{ id: "podcast", label: "Promote on podcast" }], }, ], }, { id: "retention", label: "Retention", description: "Lifecycle programs that highlight ROI stories and guide users to the next best action.", cards: [ { id: "renewal", title: "Renewal reinforcement", description: "Story-driven ROI recap layered with stakeholder highlights and renewal CTAs.", promise: "7-point improvement in renewal confidence", kpis: [ { id: "retained", label: "Accounts retained", value: "92%" }, { id: "advocates", label: "Advocates created", value: "+64" }, ], microCtas: [ { id: "roi", label: "Generate ROI report", href: "https://usenextbase.com/templates/roi", }, ], }, { id: "community", title: "Community activation", description: "Monthly community storytelling arc with curator interviews and live events.", promise: "24% uplift in event RSVP", kpis: [{ id: "attendance", label: "Event attendance", value: "+17%" }], microCtas: [{ id: "spotlight", label: "Nominate customer" }], advancedToggles: [ { id: "ugc", title: "UGC content sourcing", description: "Auto-pull user generated stories awaiting moderation into the next campaign draft.", }, ], }, { id: "health", title: "Product health nudges", description: "Usage tips triggered from health score dips with micro-survey follow-up.", promise: "16% reduction in at-risk accounts", kpis: [{ id: "sentiment", label: "Sentiment shift", value: "+9" }], microCtas: [{ id: "survey", label: "Launch micro-survey" }], }, ], }, ]; export function EmptyStateStoryDrivenMarketingCampaignTwoDemo() { const [alertDismissed, setAlertDismissed] = React.useState(false); return (

Campaign momentum

Templates are tuned for story-driven onboarding and retention arcs.

Tablet view converts chips into a scrollable rail, while mobile surfaces template details in a sheet.

Optimized for activation squads

setAlertDismissed(true), }, } } templates={templates} primaryCta={{ label: "Start campaign", icon: Inbox, onClick: () => console.info("Start campaign"), }} secondaryCta={{ label: "Browse template library", icon: MailCheck, variant: "ghost", href: "https://usenextbase.com/templates", }} stickyCta={{ label: "Launch nurture now", icon: Inbox, onClick: () => console.info("Launch nurture"), }} />

); } export default EmptyStateStoryDrivenMarketingCampaignTwoDemo;

Simple