CP//DEV
Jogas Obras y Proyectos

2026 · End-to-end design & development · Xpandex

Jogas Obras y Proyectos

Full home renovations in Madrid, built around the quote request

  • React 19
  • TypeScript
  • Vite 8
  • Tailwind CSS 3
  • Framer Motion
Conversion
Free quote
Area
Madrid
Bundler
Vite 8

Screenshots of the live site, at 1440px and 375px.

01Home
Home page of the Jogas Obras y Proyectos site, desktop view

Desktop · 1440px

Home page of the Jogas Obras y Proyectos site, mobile view

Mobile · 375px

02Services
Services page of the Jogas Obras y Proyectos site, desktop view

Desktop · 1440px

Services page of the Jogas Obras y Proyectos site, mobile view

Mobile · 375px

03Contact
Contact page of the Jogas Obras y Proyectos site, desktop view

Desktop · 1440px

Contact page of the Jogas Obras y Proyectos site, mobile view

Mobile · 375px

Context

A full-service renovation company working the Vara de Rey and Arganzuela districts of Madrid: plumbing, electrics, tiling, façades, roofing and interiors.

Renovation work is nearly always decided on the quote. The site doesn’t need to tell the company’s story: it needs to get someone to leave their phone number.

Approach

  • One conversion, repeated. “Request a quote” sits in the top bar, in the hero, at the end of every service block and in the footer. There’s no second call to action competing for attention.
  • Brand red over real site photography — the headline breaks so that “done right first time” lands in red. That’s the renovation customer’s main objection, and it’s worth answering on the first screen.
  • React 19 on Vite with strict TypeScript. The stack here was inherited from what the client already had; it was kept and brought up to date rather than rewritten for the sake of it.
  • React Helmet for per-route SEO: title, description and Open Graph change with client-side navigation.
  • Framer Motion for scroll reveals, kept restrained and honouring prefers-reduced-motion.
  • Three trust signals under the button — qualified professionals, competitive pricing, durable solutions.

What I built

  • React application with client-side routing and strict TypeScript
  • Tailwind design system with the brand palette
  • Service structure by trade speciality
  • Quote request form with validation
  • Per-route SEO via React Helmet with Open Graph metadata
  • Static build deployed to production

Outcome

Live on its own domain. It’s the most conventional project here in stack terms, and a reminder that sometimes the right call is to continue with what exists rather than migrate on technical preference.

A note on this work

Built at Xpandex, where I run the full cycle: design, development, performance, accessibility, technical SEO and deployment.

In short

What is Jogas Obras y Proyectos?
A React site for a renovation company. One single conversion — request a quote — repeated at every point of the journey, with per-route SEO handled client-side via React Helmet.
What is Jogas Obras y Proyectos built with?
Jogas Obras y Proyectos is built with React 19, TypeScript, Vite 8, Tailwind CSS 3 and Framer Motion. Carlos Ponce delivered it in 2026 — End-to-end design & development · Xpandex.
What stands out in Jogas Obras y Proyectos?
Conversion: Free quote. Area: Madrid. Bundler: Vite 8.
Is Jogas Obras y Proyectos live?
Yes. Jogas Obras y Proyectos has been live at jogasreformas.com since 2026.

Related work