Semrush AI Visibility Index

As search shifts from ranked links to AI-generated answers, brands face a new and critical challenge: are AI models mentioning them at all?

To answer this, Semrush set out to establish the category’s first definitive yardstick. Tracking brand prominence across large language models meant solving an unprecedented constraint from day one: the platform had to be completely transparent to the very AI scrapers it was measuring.

What began as a product definition exercise evolved into a core engine of Semrush’s marketing infrastructure.

Tracking brand prominence across large language models meant solving an unprecedented constraint from day one: the platform had to be completely transparent to the very AI scrapers it was measuring.

What began as a product definition exercise evolved into a core engine of Semrush’s marketing infrastructure.

Redefining web architecture for the AI era

The rise of AI answer engines has upended technical assumptions that have shaped web development for over a decade. For years, teams relied on client-side React, knowing Google’s crawlers easily rendered JavaScript. However, LLM scrapers behind ChatGPT, Claude and Perplexity parse raw HTML instantly without waiting to execute complex client-side scripts.

This creates a massive blind spot. A site can rank perfectly on legacy search engines while remaining completely invisible to AI models — a gap most digital teams have yet to notice. For a platform tracking AI visibility, falling into this gap was not an option.

We chose Next.js, leveraging server-side rendering and static site generation. By ensuring all data arrived fully formed in the raw HTML, we guaranteed absolute discoverability for AI crawlers.

This focus on data integrity extended to the frontend. Using Apache ECharts, we developed interactive visualisations designed to convey clear narrative trends without obscuring the underlying metrics. Because data analysts require raw information rather than just summaries, we designed an integrated CSV export for every chart. The interface functions as both an intuitive visual story and an open, operational dataset.

AI Visibility Index landing page hero with the Semrush logo, headline copy and report introduction.

A report built to be read

The Index introduced the AI Visibility Index with server-rendered content, giving people and AI crawlers the same fully formed story.

Laptop showing an AI Visibility Index page on a wooden table.

Architecture before animation

We avoided a faster client-side shortcut and built with SSR and static generation, so the report could be indexed, cited and trusted.

AI Visibility Index download page inviting visitors to access the full study.

A report that also converts

The download journey connected the editorial story to lead capture and analytics, turning interest in the data into a measurable marketing path.

Detail from the AI Visibility Index interface with a circular star mark on a dark background.

Evidence beneath the visuals

Interactive charts kept the story clean on the surface while source data stayed available underneath, including CSV export for anyone who needed to inspect it.

Semrush website header with brand messaging and navigation.

Connected to the wider platform

A dedicated API let Semrush reuse live chart data on its main site without forcing two separate frontend systems together.

Translating raw data into strategic UX

We took ownership of the platform’s interaction model and product design, translating complex data structures into clean, intuitive user journeys anchored in cognitive clarity.

Replacing rotating cards with a structured grid layout resolved readability barriers, reducing the cognitive load required to parse dense and comparative brand metrics. Page hero sections utilised dynamic, animated search prompts to mimic real-time AI engine behaviours, contextualising the platform’s core purpose for new users. Aligning the chart experience with Semrush’s existing visual language ensured the new product felt instantly authoritative and native to their ecosystem.

Operationalising authority at scale

What originated as a standalone report has matured into a business-critical publishing system. To embed these insights into Semrush’s core footprint, we built a dedicated API endpoint exposing live index data directly to the flagship semrush.com homepage. This decoupled architecture safely shared a unified data feed while keeping both codebases independent.

As Semrush expanded pipelines to track complex, multi-model metrics, we refactored the application’s core data logic to handle this increased scale. Concurrently, when Semrush rolled out an enterprise-wide rebrand, we integrated the new visual identity across the report platform, ensuring brand directives actively drove every interactive layout decision.

To future-proof editorial velocity, we shifted the site architecture from hand-built static routes to a dynamic, JSON-driven content framework. This optimisation directly unlocked business agility: the editorial team can now launch deeply detailed, multi-model reports instantly to match the market pace, entirely eliminating ongoing technical overhead.

Impact

Through this partnership, Semrush established definitive market authority in an emerging category. By operationalising that authority through a highly scalable, decoupled platform, Semrush continuously dictates the industry conversation around AI search dynamics, providing businesses with the empirical data needed to navigate the future of digital visibility.

