AsciiKit Remote MCP Server

Browser-based MCP connector that exposes AsciiKit's design intelligence tools for Claude.ai users.

What This Is

Remote MCP Server (Browser-Based):

• All 5 MCP tools available
• Full intelligence frameworks (psychology, IA, cognitive, emotional, conversion, accessibility)
• OAuth authentication with license key required
• Trial: 10 uses, Paid: Unlimited
• Same license works for CLI or Remote

VS Paid CLI:

• Remote: Manual orchestration (user prompts each tool call)
• CLI: Automatic workflows (5 slash commands that orchestrate tools)
• One CLI command replaces 15 minutes of manual prompting

Production URL

Production: https://claude.asciikit.com/mcp

How Users Connect

1. In Claude.ai: Settings → Connectors → Add Custom MCP Server
2. Server URL: https://claude.asciikit.com/mcp
3. OAuth Client ID: Your AsciiKit license key (e.g., ak_trial_... or ak_live_...)
4. OAuth Client Secret: Leave blank or use same license key
5. Click Connect - OAuth flow will validate your license

Get a license:

• Trial (10 uses, free): asciikit.com/trial
• Paid (unlimited): asciikit.com/subscribe

Available Tools

Users connected via Claude.ai can use these 5 MCP tools:

1. get_design_intelligence() - Get psychological guidance for UI context
2. render_component() - Build individual UI components
3. compose_wireframe() - Assemble components into wireframes
4. validate_wireframe() - Check 38-char width compliance
5. get_visual_language() - View available component vocabulary

Manual Orchestration Example

User must manually call tools in sequence:

1. "Use get_design_intelligence with domain: fintech, screen_type: onboarding"
2. "Now use render_component to create a header with title 'Welcome'"
3. "Render a form_field_with_label for email"
4. "Render a primary_button with label 'Get Started'"
5. "Now use compose_wireframe with these 3 components"

Paid CLI automates this:

/asciikit-quick "Design a fintech onboarding screen"

(One command, all tools orchestrated automatically)

Local Development

# Install dependencies
npm install

# Run in development mode
PORT=3001 npm run dev

# Build for production
npm run build

# Run production build
npm start

Railway Deployment

1. Connect GitHub repo to Railway
2. Create new service from packages/mcp-server-remote/
3. Environment variables: None needed (license validation via API)
4. Auto-deploys on git push to main

Endpoints

MCP Protocol:

• ALL /mcp - Main MCP endpoint (Streamable HTTP transport)
• GET /authorize - OAuth authorization endpoint
• POST /token - OAuth token endpoint

REST API (Orchestration):

• POST /mcp/orchestrate/quick - Single-screen design
• POST /mcp/orchestrate/explore - Multiple approaches
• POST /mcp/orchestrate/flow - Multi-screen journey
• POST /mcp/orchestrate/spec - Complete app spec
• POST /mcp/orchestrate/build - Technical build spec

Monitoring:

• GET /health - Health check and feature list
• GET /mcp/metrics/handlers - Handler execution metrics

Architecture

Stateless:

• New MCP server + transport created per request
• No session persistence
• Scales horizontally

Authentication:

• OAuth 2.0 with PKCE flow
• License validation via Cloudflare Workers API
• Trial licenses: 10 uses
• Paid licenses: Unlimited uses
• Same license key works for both Remote and CLI

Tools + Orchestration:

• Exposes 5 MCP tools from @currentlywebsite/asciikit-core
• Includes 5 orchestration REST endpoints for advanced use
• Workflow commands (slash commands) are CLI-only

The Product Strategy

Why Remote (Browser):

• Try the intelligence without installing anything
• Works in Claude.ai web chat
• Manual orchestration = hands-on experience
• Trial users (10 uses) can validate value

Why Paid CLI:

• Workflows encode UX methodology
• Automatic orchestration saves time
• Local = faster, private
• Production use at scale

The Value Ladder:

• Trial remote → Learn the intelligence (10 uses)
• Paid remote → Use tools manually (unlimited)
• Paid CLI → Production workflow automation

Files

• src/index.ts - Main server (893 lines, OAuth + MCP + REST)
• src/orchestration/ - 5 orchestrator implementations
• src/metrics.ts - Usage tracking
• src/types.ts - TypeScript types
• package.json - Dependencies