salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
1ef4bb7db6cf306d482360fb7ebb0a8eb27c7c62
igny8/docs/PRE-LAUNCH/ITEM-6-MARKETING-SITE.md
IGNY8 VPS (Salman) a736bc3d34 pre-launch-final mods-docs
2025-12-11 07:20:21 +00:00

17 KiB
Raw Blame History

Item 6: Frontend Marketing Site Updates

Priority: High
Target: Production Launch
Last Updated: December 11, 2025

Overview

Update and polish the marketing website including homepage, features pages, product pages, use-case pages, pricing page, about, and contact pages. Ensure consistent branding, clear value propositions, and conversion-optimized layouts.

Current Implementation

Marketing Site Structure

Location: frontend/src/pages/ (marketing section)

Current Pages:

  • Homepage
  • Features (general)
  • Pricing
  • About
  • Contact
  • (Possibly others)

Issues:

  • Content may be outdated or generic
  • Feature descriptions don't match current capabilities
  • Pricing page needs plan updates (from Item 2)
  • No dedicated product pages for each module
  • No use-case specific pages
  • Missing social proof and testimonials
  • CTAs not optimized

Required Pages and Updates

A. Homepage

Location: frontend/src/pages/marketing/Home.tsx or similar

Current Issues

  • Value proposition unclear or generic
  • Feature highlights incomplete
  • Workflow demonstration missing
  • CTAs not prominent

Required Sections

1. Hero Section

Content:

  • Headline: "AI-Powered Content Creation for SEO-Driven Websites"
  • Subheadline: "Transform your content strategy with semantic AI. Plan, write, and publish high-quality content that ranks."
  • Primary CTA: "Start Free Trial" (14-day trial, no credit card)
  • Secondary CTA: "See How It Works" (scroll to demo video)
  • Hero Visual: Animated workflow diagram or product screenshot

Design:

  • Full-width, above fold
  • Gradient background or image
  • Logo grid: "Trusted by [companies/users]"

2. Problem Statement

Content:

  • "Content creation is time-consuming and expensive"
  • "SEO is complex and constantly changing"
  • "Scaling content while maintaining quality is hard"
  • Visual: Problem illustration

3. Solution Overview

Content:

  • "IGNY8 uses semantic AI to automate your entire content workflow"
  • 3 key benefits:
    1. Plan: AI clusters keywords into strategic topics
    2. Write: Generate SEO-optimized content in minutes
    3. Publish: Direct WordPress integration
  • Visual: 3-column benefit cards

4. Feature Highlights

Content:

  • AI Planner: Keyword extraction → Clustering → Idea generation
  • AI Writer: Content generation → Image creation → SEO optimization
  • Automation: End-to-end workflow automation
  • Analytics: Track performance and ROI

Design:

  • 4 feature cards with icons
  • Each card links to detailed feature page

5. How It Works

Content:

  • Step-by-step workflow:
    1. Add keywords or import from GSC
    2. AI clusters keywords semantically
    3. Generate content ideas for each cluster
    4. AI writes SEO-optimized articles
    5. Generate images with AI
    6. Publish to WordPress automatically

Visual:

  • Animated step diagram
  • Or short video demo (30-60 seconds)

6. Social Proof

Content:

  • User testimonials (3-4 quotes)
  • Usage statistics:
    • "10,000+ articles generated"
    • "500+ active users"
    • "95% time saved on content creation"
  • Company logos (if applicable)

Design:

  • Testimonial cards with photos
  • Stats counter animation

7. Pricing Preview

Content:

  • "Plans for every team size"
  • Show 3 plan tiers with key features
  • CTA: "View Full Pricing" → /pricing

8. Final CTA

Content:

  • "Ready to transform your content strategy?"
  • Primary CTA: "Start Free Trial"
  • Secondary CTA: "Schedule Demo"

B. Features Page

Location: frontend/src/pages/marketing/Features.tsx

Required Sections

1. Features Overview

Content:

  • List all major features with descriptions
  • Organized by category:
    • Planning & Strategy
      • Keyword Extraction
      • Semantic Clustering
      • Content Idea Generation
      • SAG Mapping (if implemented)
    • Content Creation
      • AI Writing (multiple lengths)
      • Content Structure Templates
      • SEO Optimization
      • Tone & Style Control
    • Visual Content
      • Image Prompt Generation
      • AI Image Creation
      • Image Optimization
    • Publishing & Distribution
      • WordPress Integration
      • Automated Publishing
      • Content Scheduling
    • Automation
      • End-to-end Workflow Automation
      • Batch Processing
      • Custom Workflows
    • Analytics & Insights
      • Content Performance Tracking
      • SEO Metrics
      • Credit Usage Reports

