Skip to content
Pitaj.io

AI Widget Builder

The Pitaj.io AI Widget Builder allows you to break free from the constraints of plain text dialogue. If your visitor needs an auto lease calculator, a hotel room selector with photography, or a multi-criteria survey, you can generate it by describing your vision in plain English.

Workspace Layout: Split-Screen Conversational Canvas

The builder screen at /build/widgets features a cohesive two-column development workspace:

  1. Left Panel (Conversational AI Prompt Engine):
    Collaborate with our dedicated frontend AI engineer. Request architectural changes, adjust color accents, insert input fields, or tweak mathematical formulas.
  2. Right Panel (Live Interactive Canvas):
    Renders real, fully reactive JSX components instantly. Interact with buttons, adjust numeric sliders, type into form inputs, and test validation errors prior to saving.

Building a Custom Widget in 3 Steps

  1. Describe Your Component Intent
    Submit a prompt in natural language:
    “Build a home mortgage calculator with a loan amount slider up to $500,000, tenure slider up to 30 years, and 4.2% interest rate. Compute monthly payments and total interest.”

  2. Autonomous Code & State Synthesis
    Within seconds, the engine compiles a clean JSX component hierarchy, a reactive state store, and a Zod validation schema.

  3. Iterate Conversationally
    Refine styling or mechanics with simple natural instructions:

    • “Make the summary monthly card dark emerald.”
    • “Add a CTA button at the bottom: ‘Apply for Pre-Approval’.”
    • “Enforce a minimum loan ceiling of $25,000.”

  4. Deploy to Agent Catalog
    Click Save Widget. The component is immediately available for your agent to render during visitor chats!

Common Production Components

Financial Simulators

Loan calculators, vehicle leasing estimators, solar savings forecasts, and currency converters.

Product Selectors

Interactive size charts, feature matrix pickers, and dynamic visual room configurators.

Interactive Needs Quizzes

3-step discovery questionnaire concluding with personalized product recommendations.

Pricing Tier Comparisons

Side-by-side plan comparisons with interactive toggle switches for monthly vs. annual billing.