| name | lead-gen-calculator |
| description | Multi-step calculator UI for Astro. Quote tools, pricing calculators. Uses astro-forms for backend. |
Lead Gen Calculator Skill
Multi-step calculator UI. Requires astro-forms for backend.
Purpose
Step-by-step calculator interface. Captures leads through progressive questions.
Output
calculator_ready: true
steps: [...]
step_limits: { max_steps: 7, max_fields_per_step: 4 }
primary_conversion: { type: calculator, id: "quote-calc" }
conversion_verdict: PASS | WARN | FAIL
Primary Conversion Declaration
Calculator IS the primary conversion on its page.
primary_conversion:
type: calculator
id: "quote-calculator"
page: "/kalkulator"
No other forms on calculator pages.
Page Exclusion Rules
| Page Type | Calculator Allowed |
|---|
| calculator | ✅ Required |
| landing | ✅ Optional (embedded) |
| service | ❌ Use form instead |
| thank-you | ❌ Forbidden |
| article | ❌ Forbidden |
Calculator on forbidden page = FAIL.
Step Limits (Cognitive Load)
step_limits:
max_steps: 7
max_fields_per_step: 4
max_options_per_question: 6
| Limit | Value | Result if exceeded |
|---|
| Steps | 7 | FAIL |
| Fields/step | 4 | FAIL |
| Options/question | 6 | WARN |
Progressive Disclosure
Personal data only in final step.
| Step | Can Ask |
|---|
| 1-N | Service, location, preferences |
| Final | Name, email, phone, GDPR |
Email before final step = FAIL.
Step Types & Auto-Advance
| Type | Behavior | Auto-advance |
|---|
| radio | Single select | Yes (200ms) |
| checkbox | Multi-select | When all selected |
| dropdown | Select menu | On selection |
| form | Contact (final) | No (submit) |
Data Integrity Contract
Calculator submissions MUST include:
data_contract:
required:
- quote_id
- all_answers
- source_page
- timestamp
- gdpr_consent
calculated:
- price_estimate
- breakdown
Post-Submit Flow Contract
post_submit_flow:
1_result_page: required
2_confirmation_email: required
3_analytics_event: required
Any missing = FAIL.
Visual Rules
| Element | Rule |
|---|
| Images | 1:1 aspect ratio |
| Cards | Brand color bg, white text |
| Social proof | Different per step |
| Chrome | Minimal, focus on question |
| Menu | Hidden on calculator |
Loading Strategy
| Phase | Action |
|---|
| First page | Eager load all assets |
| After load | Prefetch next step |
| API calls | Show skeleton |
GTM Events (Required)
gtm_events:
- calculator_step
- calculator_option
- calculator_submit
- calculator_value
Missing events = WARN.
Browser State
| Feature | Implementation |
|---|
| Persistence | localStorage |
| Back button | popstate listener |
| State restore | From history.state |
Conversion Verdict
conversion_verdict: PASS | WARN | FAIL
issues: []
| Condition | Verdict |
|---|
| Calculator on forbidden page | FAIL |
| >7 steps | FAIL |
| >4 fields per step | FAIL |
| Email before final step | FAIL |
| Missing data contract field | FAIL |
| Post-submit flow incomplete | FAIL |
| >6 options per question | WARN |
| GTM events missing | WARN |
| All pass | PASS |
FAIL States
| Condition |
|---|
| Calculator on thank-you/article |
| Exceeds 7 steps |
| Exceeds 4 fields per step |
| Personal data before final step |
| No result page |
| No confirmation email |
WARN States
| Condition |
|---|
| >6 options per question |
| GTM events not configured |
| No social proof variation |
References
Definition of Done