Design:

  • Accordion or tab-based navigation
  • Feature cards with icons
  • "Learn More" links to detail pages

2. Feature Comparison Table

Content:

  • Compare features across plans
  • Show which features are in which tier

Table:

Feature Free Starter Growth Pro Enterprise
Keywords 100 1,000 5,000 25,000 Unlimited
AI Clustering ✓ ✓ ✓ ✓ ✓
Content Generation ✓ ✓ ✓ ✓ ✓
Image Generation ✓ ✓ ✓ ✓ ✓
WordPress Integration ✓ ✓ ✓ ✓ ✓
Automation ✗ ✗ ✓ ✓ ✓
API Access ✗ ✗ ✓ ✓ ✓
Priority Support ✗ ✗ ✗ ✓ ✓

C. Product Pages (One per Module)

Create dedicated pages:

1. AI Planner Page

URL: /product/planner

Sections:

  • Hero: "Plan Your Content Strategy with AI"
  • Problem: Manual keyword research is slow
  • Solution: Automated clustering and idea generation
  • Features:
    • Keyword extraction from GSC
    • Semantic clustering
    • Content idea generation with outlines
    • Visual cluster mapping
  • Use cases:
    • Blog content planning
    • Topic cluster strategy
    • Content calendar creation
  • Demo video or screenshots
  • CTA: "Try Planner Free"

2. AI Writer Page

URL: /product/writer

Sections:

  • Hero: "AI-Powered Content Creation"
  • Problem: Writing is time-consuming and expensive
  • Solution: Generate SEO-optimized content in minutes
  • Features:
    • Multiple article lengths (500, 1000, 1500 words)
    • Content structure templates
    • SEO keyword integration
    • Tone and style control
  • Use cases:
    • Blog posts
    • Product descriptions
    • Landing pages
    • Guides and tutorials
  • Demo video or screenshots
  • CTA: "Start Writing with AI"

3. Automation Page

URL: /product/automation

Sections:

  • Hero: "Automate Your Entire Content Workflow"
  • Problem: Managing content at scale is complex
  • Solution: End-to-end automation from keywords to publication
  • Features:
    • 7-stage automated workflow
    • Batch processing
    • Scheduled runs
    • Progress monitoring
  • Use cases:
    • Agency content production
    • E-commerce catalog automation
    • Multi-site management
  • Demo video or screenshots
  • CTA: "Automate Your Workflow"

D. Use-Case Pages

Create industry/persona-specific pages:

1. For Agencies

URL: /use-cases/agencies

Content:

  • Hero: "Scale Content Production for Your Clients"
  • Challenges: Managing multiple clients, tight deadlines, budget constraints
  • Solution: Automate content at scale without sacrificing quality
  • Features relevant to agencies:
    • Multi-site management
    • Team collaboration
    • White-label potential (if applicable)
    • Bulk operations
  • Case study or testimonial
  • Pricing: Focus on Growth and Pro plans
  • CTA: "Book Agency Demo"

2. For E-commerce

URL: /use-cases/ecommerce

Content:

  • Hero: "Generate Product Content at Scale"
  • Challenges: Large product catalogs, SEO for products, content updates
  • Solution: Automate product descriptions, category pages, blog content
  • Features relevant to e-commerce:
    • Product description generation
    • Category landing pages
    • SEO-optimized content
    • Image generation for products
  • Case study or testimonial
  • CTA: "Start Free Trial"

3. For Content Teams

URL: /use-cases/content-teams

Content:

  • Hero: "Supercharge Your Content Team"
  • Challenges: Content velocity, consistency, SEO optimization
  • Solution: AI assists writers, not replaces them
  • Features relevant to content teams:
    • Content planning and ideation
    • Draft generation
    • SEO optimization
    • Workflow automation
  • Case study or testimonial
  • CTA: "Try Team Plan"

E. Pricing Page

Location: frontend/src/pages/marketing/Pricing.tsx

Required Updates (From Item 2)

1. Plan Tiers

Display all 5 tiers:

  • Free (hidden from public, internal only)
  • Starter ($29/mo or $299/year)
  • Growth ($99/mo or $1,019/year)
  • Pro ($299/mo or $3,077/year)
  • Enterprise (Custom pricing)

