Skip to content

feat(ucv): add Unified Customer View skill - #101

Open
glawrence90 wants to merge 3 commits into
treasure-data:mainfrom
glawrence90:feat/ucv-skills
Open

feat(ucv): add Unified Customer View skill#101
glawrence90 wants to merge 3 commits into
treasure-data:mainfrom
glawrence90:feat/ucv-skills

Conversation

@glawrence90

Copy link
Copy Markdown
Contributor

Summary

  • Adds a new Unified Customer View (UCV) skill that generates interactive customer profile dashboards in Treasure Studio
  • Pure HTML/CSS + inline SVG — zero JavaScript (required by Studio's sandboxed iframe)
  • 10 tabbed views: Overview, Attributes, Behaviors, Actions, Engagement, Loyalty, Segments, Cluster Graph, Stitched Sources, Comparison
  • Works with any CDP parent segment — discovers schema dynamically via tdx ps desc -o
  • CSS radio-button tabs in 5x2 grid layout, CSS-only bar charts/gauges/progress bars, inline SVG for identity cluster graphs

Files Added

File Description
ucv-skills/ucv/SKILL.md Primary skill document with workflow, HTML structure, CSS patterns, and design rules
ucv-skills/ucv/examples/sample-pacsun-dashboard.html Working example dashboard built from the PacSun parent segment
ucv-skills/ucv/references/css-chart-patterns.md CSS-only chart pattern reference (bar charts, gauges, progress bars, SVG graphs)
ucv-skills/ucv/references/studio-constraints.md Documents Treasure Studio iframe rendering constraints
.claude-plugin/marketplace.json Updated with ucv-skills plugin entry

Test plan

  • Tested against PacSun parent segment (ID 1081941, 15M customers)
  • All 10 CSS radio-button tabs switch correctly (no JavaScript)
  • Inline SVG cluster graph renders in Studio's sandboxed iframe
  • CSS-only charts (bar charts, gauges, progress bars) display accurately
  • Test against additional parent segments with different schemas

🤖 Generated with Claude Code

Adds a new UCV skill that generates interactive customer profile dashboards
rendered in Treasure Studio. Uses pure CSS/SVG (no JavaScript) due to Studio's
sandboxed iframe constraints. Works with any CDP parent segment via dynamic
schema discovery.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@glawrence90
glawrence90 requested review from a team as code owners February 27, 2026 17:26

@td-rahul td-rahul left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Skill Eval: NEEDS WORK

Solid skill with genuinely good internal knowledge (CSS-only Studio constraints, schema-driven approach, chunked HTML pattern). Three structural issues to fix before merge and a few quality improvements.


🟡 Should Fix

1. Remove version: 1.0.0 from frontmatter
Not a recognized SKILL.md field (name and description are the only valid fields). Claude ignores it, but it adds noise and sets a bad pattern. Remove it.

2. Remove the "When to Use This Skill" section
Lines ~38–45 duplicate the trigger conditions already in the description. The skill body is not read before triggering — that's what the description is for. This section wastes context tokens on every invocation and creates a second place to maintain triggers. Delete it.

3. Rewrite the description — passive phrasing + undertriggering risk

Current:

"This skill should be used when the user asks to 'look up a customer'..."

Two problems:

  • Opens with passive instruction-to-reader ("This skill should be used when...") rather than third-person capability statement
  • Trigger recall is only 50% (F1: 67%) — only 5 of 10 intended prompts fire. All 5 misses are natural rephrasings: "360 view of a customer", "pull up a profile", "what do we know about this customer", "loyalty data for customer X", "visualize a customer's purchase history". The description is entirely phrase-matching against 6 literals and provides zero semantic coverage for paraphrases.

Recommended rewrite:

Use this skill to look up, find, or visualize a single customer's profile — also called a Unified Customer View (UCV) or Customer 360. Generates a 10-tab CSS/SVG dashboard in Treasure Studio with live preview, covering attributes, purchase history, engagement, loyalty, segments, and identity graph. Works with any CDP parent segment or database. For a single specific customer — not for aggregate analysis across all customers (use parent-segment-analysis for that).

This adds: natural-language phrasing variants, output tab topics (which match how users describe what they want), and an explicit boundary against parent-segment-analysis (currently no boundary exists — individual customer queries without exact phrase matches will misroute).

4. Clarify tab-count adaptation (the biggest output gap)
Best Practice 7 says "Adjust the grid columns if fewer than 10 tabs" but gives no formula. When a model builds a 6-tab dashboard, it must independently figure out the grid-template-columns value and whether to strip the orphaned CSS selectors from the hardcoded 10-selector :checked~.wrap-c block. Add a concrete example:

For N tabs: use grid-template-columns: repeat(ceil(N/2), 1fr) for 2 rows, or repeat(N, 1fr) for 1 row if N ≤ 6.
Remove the CSS :checked selectors for any skipped tabs.

5. Strengthen the Write tool prohibition
Core Principle 3 says not to use the Write tool but buries it in a parenthetical. In practice, Haiku and Sonnet will still use it. Add a bold leading line:

**Never use the Write tool for HTML files — it fails silently above ~300 lines.**

6. Fix timestamp guidance
Best Practice 9 says "use SQL FROM_UNIXTIME() or format in the HTML". Formatting timestamps in HTML is impossible without JavaScript — which is blocked. Always do it in SQL. Replace with:

Always convert Unix timestamps in SQL before building the HTML: FROM_UNIXTIME(time) works in TD Trino/Presto.
Do not attempt timestamp formatting in HTML — no JavaScript is available.

🔵 Suggestions

  • Remove phantom Related Skills reference: email-campaign-skills:email-campaign doesn't appear to exist in the marketplace. Remove or update it.
  • Clarify Studio unavailable fallback in Prerequisites: currently says "dashboards will be saved to /tmp/ucv_dashboard.html" but doesn't tell the model to skip calling preview_document. Add: "Skip the preview_document call and tell the user to open /tmp/ucv_dashboard.html in a browser."
  • Add evals/evals.json: The sample PacSun HTML is a natural expected-output fixture. Even 2-3 eval entries would close this gap.
  • Verify css-chart-patterns.md and studio-constraints.md have no outbound file links (max reference depth is 1 level).

Trigger Scores (Pass 2)

Precision: 100% | Recall: 50% | F1: 67% — Undertriggering Risk: High

Output Quality (Pass 3)

6/8 scenarios PASS, 2/8 PARTIAL (effective 87.5%). Partials are tab-count adaptation and Write-tool compliance. All hard Studio constraint scenarios (no JavaScript, CSS sibling combinator structure, schema-first) pass cleanly.

What's Good

The Studio iframe constraint documentation, schema-driven approach, chunked HTML pattern, CSS sibling combinator tab explanation, and Common Issues debugging section are all exactly the kind of internal TD knowledge that belongs in a skill. The workflow structure (Discover → Query → Compare → Build → Render) is clean. Reference file separation is correct. No Windows paths, no ALL-CAPS directives, no unqualified MCP tool references.

Main asks: description rewrite (big recall improvement), remove "When to Use" section, remove version: field, add the tab-adaptation formula.

@td-rahul td-rahul left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How to fix this with Claude

Open Claude Code in the td-skills repo on the feat/ucv-skills branch. The fixes below are ordered — do them in sequence.

Step 1 — Remove non-standard frontmatter and the "When to Use" section

In ucv-skills/ucv/SKILL.md:
1. Remove the line `version: 1.0.0` from the YAML frontmatter (keep only `name` and `description`)
2. Delete the entire "## When to Use This Skill" section (the bullet list that duplicates the description triggers)

Step 2 — Rewrite the description

Replace the description field in ucv-skills/ucv/SKILL.md frontmatter with:

"Use this skill to look up, find, or visualize a single customer's profile — also called a Unified Customer View (UCV) or Customer 360. Generates a 10-tab CSS/SVG dashboard in Treasure Studio with live preview, covering attributes, purchase history, engagement, loyalty, segments, and identity graph. Works with any CDP parent segment or database. For a single specific customer — not for aggregate analysis across all customers (use parent-segment-analysis for that)."

The current description only triggers on 6 exact phrases and misses natural rephrasings like "pull up a profile", "360 view of a customer", "what do we know about this customer". The rewrite expands semantic coverage and adds a boundary against parent-segment-analysis to prevent misroutes.

Step 3 — Fix the tab-count adaptation guidance

In ucv-skills/ucv/SKILL.md, find Best Practice 7 ("Adapt tabs to data").
Replace the last sentence ("Adjust the grid columns if fewer than 10 tabs") with:

"For N tabs, use: grid-template-columns: repeat(ceil(N/2), 1fr) for a 2-row layout, or repeat(N, 1fr) for a single row if N ≤ 6. Also remove the CSS :checked~.wrap-c selectors for any skipped tabs from the Critical CSS block."

Step 4 — Strengthen the Write tool prohibition

In ucv-skills/ucv/SKILL.md, find Core Principle 3 ("Chunked HTML Generation").
Add this as the first line of that section, before the existing explanation:

"**Never use the Write tool for HTML files — it fails silently above ~300 lines.**"

Step 5 — Fix the timestamp guidance

In ucv-skills/ucv/SKILL.md, find Best Practice 9 about timestamps.
Replace "use SQL FROM_UNIXTIME() or format in the HTML" with:

"Always convert Unix timestamps in SQL before building the HTML: FROM_UNIXTIME(time) works in TD Trino/Presto. Do not attempt timestamp formatting in HTML — no JavaScript is available."

Step 6 — Fix two minor issues

In ucv-skills/ucv/SKILL.md:
1. In the "Related Skills" section, remove or fix the reference to "email-campaign-skills:email-campaign" — check if this skill exists in .claude-plugin/marketplace.json first, and remove the entry if it doesn't.
2. In the "Prerequisites" section, extend the Studio unavailable fallback to say: "If Studio preview is unavailable, skip the preview_document call and tell the user: 'Studio preview is unavailable. The dashboard has been saved to /tmp/ucv_dashboard.html — open it in any browser.'"

Step 7 — Re-evaluate

Use skill-eval-skills to re-evaluate the updated skill:
eval ucv-skills/ucv/SKILL.md using skill-eval-skills

The description rewrite (Step 2) is the highest-impact change — it should bring trigger recall from 50% to ~90%.

glawrence90 and others added 2 commits April 8, 2026 15:53
- Rewrite description for broader semantic trigger coverage (F1: 67% → 95%)
- Remove non-standard version field from frontmatter
- Remove redundant "When to Use This Skill" section
- Add concrete tab-count adaptation formula (grid-template-columns)
- Strengthen Write tool prohibition with bold leading line
- Fix timestamp guidance to SQL-only (no JS available)
- Add error-handling note for tdx ps desc failures
- Clarify Studio unavailable fallback behavior
- Remove phantom email-campaign-skills reference
- Add evals/evals.json with 3 test scenarios (14 criteria)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Each UCV dashboard now writes to /tmp/ucv-<customer-name>.html instead
of a fixed /tmp/ucv_dashboard.html path. This preserves previous
lookups when viewing multiple customers in the same session.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

2 participants