--- name: revenue-heatmap-playbooks description: > Load when the user asks how to optimize nav, carousels, product tiles, FAQs, buy boxes, or UVPs with Heatmap data, or says "what should I optimize first," "how do I use my heatmap," or "what are conversion killers." --- # revenue-heatmap-playbooks ## What this skill enables This skill gives Claude the 10 specific, data-driven element optimizations from Chapter 5, each with: the book-accurate trigger signal, the decision rule, the MCP recipe to pull the required data, the expected output shape, and the specific threshold at which to act. After loading this skill, Claude can take any element-level question and return a complete analysis + recommendation backed by real data from the user's site. Source material: *Billion Dollar Websites* Chapter 5; MCP source at `heatmap-mcp` repository (commit 275e777). --- ## The Core Principle A revenue-based heatmap shows not just where users click, but how much revenue is generated by users who clicked each element. This transforms a click map (engagement data) into a revenue map (business impact data). A Conversion Killer — an element that receives significant clicks but drives zero revenue — is invisible on a click-only heatmap. It is obvious on a revenue heatmap. **Metric rules:** - **RPS** (Revenue Per Session): for comparing elements of the **same type** on the same page (e.g., nav item A vs. nav item B; image 1 vs. image 2) - **RPC** (Revenue Per Click): for comparing elements of **different types** (e.g., the search bar vs. the nav menu), and specifically for FAQs (see #8) - **RPC = `row.revenue / row.value`** from `get_raw_event_analytics` --- ## The Ten Optimizations ### 1. Mobile Navigation Sort all navigation items by RPS, highest to lowest, top-to-bottom on mobile (and left-to-right on desktop). Analyze mobile and desktop navs separately — they have different UX constraints and often different RPS profiles. **Trigger:** Nav item has high clicks (`value > 100`) but low RPS — it is attracting clicks that don't lead to purchases. That is a Conversion Killer. **MCP Recipe:** ```json // get_raw_event_analytics — mobile nav items only { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "page_url": "/", "filters": { "device": "MOBILE" }, "order_by": "VALUE", "sort_direction": "DESC", "limit": 30 } ``` Filter rows where `selector` contains nav-related CSS identifiers. Sort by `rpc = revenue / value` descending. Any element with `value > 50` and `revenue < 1.00` is a Conversion Killer candidate. **Decision threshold:** Move nav items with RPS/RPC > 2× average to the top. Move items with `revenue = 0.00` and `value > 50` to the last position or remove entirely. --- ### 2. Dropdown Menu Items Apply the same RPC sort to dropdown contents as to top-level nav. Prioritize top-line nav items first (more users see them), then optimize dropdowns within each menu. A dropdown item with near-zero RPC should be removed or renamed. **Trigger:** After optimizing top-line nav, run `get_raw_event_analytics` again with a `selector` filter targeting the specific dropdown's container. --- ### 3. Product Carousels (Image Order on PDPs) On PDPs, sort product carousel images by RPS highest-to-lowest. Use the book's wallet-brand example as the standard: Image 1 RPS = $3.21, Image 2 RPS = $0.41, Image 3 RPS = $4.24 (10-image carousel). Image 3 should be moved to position 1. Image 2 should be removed or moved to the end. **Trigger:** Carousel images have wide RPS variance (> 2× between highest and lowest). **MCP Recipe:** ```json // get_raw_event_analytics — specific PDP carousel { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "page_url": "/products/your-product-slug", "order_by": "REVENUE", "sort_direction": "DESC" } ``` Filter returned rows to selectors matching carousel image elements. Sort by `rpc = revenue / value`. Move highest RPC image to position 1. **Decision threshold:** Any image with RPC < 0.25× the highest-RPC image should be removed or moved to the last position. --- ### 4. Collections Page Product Tiles Sort product tiles by RPS (not by sales volume). Bestseller by units ≠ bestseller by revenue efficiency. The tile at position 1 sets the "shop now" intention for The Gator before any purchase happens. **Trigger:** One tile has dramatically lower RPS than peers, or tiles are currently sorted by sales volume or marketing preference. **MCP Recipe:** ```json // get_raw_event_analytics — collections page { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "page_url": "/collections/all", "order_by": "REVENUE", "sort_direction": "DESC", "limit": 50 } ``` Match each `selector` to a product tile. Sort by `rpc = revenue / value`. Reorder tiles on the page to match this sort. --- ### 5. Default State Tabs On pages with tab-based filtering (Best Sellers / New Arrivals, Men / Women, etc.), the tab with the highest RPS should be the default displayed state. "New Arrivals" as a default is a common and expensive mistake — new arrivals rarely convert as well as bestsellers because the Gator has no social proof signal. **Trigger:** The non-default tab has higher RPS than the current default state. **MCP Recipe:** ```json // get_raw_event_analytics — tab click elements { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "page_url": "/collections/womens", "order_by": "REVENUE", "sort_direction": "DESC" } ``` Identify selectors for each tab. Compare RPC per tab. The tab with the highest RPC should be the default visible state. --- ### 6. Outbound Links (Conversion Killers) Any clickable element with meaningful click volume and near-zero revenue is a Conversion Killer. Most common offenders: social media icons, blog links, recipe pages, shipping policy CTAs, share buttons. These pull the Gator off the buying journey. **Trigger:** Element has ≥ 20 clicks and $0.00 attributed revenue. **MCP Recipe:** ```json // get_raw_event_analytics — all elements, ordered by revenue ascending { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "order_by": "REVENUE", "sort_direction": "ASC", "limit": 50 } ``` The top rows (lowest revenue) with high `value` (clicks) are Conversion Killer candidates. Cross-reference with screen recordings before removing. **Action:** Remove from nav/header. If brand requires their presence, move to footer below all purchase-intent content. --- ### 7. Bucket Testing by Revenue "Buckets" are full-width content sections on a page. Reorder buckets from highest RPS to lowest — more visitors should reach the highest-converting content before they scroll past it. **Trigger:** Content sections are ordered by marketing preference (newest product, brand story) rather than by RPS. **MCP Recipe:** ```json // get_raw_pageview_analytics — by page section // requires selectors for each content bucket's main container { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "page_url": "/", "order_by": "REVENUE", "sort_direction": "DESC" } ``` Group `selector` rows by the parent bucket container each belongs to. Sum `revenue` per bucket. Reorder buckets by total revenue descending. --- ### 8. FAQs **IMPORTANT: Sort FAQ items by RPC, not RPS.** All FAQ items live in the same viewport — they have equal RPS by definition because a session that lands on the FAQ section sees all FAQ items at once. RPS cannot differentiate between items that are all viewed simultaneously. RPC is the correct metric because it measures which FAQ question actually drives a user to click and then purchase. **Trigger:** FAQ items have wide RPC variance. FAQ section is below the fold for paid traffic landing pages. **MCP Recipe (FAQ-specific):** ```json // get_raw_event_analytics — FAQ section on a PDP or landing page { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "page_url": "/products/your-product", "order_by": "REVENUE", "sort_direction": "DESC" } ``` Filter rows to `selector` values matching FAQ items (e.g., contains "faq", "question", "accordion"). Sort by `rpc = revenue / value`. Move highest-RPC questions to the top of the FAQ list. **Additional action:** For paid traffic landing pages (first-time mobile dominant), move the entire FAQ section higher on the page. Cold traffic has more objections — answer them before the Gator loses interest. **Buy Box note:** The Buy Box is a major lever within the FAQ context. The elements around the buy box — BNPL options, scarcity indicators, free shipping threshold — all have measurable RPC. Treat them with the same RPC sort logic as FAQ items. See `aov-strategies` for buy box optimization tactics. --- ### 9. Unique Value Propositions (UVPs) Sort UVP content buckets by RPS using the same Bucket Testing recipe as #7. The UVP that best converts The Gator should be first — and likely belongs in your headline copy, ad creative, and email subject lines as well. A UVP that drives 3× the RPS of others is telling you what customers actually care about. **Trigger:** Multiple UVPs exist on the page. Apply Bucket Testing to find the highest-converting UVP angle. --- ### 10. On-Page Upsells Place recommended products / "you may also like" sections **below** the Add to Cart button. Above the CTA creates scroll debt and may distract The Gator before the primary purchase. Measure upsell RPC to confirm the upsell is additive. **Trigger:** Upsell section is above the CTA (move it). Upsell RPC is near zero (replace the upsell products). **MCP Recipe (upsell effectiveness):** ```json // get_raw_event_analytics — PDP upsell section { "site_id": "", "date_range": { "start": "2026-04-01", "end": "2026-04-30" }, "page_url": "/products/primary-product", "order_by": "REVENUE", "sort_direction": "DESC" } ``` Filter to upsell tile selectors. Compare RPC per upsell item. Items with `rpc < 0.10` are not earning their placement — replace them. --- ## The Universal Recipe For any element-level question, this is the default starting query: ```json { "site_id": "", "date_range": { "start": "" }, "page_url": "", "order_by": "REVENUE", "sort_direction": "DESC", "limit": 100 } ``` Compute `rpc = row.revenue / row.value` for each selector. Sort by RPC. Identify the top performers (reinforce, promote) and the bottom performers with high clicks (Conversion Killers — investigate and remove or move). --- ## Decision Rules - **Same element type on the same page:** Use RPS to rank and reorder. - **Cross-element comparison of different types:** Use RPC. - **FAQs specifically:** Use RPC, not RPS — all FAQ items share a viewport. - **Elements 100% of visitors see (nav, hero, above-fold):** Highest priority. Error cost is maximized by high exposure. - **Elements far down the page with low traffic:** Use RPC to identify hidden high-potency items worth promoting. - **Always optimize mobile before desktop.** ~80% of traffic is mobile; quadrant-filter with `device: "MOBILE"` first. - **Conversion Killer threshold:** ≥ 20 clicks + `revenue = 0.00` → investigate with screen recordings, then remove or move. --- ## Gotchas **Gotcha 1 — Sorting collections tiles by bestseller rank instead of RPS.** Bestsellers sell more because they've always been at the top (position bias). RPS strips out position bias. Trust the data over the sales rank. **Gotcha 2 — Social media icons in the navigation.** Some of the most reliable Conversion Killers in ecommerce. Over 30-day periods, social icon clicks in nav headers routinely drive $0.00 in revenue. Remove from nav; place in footer only. **Gotcha 3 — Using click-only heatmaps to identify Conversion Killers.** A click-only map shows engagement. You cannot see a Conversion Killer without revenue data. The most dangerous Conversion Killers look like "popular" elements on click maps. **Gotcha 4 — Reordering carousel images on aesthetics.** The image the marketing team is proudest of is often not the one that converts. RPS and RPC decide order, not opinions. **Gotcha 5 — Not separating mobile and desktop nav analysis.** Mobile nav is a hamburger menu. Desktop is a horizontal bar. Their RPS profiles can be entirely different. Optimizing one without the other leaves money on the table. **Gotcha 6 — FAQ ordering by RPS (wrong metric).** All FAQs are visible at once in the same viewport. RPS is equal across them by definition. Use RPC. --- ## Cross-references - `heatmap-metrics-literacy` — RPS vs. RPC decision logic for each element type - `quadrants-of-traffic` — always filter element analysis by quadrant; mobile nav must be analyzed with `device: "MOBILE"` - `cro-philosophy` — Conversion Killer concept is an application of the Gator/Judge model - `aov-strategies` — on-page upsell placement rules connect to the broader upsell strategy; buy box tactics - `heatmap-data-model` — `get_raw_event_analytics` tool and output shape used in every recipe above --- > **eBook Team flag:** Carousel numbers ($3.21, $0.41, $4.24) are from the > book's wallet-brand carousel example — restored to accurate values in this > version. FAQ ordering by RPC (not RPS) is corrected here from the prior > version. Buy Box sub-section added per Ch 5 structure. All content above is > book-accurate.