Project Overview

Kinectify is a compliance and risk management platform. While working at Stormfors, I was tasked with building a custom savings calculator for their marketing site.

The calculator helps prospective clients estimate potential cost savings, with results passed directly to the sales team to support lead generation and personalized follow-up. To serve different markets, both U.S. and Canadian versions of the tool were developed.

The Challenge

The calculator had to achieve several goals simultaneously:

1. Go beyond native Webflow — Standard Webflow couldn’t handle the dynamic calculation logic required, so custom code was needed.
2. Smooth user experience — The UI had to feel intuitive, requiring responsive slider controls and clear results output.
3. Regional adaptation — Two versions (U.S. and Canada) were necessary to account for regional differences in calculations and context.
4. Sales enablement — Results needed to integrate seamlessly into Kinectify’s sales workflow, turning the calculator into a lead-gen tool, not just a marketing gimmick.

My Role

As the sole developer on this feature, I was responsible for:

• Calculator Development – Built the savings calculator as a standalone feature inside Webflow.
• Custom JavaScript Logic – Wrote all calculation logic to process user inputs dynamically.
• Range Slider Integration – Implemented rangeslider.js to provide smooth, responsive slider inputs.
• Multi-Version Setup – Delivered both U.S. and Canadian versions, ensuring accuracy and consistency across markets.
• Sales Integration – Configured results to flow into the sales team’s process, supporting tailored conversations with prospects.

Services Rendered

• Custom JavaScript Development
• Interactive Calculator Build
• Library Integration (rangeslider.js)
• Sales Enablement Integration

Tech Stack

• Webflow — Host platform for embedding the calculator
• Custom JavaScript — Core calculation and dynamic logic
• rangeslider.js — Smooth, user-friendly slider controls
• Zapier — Automated handoff of calculator results to the sales team

Process & Approach

1. Planning & Requirements
   • Aligned with the Stormfors team and Kinectify stakeholders on inputs, outputs, and sales integration needs.
   • Defined requirements for both U.S. and Canadian versions.
2. UI & Input Design
   • Designed a clean interface embedded in Webflow.
   • Added rangeslider.js for intuitive slider-based input selection.
3. Custom JavaScript Development
   • Wrote calculation functions to handle multiple variables dynamically.
   • Ensured results updated in real time without page reloads.
4. Regional Adaptation
   • Built two tailored versions, each accounting for market-specific differences.
   • Kept the codebase consistent for easier maintenance.
5. Sales Workflow Integration
   • Configured the calculator so results were captured and routed to the sales team.
   • Enabled sales reps to use calculator outputs as a starting point in follow-up calls.

Outcomes

This project delivered a business-critical marketing feature that directly supported sales efforts:

• Extended Webflow beyond native limits with custom JavaScript and external libraries.
• Created an interactive, intuitive tool that engages prospects and demonstrates value immediately.
• Enabled sales team follow-up with tailored data, improving lead quality and conversion potential.
• Delivered multi-regional support with both U.S. and Canadian calculators, ensuring flexibility for different markets.

Reflection

This project showed the power of blending custom code with Webflow marketing sites. While Webflow is strong for design and CMS content, advanced functionality often requires stepping outside its native limits.

If I revisited this project, I’d:

• Add analytics tracking to measure usage and conversion impact directly.
• Explore progressive enhancement (e.g., default form inputs) for environments where JS might fail.
• Create a self-service admin panel (outside of Webflow) to adjust calculation variables without developer involvement.