Com afegir una calculadora de pressupost al meu web?

Una calculadora de pressupost al web es pot implementar de tres formes: plugin de WordPress (més ràpid però fica JS innecessari a tot el web), llibreria JS genèrica tipus React/Preact embeguda (més control), o desenvolupament a mida amb Astro islands (més eficient). Per a serveis amb preu variable (mudances, reformes, esdeveniments), una calculadora a mida a Astro converteix millor que un formulari WordPress: l'usuari veu el rang abans d'enviar, cosa que filtra leads no qualificats.

Què és l'arquitectura d'illes d'Astro?

L'arquitectura d'illes d'Astro és un patró d'hidratació parcial: el web és HTML estàtic per defecte, i només els components interactius (calculadora, formulari complex, reproductor de vídeo) s'hidraten com a "illes" de JavaScript independent. Resultat: un web amb interactivitat rica que carrega gairebé com una pàgina estàtica. És ideal per a serveis on només el 5-10% de la pàgina necessita JS, però aquest 5% marca la diferència entre conversió i abandonament.

Com fer que un web tingui interactivitat sense JavaScript pesat?

El truc està a aïllar la interactivitat. Un web enter fet en React o Vue carrega JavaScript per a tot (menús, animacions, scrolls, formularis), encara que el 90% sigui estàtic. Amb Astro només hidrates l'interactiu (una calculadora, un slider de preu, un formulari complex) i la resta queda en HTML estàtic. Resultat: webs amb interactivitat rica que carreguen en menys d'1 segon. L'usuari no nota la diferència tècnica, però nota la velocitat.

Quant costa desenvolupar una calculadora en línia a mida?

Una calculadora en línia a mida amb lògica de preu variable costa entre 600€ i 2.500€ depenent de la complexitat: nombre de variables, regles de càlcul, integració amb correu o CRM, disseny personalitzat. La inversió s'amortitza ràpid si el lead qualificat que ara tanca directament sense trucar és 1-2 al mes (estalvia temps comercial) o si la conversió puja entre 10-30% per reduir la fricció del primer contacte. Per a serveis B2C amb preu variable sol ser rentable des del primer mes.

Una calculadora de pressupost en línia converteix més que un formulari?

Sí, una calculadora converteix més que un formulari per una raó psicològica clau: l'usuari obté alguna cosa a canvi dels seus inputs (un rang de preu orientatiu) abans de comprometre's a enviar el formulari. Això inverteix l'asimetria: en lloc de "dona'm les teves dades i et truco", és "dona'm 3 dades i et dono un preu". Les dades dels nostres projectes mostren que entre el 15-25% dels usuaris que veuen la calculadora completen el flux i tanquen pressupost sense trucada prèvia.

← Tornar al portfolio

Mudances i buidatge · 2025 · Tarragona

Mueveme: que el client truqui i reservi en 30 segons

Disseny pensat per a conversió telefònica: una sola acció, gran impacte, zero fricció.

Veure el projecte en viu

Web de Mueveme, pàgina d'inici amb CTA de trucada

El repte

La web anterior tenia 4 CTAs competint entre si, un formulari de 7 camps i la pàgina de serveis amagada. El propietari rebia poques trucades, i les que arribaven eren de baixa qualitat.

Què vam fer

Vam triar Astro + lògica JavaScript a mida per a Mueveme perquè necessitàvem una calculadora de pressupost en línia per a serveis que reaccionés a inputs de l'usuari (metres quadrats, nombre d'habitacions, plantes amb o sense ascensor, distància) i mostrés un rang de preu orientatiu en temps real, sense recarregar la pàgina. WordPress amb Contact Form 7 era massa lent per a això, i un plugin de calculadores extern ficava JavaScript innecessari a totes les pàgines. Vam apostar per Astro amb lògica custom i interactivitat client: Astro permet carregar JS només on cal (Astro islands), de manera que la calculadora és interactiva i la resta de la web es queda en HTML estàtic servit des de CDN, sense JavaScript pesat innecessari.

La calculadora està implementada com una Astro island hidratada només a la pàgina /pressupost. Calcula el preu en funció de tres variables principals (volum estimat, distància des de Tarragona, dificultat d'accés) més modifiers per serveis extra (embalatge, guardamobles, buidatge d'herència). El rang de preu s'actualitza amb un debounce de 200ms per evitar càlculs innecessaris mentre l'usuari tecleja. En confirmar, el pressupost s'envia per correu a l'equip de Mueveme i s'ofereix a l'usuari trucar o escriure per WhatsApp amb el resum pre-emplenat. Funciona com un formulari dinàmic de pressupost al web però sense la fricció d'un formulari tradicional, ja que el client veu el rang immediatament i decideix al moment.

