Skip to content

🗺️ AI Service Mapper

Live at: aguidetocloud.com/ai-mapper/ Built: April 2026 Cost: $0 — 100% client-side JavaScript, zero API calls Accent colour: Electric blue #3B82F6

What It Does

An interactive AI services comparison tool that helps IT pros, admins, and decision-makers find the right AI service for their use case — across all major cloud providers and AI platforms. Think of it as the "PCPartPicker for AI services" — filter, compare, and decide.

Core Features (6 Tabs)

Tab What it does
🗺️ Explore Filterable card grid with 25 services, scenario quick-starts, card→modal detail view, heatmap toggle
⚖️ Compare Side-by-side table for 2-4 services, 5 presets (Big 3 LLMs, Agent Builders, etc.), copy as markdown, shareable URLs
🧭 Which AI? 7-question quiz → top 3 recommendations with reasoning text explaining WHY each was recommended
💰 Pricing Sortable pricing table + cost estimator (messages/day → monthly cost per service)
📚 Glossary 20 AI terms in plain English, searchable
📋 What Changed Changelog tracking service additions, pricing updates, and feature changes

Key UX Features

  • Scenario quick-start buttons — "🏢 Enterprise AI", "💻 Coding", "🎨 Images", "🆓 Free only", "🤖 Agents", "🎙️ Voice", "📄 Documents"
  • Card detail modal — click any service → full info panel with capabilities bars, pricing, compliance, alternatives
  • ⭐ Favourites — star services → shortlist bar with localStorage persistence
  • Filter counts — each filter shows (N) count
  • Capability heatmap — toggle Cards/Heatmap view for at-a-glance comparison
  • Status badges — GA / Preview / Deprecated on every card
  • Last-updated dates — ✓ 2026-04-11 on every card for trust
  • "Similar Services" — modal shows alternatives from compare_with data
  • 27 individual SEO pages — /ai-mapper/azure-openai/ etc. with Product schema

Architecture Overview

┌─────────────────────────────────────────────────────────────────┐
│                 100% Client-Side (No API Calls)                  │
├─────────────────────────────────────────────────────────────────┤
│                                                                  │
│  ┌──────────────┐    ┌──────────────┐    ┌──────────────┐       │
│  │   TOML Data  │    │  Hugo Build  │    │  Browser JS  │       │
│  │  (services,  │───▶│  (generates  │───▶│  (filtering, │       │
│  │   features,  │    │   HTML +     │    │   compare,   │       │
│  │   quiz,      │    │   injects    │    │   quiz,      │       │
│  │   changelog) │    │   data)      │    │   modal,     │       │
│  │              │    │              │    │   favourites, │       │
│  │              │    │              │    │   heatmap,    │       │
│  │              │    │              │    │   cost est.)  │       │
│  └──────────────┘    └──────────────┘    └──────────────┘       │
│                                                                  │
│  Data Layer              Build Layer           Runtime Layer      │
│  data/ai-mapper/         layouts/ai-mapper/    static/js/        │
│  ├── services.toml       ├── list.html         └── ai-mapper.js │
│  ├── categories.toml     └── single.html       static/css/       │
│  ├── quiz.toml                                 └── ai-mapper.css│
│  └── changelog.toml                                             │
│                                                                  │
├─────────────────────────────────────────────────────────────────┤
│  Content:                                                        │
│  content/ai-mapper/_index.md          (section / dashboard)      │
│  content/ai-mapper/{service-slug}.md  (27 individual pages)      │
└─────────────────────────────────────────────────────────────────┘

Data Model

Service Entry (services.toml) — 25 services

Each service has: identity (name, provider, category, tags, description, URLs), pricing (model, free_tier, price_input/output, price_note), capabilities (text/code/image/audio/video/reasoning rated 1-5, context_window, multimodal, fine_tuning, function_calling), enterprise (data_residency, regions, soc2, hipaa, gdpr, private_networking, sla), integration (m365, azure, aws, gcp), use_cases, best_for, compare_with, status (ga/preview/deprecated), last_updated.

Services by Provider

Provider Count Services
Microsoft 7 Azure OpenAI, AI Foundry, Copilot Studio, GitHub Copilot, AI Search, Document Intelligence, AI Speech
OpenAI 2 OpenAI API, ChatGPT
Google 4 Vertex AI, Gemini API, Gemini (consumer), NotebookLM
Amazon 3 Bedrock, Amazon Q, Textract
Anthropic 2 Claude API, Claude.ai
Meta 1 Llama (open source)
Mistral 1 Mistral API
Others 5 Perplexity, Midjourney, ElevenLabs, Runway, DeepSeek, Hugging Face, Cohere

Categories (categories.toml) — 9 categories

🧠 LLM Platforms, 🎨 Image Generation, 🎙️ Voice & Audio, 🤖 Agent Platforms, 🔍 Search & Knowledge, 💻 Code & Development, 📄 Document Processing, 🎬 Video Generation, 📊 Data & Analytics

Quiz (quiz.toml) — 7 questions

Primary need → Cloud provider → Budget → Compliance → Technical level → Ecosystem → Data location. Scoring engine maps answers to service attributes with weighted scoring.

The 16 Features (v2)

# Feature Implementation
1 Scenario quick-starts 7 buttons above grid, each sets filter state via SCENARIOS map
2 Card detail modal Full overlay with caps bars, pricing, features, alternatives, links
3 Quiz reasoning scoreService() returns { score, reasons[] }, displayed as green ✅ tags
4 Alternatives compare_with IDs rendered as clickable cards in modal
5 Favourites localStorage aimap_favourites, star button on cards, shortlist bar at top
6 Filter counts (N) appended to each provider/category filter label
7 Heatmap view Toggle cards↔heatmap, colour-coded table (.hm-high/med/low/none)
8 Last-updated dates last_updated field in TOML, shown on cards and modal
9 Comparison presets 5 buttons in Compare tab, maps to PRESETS config
10 Status badges status field (ga/preview/deprecated), CSS badges on cards
11 Ecosystem map Integration flags shown in modal features section
12 What Changed tab changelog.toml with date/type/text entries
13 Cost estimator Messages/day × tokens → calculates monthly cost per service
14 Glossary 20 terms hardcoded in JS, searchable, ID-anchored for cross-linking
15 Copy as Markdown Compare table → clipboard as markdown table
16 SEO pages single.html template, 27 pages, Product schema

Maintenance

Adding a new service

  1. Add entry to data/ai-mapper/services.toml with all fields
  2. Create content/ai-mapper/{slug}.md with title+description front matter
  3. Add entry to data/ai-mapper/changelog.toml
  4. Build & deploy — card + SEO page appear automatically

Updating pricing/capabilities

  1. Edit fields in services.toml, update last_updated date
  2. Add changelog entry
  3. Build & deploy

What Makes This Different

Dimension Existing tools AI Service Mapper
Audience Developers, ML engineers IT pros, admins, decision-makers
Language Technical jargon, benchmarks Plain English, analogies
Scope LLMs only Full landscape (LLMs + images + voice + agents + search + docs + video)
Decision support Raw data only Quiz with reasoning + scenario quick-starts
Enterprise focus Minimal Compliance, data residency, SLA, integration matrix
Persistence None Favourites, URL state, shareable comparisons
Cost Some need login/keys 100% free, zero API calls