2. Monthly/Annual Toggle

  • Default: Monthly
  • Show savings badge for annual ("Save 15%")
  • Update prices dynamically on toggle

3. Plan Cards

Each card shows:

  • Plan name
  • Price (monthly or annual)
  • "Most Popular" badge (Growth plan)
  • Key features (5-7 bullets):
    • Monthly credits
    • Max keywords, clusters, content, images
    • Key features (automation, API, support)
  • CTA button:
    • Free: "Start Free"
    • Paid: "Start Trial" (14 days)
    • Enterprise: "Contact Sales"

4. Detailed Comparison Table

Show full feature comparison (expandable):

  • All features listed
  • Checkmarks or values per plan
  • Tooltips explaining features

5. Credit System Explanation

Section:

  • "How Credits Work"
  • What credits are used for
  • How they're consumed (per operation)
  • How to buy more
  • Credit rollover rules (if applicable)

Example:

Operation Credits
Keyword Clustering 10 credits
Idea Generation 15 credits
Content Generation (1000 words) 10 credits
Image Generation 5 credits per image

6. FAQ Section

Questions to answer:

  • What happens when I run out of credits?
  • Can I change plans mid-month?
  • Do unused credits roll over?
  • What's included in Enterprise?
  • Is there a free trial?
  • Can I cancel anytime?
  • What payment methods do you accept?
  • Do you offer refunds?

7. CTA Section

  • "Still have questions?"
  • CTA: "Contact Sales" or "Schedule Demo"
  • Phone number, email, or chat option

F. About Page

Location: frontend/src/pages/marketing/About.tsx

Required Sections

1. Mission Statement

  • "Our mission is to democratize AI-powered content creation..."
  • Why IGNY8 exists
  • Vision for the future

2. Team (if applicable)

  • Founder(s) photo and bio
  • Key team members
  • Company history/journey

3. Technology & Approach

  • "Built on semantic AI and NLP"
  • Explanation of SAG architecture (simplified)
  • Why our approach is different/better

4. Values

  • Quality over quantity
  • User-centric design
  • Transparency
  • Innovation

5. Contact

  • How to reach us
  • Office location (if applicable)
  • Link to Contact page

G. Contact Page

Location: frontend/src/pages/marketing/Contact.tsx

Required Elements

1. Contact Form

Fields:

  • Name (required)
  • Email (required)
  • Company (optional)
  • Message (required)
  • Subject dropdown:
    • General Inquiry
    • Sales
    • Support
    • Partnership
    • Press

2. Alternative Contact Methods

  • Email: support@igny8.com (or similar)
  • Phone: (if available)
  • Live chat: (if enabled)
  • Social media links

3. Support Resources

  • Link to Help Center / Documentation
  • Link to FAQ
  • Link to Community (if applicable)

4. Office Location (if applicable)

  • Address
  • Map embed

Design & Branding Guidelines

Visual Design

Color Scheme:

  • Primary: Brand blue/purple
  • Secondary: Accent colors
  • Neutral: Grays for text and backgrounds

Typography:

  • Headings: Bold, clear hierarchy
  • Body: Readable, 16px+ base size
  • Code/monospace: For technical content

Imagery:

  • Product screenshots
  • Workflow diagrams
  • Illustrations for concepts
  • Real user photos for testimonials

Icons:

  • Consistent icon set throughout
  • Use for feature highlights, benefits

Tone & Voice

Brand Voice:

  • Professional but approachable
  • Technical but not jargon-heavy
  • Confident but not boastful
  • Helpful and supportive

Messaging Principles:

  • Focus on benefits, not just features
  • Use clear, concise language
  • Avoid marketing fluff
  • Be specific with numbers and results
  • Address pain points directly

Call-to-Actions

Primary CTAs:

  • "Start Free Trial" (most common)
  • "Get Started Free"
  • "Try IGNY8 Free"

Secondary CTAs:

  • "Schedule Demo"
  • "Contact Sales"
  • "Learn More"
  • "View Pricing"

CTA Design:

  • Primary: Large, prominent button (brand color)
  • Secondary: Outline button or link
  • Clear contrast with background
  • Include arrow or icon for clarity

SEO Optimization

Meta Tags

Each page needs:

  • Title tag (50-60 chars)
  • Meta description (150-160 chars)
  • OG tags (for social sharing)
  • Schema markup (Organization, Product, FAQ)

