Creating Your First Calculator

Creating Your First Calculator

Overview

This tutorial walks you through creating a calculator from start to finish. The editor uses a short sequence of tabs. You can skip optional tabs or return to them later. Chat with AI stays available the whole time — it is not the first wizard step. By the end, you'll have a working calculator assigned to a product and live on your storefront.

Prerequisites

Steps

Open Appify CPO → Calculators, click New, then select Create from scratch. Give your calculator a name.

  1. Chat with AI (optional) — The chat panel opens so you can describe your product in plain English. The assistant generates options, pricing, and layout. You can minimize chat and build everything by hand instead. See Calculator AI chat.

  2. Options & Pricing (required) — Add the input fields (options) your customers will see — dropdowns, number fields, text inputs, image swatches, and more. Define pricing formulas to calculate the price based on those option values.

  3. Optional Features — Enable extras like a price summary display, multi-step layout, custom SKU, weight calculation, languages, and multi-currency. Everything here is optional — skip anything you don't need.

  4. Personalization / Designer — These tabs appear only if you add a Personalization or Product Designer option. Chat cannot edit those tabs yet.

  5. Placement & Styling (required) — Choose which products the calculator applies to, adjust colors and fonts to match your theme, and preview how it looks.

  6. When you're ready to go live, click Publish v1 in the editor header. Publishing creates a versioned snapshot and makes the calculator visible on your storefront. Saving alone does not publish — your changes remain a draft until you explicitly publish.

Tab summary

Tab Required? Purpose
Options & Pricing Yes Define what customers see and how prices are calculated.
Optional Features No Add advanced behaviors and display settings.
Personalization Only if you add that option Visual personalization layers.
Designer Only if you add a Product Designer option The design canvas customers use.
Placement & Styling Yes Assign to products and customize appearance.

Use Chat with AI from any of these tabs. On a phone or tablet, open chat or preview — not both at once.

Examples

  • Quick start with AI — You describe your custom blinds product in Chat with AI. The assistant generates width, height, and material options with a pricing formula. You skip Optional Features, assign the calculator to your product in Placement & Styling, and publish — a working calculator in minutes.
  • Manual build — You minimize chat and go to Options & Pricing. You add a Dropdown for size, a Color Swatch for finish, and a Text Box for engraving. You set pricing formulas, assign to your product, and publish.
  • Engraved jewelry — You create a calculator with an engraving text (text input) and font choice (dropdown). You use a per-character pricing formula to charge based on text length. You publish and assign it to your engraving product.

What's Next

Your first calculator is live. Explore the Calculator Editor Overview to learn about advanced features like pricing variables, pricing tables, and visibility rules.