Cleaning company website

Framuga: a St Petersburg cleaning website with a price calculator

A demo website for Framuga, a made-up cleaning company in St Petersburg: a calculator by area, checklists and a before and after slider.

Framuga home page: a before and after screen with a slider

The task

Every other customer writes “how much for a two-room flat after renovation”, and we count by hand. The site should show the price at once, line by line, with a list of what the cleaning includes.

What we built

  • Calculator: type of cleaning, area, bathrooms, pets, 12 extras
  • Six services with a checklist of what is and is not included
  • A before and after slider for mouse, touch and keyboard
  • Prices in tables, examples and the calculator come from one file

A demo with a made-up company

Framuga does not exist, and neither does the street in its address. The company, the cleaner on the sample checklist, the warranty rules and the prices were invented for the demo. The rates per square metre follow the St Petersburg market in autumn 2026, but nothing can be ordered. The blog tips, the district notes and the job checklists are real and usable.

The price shows at once

The calculator on the prices page builds a line-by-line estimate: type of cleaning, area or a typical flat, bathrooms, high ceilings, pets and twelve extra services. Next to it you see how many cleaners will come and how many hours the job takes. The estimate goes into the request, and the customer picks a date. In the demo the form checks the fields and answers on the page.

Prices in the service tables, the district examples and the calculator come from one file. Change a rate and it changes everywhere. The calculator arrives from the server with a starting estimate, and a 9 KB script recalculates it with the same functions.

Each of the six services has a checklist of what is and is not included, a table of prices and times for five typical flats, and questions and answers. More on such sites is on the cleaning company website page.

Like glass after a squeegee

The style comes from a rubber squeegee that leaves a straight edge on a window: dull on one side, clean on the other. Colour planes meet with no gaps, and the first screen of the home page is a full-width before and after slider. On service pages the same slider shows a window, a kitchen or a sofa dirty and clean.

  • 31 pages of static HTML, Svelte is not loaded in the browser.
  • Lighthouse on mobile: 100 for all four scores, first screen in 1.4 s, a page weighs 63-70 KB.

Requests with an estimate can land in a Google Sheet, so the team lead sees the week’s schedule.

Screenshots

Other projects

Tell us about the task

In your own words, no spec needed. We reply within a working day with a price.

Discuss a project

We only use a technical cookie to remember your choice.
No analytics or advertising without your consent.

How we handle data