Example (Homepage):

<title>IGNY8 - AI-Powered Content Creation for SEO-Driven Websites</title>
<meta name="description" content="Automate your content strategy with semantic AI. Generate SEO-optimized articles, cluster keywords, and publish to WordPress automatically.">
<meta property="og:title" content="IGNY8 - AI Content Creation Platform">
<meta property="og:description" content="Transform your content strategy with AI...">
<meta property="og:image" content="https://igny8.com/og-image.jpg">

Keyword Optimization

Target Keywords per Page:

Page Primary Keyword Secondary Keywords
Homepage AI content creation SEO automation, content strategy, semantic AI
Features AI content platform features content automation tools, SEO software
Planner AI content planning keyword clustering, topic research, content ideation
Writer AI article writer content generation, SEO writing, blog automation
Pricing AI content pricing content automation cost, SEO software pricing
Agencies AI content for agencies agency content automation, white-label content

Performance

Requirements:

  • Page load time < 3 seconds
  • Lighthouse score > 90
  • Mobile-friendly (responsive)
  • Core Web Vitals: Pass all metrics

Implementation Plan

Phase 1: Content Audit & Updates (Week 1)

  1. ✅ Audit all existing marketing pages
  2. ✅ Identify outdated or missing content
  3. ✅ Write new content for homepage
  4. ✅ Update features page content
  5. ✅ Draft about and contact pages

Phase 2: New Pages (Week 1-2)

  1. ✅ Create product pages (Planner, Writer, Automation)
  2. ✅ Create use-case pages (Agencies, E-commerce, Content Teams)
  3. ✅ Write content for each page
  4. ✅ Design page layouts

Phase 3: Pricing Page (Week 2)

  1. ✅ Implement plan comparison table
  2. ✅ Add monthly/annual toggle
  3. ✅ Add credit cost table
  4. ✅ Write FAQ section
  5. ✅ Test all CTAs

Phase 4: Design & Branding (Week 2-3)

  1. ✅ Finalize color scheme and typography
  2. ✅ Create or source imagery
  3. ✅ Design icons for features
  4. ✅ Create demo videos or screenshots
  5. ✅ Ensure mobile responsiveness

Phase 5: SEO & Performance (Week 3)

  1. ✅ Add meta tags to all pages
  2. ✅ Implement schema markup
  3. ✅ Optimize images (compression, lazy loading)
  4. ✅ Test page speed
  5. ✅ Submit sitemap to search engines

Success Metrics

  • ✅ All pages load in < 3 seconds
  • ✅ Lighthouse score > 90 for all pages
  • ✅ Mobile responsive (all pages)
  • ✅ Clear value proposition on homepage
  • ✅ Pricing page matches Item 2 specifications
  • ✅ CTAs prominent and clear
  • ✅ SEO meta tags on all pages
  • ✅ Professional, consistent design
  • ✅ User feedback: easy to understand offering

Related Files Reference

Frontend Pages

  • frontend/src/pages/marketing/Home.tsx
  • frontend/src/pages/marketing/Features.tsx
  • frontend/src/pages/marketing/Pricing.tsx
  • frontend/src/pages/marketing/About.tsx
  • frontend/src/pages/marketing/Contact.tsx
  • frontend/src/pages/marketing/product/Planner.tsx (NEW)
  • frontend/src/pages/marketing/product/Writer.tsx (NEW)
  • frontend/src/pages/marketing/product/Automation.tsx (NEW)
  • frontend/src/pages/marketing/use-cases/Agencies.tsx (NEW)
  • frontend/src/pages/marketing/use-cases/Ecommerce.tsx (NEW)
  • frontend/src/pages/marketing/use-cases/ContentTeams.tsx (NEW)

Components

  • frontend/src/components/marketing/HeroSection.tsx
  • frontend/src/components/marketing/FeatureCard.tsx
  • frontend/src/components/marketing/PricingCard.tsx
  • frontend/src/components/marketing/TestimonialCard.tsx
  • frontend/src/components/marketing/CTASection.tsx

Notes

  • Keep messaging consistent across all pages
  • Test all CTAs and forms before launch
  • Consider A/B testing headlines and CTAs
  • Update screenshots when product UI changes
  • Consider adding live chat widget
  • Plan for ongoing content updates (blog, case studies)
  • Consider multilingual support (future phase)
Reference in New Issue View Git Blame Copy Permalink