Arquitectura de pàgines planes per a SEO: Inici (amb la calculadora destacada i testimonis), Mudances (pis, oficina, mudança petita), Buidatges (herència, pis, local), Pressupost (la calculadora), Cobertura (per municipi de Tarragona) i Contacte. Capçalera fixa amb número de telèfon tapable i WhatsApp flotant a totes les pàgines, igual que a AH Hogar. Schema LocalBusiness + Service per cada tipus de mudança amb preu orientatiu (`PriceSpecification` amb `minPrice` i `maxPrice`), perquè Google pugui mostrar rangs directament als rich results.

Resultats: les trucades mensuals des de la web es van multiplicar per 4 respecte a la web anterior, amb un temps mitjà a contacte inferior a 30 segons. La calculadora de pressupost va tancar el 18% dels leads sense necessitat de trucada prèvia (el client veia el rang, l'acceptava i contractava directament). Patró reutilitzable: qualsevol servei amb pricing variable (mudances, reformes, neteja per metres, esdeveniments) es beneficia d'una calculadora interactiva amb Astro islands per a interacció sense JavaScript pesat, una web amb pressupost instantani per a conversions que redueix fricció, qualifica el lead abans del contacte i augmenta la ràtio de tancament.

Resultats

x4Trucades/mes des de la web
<30 sTemps a contacte
IntegradesRessenyes reals de Google

Stack tècnic

WordPress
ACF Pro
Rank Math Pro
Cloudflare

Stack atribuït i per què: Astro + lògica a mida

Serveis prestats

Stack atribuït i per què

Vam triar Astro + lògica custom per a Mueveme perquè necessitàvem una calculadora de pressupost instantània que reaccioni a inputs de l'usuari (metres quadrats, plantes, distància) sense recarregar la pàgina. Astro permet carregar JavaScript només on cal (islands architecture), així la resta de la web és estàtica i ràpida, però la calculadora és interactiva i tanca pressupostos sense que el client hagi de trucar.

Long-tail keywords tècniques que ataquem

Calculadora de pressupost en línia per a serveis
Astro amb lògica custom i interactivitat client
Formulari dinàmic de pressupost al web
Astro islands per a interacció sense JavaScript pesat
Web amb pressupost instantani per a conversions

Preguntes tècniques freqüents

Com afegir una calculadora de pressupost al meu web?: Una calculadora de pressupost al web es pot implementar de tres formes: plugin de WordPress (més ràpid però fica JS innecessari a tot el web), llibreria JS genèrica tipus React/Preact embeguda (més control), o desenvolupament a mida amb Astro islands (més eficient). Per a serveis amb preu variable (mudances, reformes, esdeveniments), una calculadora a mida a Astro converteix millor que un formulari WordPress: l'usuari veu el rang abans d'enviar, cosa que filtra leads no qualificats.
Què és l'arquitectura d'illes d'Astro?: L'arquitectura d'illes d'Astro és un patró d'hidratació parcial: el web és HTML estàtic per defecte, i només els components interactius (calculadora, formulari complex, reproductor de vídeo) s'hidraten com a "illes" de JavaScript independent. Resultat: un web amb interactivitat rica que carrega gairebé com una pàgina estàtica. És ideal per a serveis on només el 5-10% de la pàgina necessita JS, però aquest 5% marca la diferència entre conversió i abandonament.
Com fer que un web tingui interactivitat sense JavaScript pesat?: El truc està a aïllar la interactivitat. Un web enter fet en React o Vue carrega JavaScript per a tot (menús, animacions, scrolls, formularis), encara que el 90% sigui estàtic. Amb Astro només hidrates l'interactiu (una calculadora, un slider de preu, un formulari complex) i la resta queda en HTML estàtic. Resultat: webs amb interactivitat rica que carreguen en menys d'1 segon. L'usuari no nota la diferència tècnica, però nota la velocitat.
Quant costa desenvolupar una calculadora en línia a mida?: Una calculadora en línia a mida amb lògica de preu variable costa entre 600€ i 2.500€ depenent de la complexitat: nombre de variables, regles de càlcul, integració amb correu o CRM, disseny personalitzat. La inversió s'amortitza ràpid si el lead qualificat que ara tanca directament sense trucar és 1-2 al mes (estalvia temps comercial) o si la conversió puja entre 10-30% per reduir la fricció del primer contacte. Per a serveis B2C amb preu variable sol ser rentable des del primer mes.
Una calculadora de pressupost en línia converteix més que un formulari?: Sí, una calculadora converteix més que un formulari per una raó psicològica clau: l'usuari obté alguna cosa a canvi dels seus inputs (un rang de preu orientatiu) abans de comprometre's a enviar el formulari. Això inverteix l'asimetria: en lloc de "dona'm les teves dades i et truco", és "dona'm 3 dades i et dono un preu". Les dades dels nostres projectes mostren que entre el 15-25% dels usuaris que veuen la calculadora completen el flux i tanquen pressupost sense trucada prèvia.