How We Analyzed 1000 Artist Store Pages
The complete technical methodology behind our Billboard Top 100 artist store analysis using Firecrawl, Gemini, and Claude
Overview
Our research into musical artist store design revealed striking similarities across Billboard Top 100 artist ecommerce websites.
This post breaks down the complete technical methodology, tools, and workflows that powered our research.
Extracting Billboard Artists
To start off, we parsed Billboard Hot 100 chart data to identify the top 100 artists from 2019-2024:
// Generate weekly chart dates for 2019-2024
const dates = generateWeeklyDates(2019, 2024);
// Process 260+ weekly charts to track artist rankings
for (const date of dates) {
const chartData = await fetch(
`https://raw.githubusercontent.com/mhollingshead/billboard-hot-100/main/date/${date}.json`
);
// Track each artist's best chart position
chartData.data.forEach(entry => {
const currentBest = artistBestRanks.get(entry.artist) || 101;
if (entry.this_week < currentBest) {
artistBestRanks.set(entry.artist, entry.this_week);
}
});
}
// ...
// Omitted for brevity: date generation helpers, error handling, batch processing
URL Discovery with Gemini
For accurate store URL discovery, we used Gemini 2.5 Flash, grounded in Google Search and temperature set to 0 for deterministic results:
const ai = new GoogleGenAI({ apiKey: GEMINI_API_KEY });
const prompt = `Find the official merchandise store URL for: "${artistName}"
Look for their *official* online store where they sell merchandise.
Do NOT include streaming platforms or unofficial fan stores.
If you can't find a store URL, check the main artist website
for a "STORE" or "SHOP" link in the navigation.
Examples: store.taylorswift.com, shop.arianagrande.com`;
const response = await ai.models.generateContentStream({
model: 'gemini-2.5-flash',
config: { temperature: 0, tools: [{ googleSearch: {} }] },
contents: [{ role: 'user', parts: [{ text: prompt }] }]
});
// ...
// Omitted for brevity: CSV parsing, batch processing, error handling
Discover Page Templates
Using 🔥Firecrawl's mapUrl
endpoint, we discovered diverse page templates across each artist's store:
const mapResult = await firecrawl.mapUrl(url, {
limit: 25, // Get more pages for template diversity
includeSubdomains: false,
});
// Filter and prioritize ecommerce-relevant pages
const priorityLinks: string[] = [];
const regularLinks: string[] = [];
filteredLinks.forEach(link => {
const lowercaseLink = link.toLowerCase();
// High priority: actual store/product pages
if (
lowercaseLink.includes('/product') ||
lowercaseLink.includes('/collection') ||
lowercaseLink.includes('/shop') ||
lowercaseLink.includes('/tour') ||
lowercaseLink.includes('/merch')
) {
priorityLinks.push(link);
} else {
regularLinks.push(link);
}
});
// Return priority links first, up to 20 total
const finalLinks = [...priorityLinks, ...regularLinks].slice(0, 20);
// ...
// Omitted for brevity: authentication, error handling, URL validation
Capturing Screenshots & Extracting Data
For each discovered URL, we captured full-page screenshots and extracted structured metadata with Firecrawl Scrape:
const scrapeResult = await firecrawl.scrapeUrl(url, {
onlyMainContent: false,
formats: ['screenshot@fullPage', 'extract'],
extract: {
prompt: 'Analyze this ecommerce store page. Extract the main domain, regions/languages, currencies, and platform.',
schema: {
type: 'object',
properties: {
main_domain: {
type: 'string',
description: 'Main artist website domain'
},
regions_languages: {
type: 'array',
items: { type: 'string' },
description: 'Available regions (e.g. ["US", "UK", "DE"])'
},
currencies: {
type: 'array',
items: { type: 'string' },
description: 'Supported currencies (e.g. ["USD", "GBP"])'
},
ecommerce_platform: {
type: 'string',
description: 'Platform (Shopify, WooCommerce, etc.)'
}
},
required: ['main_domain', 'ecommerce_platform']
}
}
});
// ...
// Omitted for brevity: retry logic, rate limiting, file storage
Visual Analysis & Pattern Recognition
Used Claude Sonnet 4's vision capabilities to analyze each screenshot:
const prompt = `Analyze this ecommerce website screenshot and provide:
1. TEMPLATE TYPE: Identify what type of page this is. For example:
- Homepage (ONLY for root domain URLs)
- Product Listing Page (PLP)
- Product Details Page (PDP)
- Collection/Category Page
- Tour/Events Page
- Artist-specific page
- Other (specify)
2. SCREENSHOT DESCRIPTION: Concise description of layout and key elements
3. FEATURES LIST: All visible features, separated by semicolons:
- Navigation (Horizontal Nav, Mega Menu, Hamburger Menu)
- Commerce (Add to Cart, Size Picker, Price Display, Sale Indicators)
- Content (Hero Section, Product Grid, Newsletter Signup)
- Media (Video Player, Image Gallery, Product Images)
- Interactive (Modal/Popup, Dropdown, Filters)
Format as JSON:
{
"template_type": "...",
"screenshot_description": "...",
"features_list": "feature1; feature2; feature3"
}`;
const analysis = await anthropic.messages.create({
model: 'claude-sonnet-4-20250514',
max_tokens: 1024,
messages: [{
role: 'user',
content: [{
type: 'image',
source: { type: 'url', url: screenshotUrl }
}, {
type: 'text',
text: prompt
}]
}]
});
// ...
// Omitted for brevity: batch processing, error handling, response validation
Processing Strategy:
- Batch processing (5 screenshots per batch)
- 2-second delays between batches
- Automatic retry logic for failed analyses
- Structured JSON output for consistent data parsing
- Semaphore-based concurrency control (max 5 concurrent)
- Resume capability via processed URL tracking
Conclusion
Our analysis of 1000+ artist store pages revealed striking convergence in ecommerce design patterns across the Billboard Top 100. Despite diverse genres, fanbases, and budgets, these stores share remarkably similar templates, notably:
Product Listing Pages
3-4 column grids with horizontal navigation and sidebar filters
Product Detail Pages
Split-screen layouts with images left, purchase controls right
Homepages
Hero sections, featured products, category navigation
Tour Pages
Standardized date/venue listings with streamlined ticket flows
The data validates Jakob's Law: users spend most of their time on other sites, so they expect yours to work the same way. For platform builders, this means avoiding the temptation to reinvent ecommerce UX. Fans want to buy merch, not learn new interfaces.
Read more in our sibling article.