( 01 ) Overview

THE DEFINITIVE ANALYSIS OF AI VISIBILITY

See the patterns. Spot the gaps. And learn how to lead.
Get new results every month.

Users who search with LLMs are 4.4x more likely to convert than those using search engines.

AI-generated results are projected to overtake organic search traffic by 2028.

Every day, ChatGPT receives 2.5 billion prompts from over 190 million users.

More case studies

typographydesigncreative

Colophon Foundry Typography E-Commerce

How Made by ON built the Colophon Foundry e-commerce platform — from startup type foundry to Monotype acquisition. Typography and web development case study.

View case study

cryptofintechapp

Token.com: Crypto Investment Platform Design

How Made by ON designed Token.com's crypto investment platform — making it simple for beginners to invest through education, guides, and community features.

View case study

insurancedigitalUAE
HAYAH: Digital Insurance Platform for the UAE

HAYAH: Digital Insurance Platform for the UAE

How Made by ON designed the UAE's first fully digital life insurance platform for HAYAH — buy a policy in under 2 minutes. Fintech product design case study.

View case study

technologyinnovationplatform

Air.inc Website Redesign

Made by ON redesigned Air.inc's website to match the sophistication of their creative ops platform — simplifying workflows for creative teams. Website design case study.

View case study

marketingplatforms

Libeo: Cloud Payments Website Migration

Made by ON migrated Libeo's payments platform from WordPress to Storyblok — delivering a faster, more dynamic site for SME invoice management.

View case study

designstudioportfolio

Koto Studio Portfolio Website

How Made by ON built a new portfolio website for Koto, the global branding studio with offices in Berlin, London, LA and New York. Web development case study.

View case study

technologyinnovationplatform
OurCo Community App Redesign

OurCo Community App Redesign

Made by ON transformed the OurCo community engagement app — simplifying user flows and increasing participation for the New York-based civic tech platform.

View case study

technologyinnovationplatform

GF Smith E-Commerce & Digital Transformation

How Made by ON built a global e-commerce platform for GF Smith, Britain's most prestigious paper brand — supporting international growth and digital sales.

View case study

technologyinnovationplatform

OneSurvey: Property Surveying App

How Made by ON redesigned property surveying for OneSurvey, Scotland's largest independent surveyor — replacing paper workflows with a connected app.

View case study

designexhibitionCMS

London Design Biennale Website

Made by ON rebuilt the London Design Biennale website — improving event discoverability and CMS workflows for exhibitors and administrators.

View case study

marketingproductsplatforms
Loanhood: Fashion Rental App Design

Loanhood: Fashion Rental App Design

How Made by ON designed and launched the Loanhood fashion rental app — building a community of conscious fashion enthusiasts on iOS and Android.

View case study

marketing

HudsonBec Group Website Redesign

Made by ON redesigned The HudsonBec Group's website to showcase their diversity, culture, and creative approach across four specialist companies.

View case study

websitecmsinformation-architecture
Rho

Rho

Transforming a premium fintech brand with a high-performance engine built for operational autonomy.

View case study

designanniversaryyearbook

North Six Digital Yearbook

Made by ON created a digital editorial yearbook for North Six — documenting 21 years of fashion and lifestyle content creation, production, and ideas.

View case study

platformsmarketing

Unearthed by Greenpeace: Editorial Platform

Made by ON partnered with S-T to build Unearthed, Greenpeace's investigative journalism platform — an editorial design system for environmental reporting.

View case study

e-commerceretailtalent

Atelier100: IKEA & H&M E-Commerce Platform

How Made by ON built the e-commerce platform for Atelier100, IKEA and H&M's ideas factory for emerging London makers. E-commerce development case study.

View case study

designfestivalplatform

London Design Festival Digital Platform

Made by ON built the London Design Festival platform — bringing clarity to visitor navigation and sophisticated content management for 300+ annual events.

View case study

tourismcultureplatform

Bhutan Tourism Website Redesign

How Made by ON created an immersive tourism website for the kingdom of Bhutan — showcasing its culture and heritage to attract conscious travellers.

View case study

technologyinnovationplatform

EY Adventure Awaits: Immersive Careers Platform

Made by ON built Adventure Awaits for EY — an immersive virtual experience inspiring Gen Z with skills, confidence, and wellbeing resources for careers.

View case study