Decision Lab: Making tradeoffs visible with Sanity

Description and use

Decision Lab lets users compare options using weighted criteria and adjust priorities on the fly without editing content.

Problem

Decisions with no obvious winner need a way to compare options based on multiple criteria and adjust priorities without editing content.

Outcome

The Decision Lab app allows users to compare options based on weighted criteria, see how rankings change with priority adjustments, and edit decisions in Sanity without rebuilding the frontend.

Workflow

• Create a Sanity project and define a decision schema with criteria and options.
• Add a React frontend that queries the public dataset with GROQ.
• Implement scoring formula: fit = sum(score * criterion weight) / (5 * sum(criterion weight)) * 100.
• Normalize missing score arrays in the query layer.
• Add Studio validation to enforce score presence.
• Fix CSS specificity for table headers.
• Deploy the app to Netlify and test with real content.
• Use temporary sliders to adjust weights without changing published data.

Evidence

The app calculates: fit = sum(score * criterion weight) / (5 * sum(criterion weight)) * 100

Source

The first real publish revealed a useful failure: the document had options but no scores yet. The API returned null for the score arrays.

Source

We also caught a small CSS specificity issue during visual review. The initial letters in the comparison table's colored option marks were pushed away from the center by a generic table-header rule.

Source