SimpleMCP Website

This is the promotional website for SimpleMCP, a desktop application that manages Model Context Protocol (MCP) servers.

Features

• Hero Section: Clear value proposition following the 6-element hero message structure
• Problem-Solution Framework: PAS (Problem-Agitation-Solution) approach
• 3-Step Onboarding: Visual guide to the SimpleMCP setup process
• Benefits & Features: Comprehensive feature breakdown with technical details
• Social Proof: Customer testimonials and trust indicators
• FAQ Section: Addresses common concerns and objections
• Responsive Design: Mobile-first approach with Tailwind CSS
• Performance: Lightweight, fast-loading static site

Tech Stack

• HTML5: Semantic, accessible markup
• Tailwind CSS: Utility-first styling with custom design system
• Alpine.js: Lightweight JavaScript framework for interactivity
• Netlify: Static site hosting with CDN and form handling

Design System

The site uses a sophisticated design system adapted from True Frontier Apps:

• Colors: Gold primary, blue secondary, purple accent
• Typography: Montserrat (display), Nunito Sans (body)
• Effects: Glassmorphism, animated starfield background, gradient buttons
• Spacing: Golden ratio-based spacing system

Development

To run locally:

1. Clone the repository
2. Open index.html in your browser
3. For development server: python -m http.server 8000

Deployment

The site is configured for automatic deployment on Netlify:

• Build Command: None (static site)
• Publish Directory: . (root)
• Redirects: Configured for /download, /github, /docs
• Headers: Security headers for production

Content Strategy

The homepage follows a proven conversion structure:

1. Hero: 6-element message framework with clear CTA
2. Problem: Identifies MCP setup pain points
3. Solution: Positions SimpleMCP as the answer
4. Process: 3-step visual onboarding guide
5. Benefits: Quantified results and value props
6. Proof: Customer testimonials and metrics
7. Features: Complete feature breakdown
8. Risk: Cost of inaction analysis
9. Pricing: Simple, transparent (free)
10. FAQ: Objection handling
11. CTA: Final conversion opportunity

SEO & Performance

• Meta Description: Optimized for search visibility
• Semantic HTML: Proper heading hierarchy
• Performance: Optimized images, minimal dependencies
• Accessibility: ARIA labels, keyboard navigation
• Mobile: Responsive design, touch-friendly