component-create-marketing

Marketing Component Creation Request

Please create a new marketing component following our specialized marketing patterns, conversion optimization principles, and performance standards.

🎯 MARKETING CREATION OBJECTIVES:

1. OPTIMIZE for conversion with effective messaging, clear CTAs, and persuasive design patterns
2. ENSURE SEO excellence with structured data, semantic HTML, and search optimization
3. IMPLEMENT performance optimization with efficient image loading, code splitting, and Core Web Vitals
4. PROVIDE engaging UX with animations, interactions, and responsive design
5. FOLLOW marketing best practices for accessibility, analytics integration, and A/B testing readiness

📋 MARKETING DEVELOPMENT METHODOLOGY:

STEP 1: Marketing Component Planning and Strategy

Determine Marketing Component Type and Location:

• Server Component: src/components/server/marketing/ - Static marketing content, SEO-focused
• Client Component: src/components/client/marketing/ - Interactive marketing elements, animations
• Marketing Categories:
  • Hero Sections: Primary landing area with key value proposition (hero/)
  • Feature Blocks: Product/service feature showcases (features/)
  • Call-to-Action: Conversion-focused action elements (cta/)
  • Social Proof: Testimonials, reviews, trust indicators (social-proof/)
  • Content Sections: About, benefits, how-it-works (content/)

Conversion Strategy Assessment:

• Primary Goal: Lead generation, sales, signup, engagement
• Target Audience: Demographics, pain points, motivation triggers
• Value Proposition: Unique selling points and competitive advantages
• User Journey: Awareness, consideration, decision, action stages
• Success Metrics: Conversion rate, engagement, bounce rate, scroll depth

STEP 2: Content and Messaging Design

Conversion-Focused Content Structure:

interface MarketingContent {
  /** Primary headline with benefit focus */
  headline: string
  /** Supporting subheadline with context */
  subheadline?: string
  /** Key value propositions or benefits */
  benefits: string[]
  /** Primary call-to-action */
  primaryCTA: CTAConfig
  /** Secondary call-to-action (optional) */
  secondaryCTA?: CTAConfig
  /** Social proof elements */
  socialProof?: SocialProofConfig
  /** Visual assets configuration */
  visuals?: VisualConfig
}

interface CTAConfig {
  text: string
  href?: string
  onClick?: () => void
  variant: 'primary' | 'secondary' | 'ghost'
  size: 'sm' | 'md' | 'lg'
  analytics: AnalyticsConfig
}