# Immo-App

> A concept study for architecture and construction firms: a four-language web presence with an interactive before-and-after gallery that makes renovation work visible. Pre-rendered, as fast on a phone as at a desk.

Source: [https://www.arytechsolutions.com/en/blog/immo-app-architekturbuero](https://www.arytechsolutions.com/en/blog/immo-app-architekturbuero)

- Client: ARY Tech Solutions
- Published: 2026-09-17
- Updated: 2026-09-20
- Author: Ali Ramazan Yıldırım
- Reading time: 3 min
- Technology: Next.js, React, TypeScript, next/font, Swiper, WebP, Netlify

> An in-house concept study: Immo-App is not a client commission but a demo project that shows the approach for architecture and construction firms end to end. Everything described here can be checked live.

## Starting point

Architecture and construction firms work in one of the most visual trades there is — and often have the least visual web presence. The portfolio sits in PDF folders, the references live on the site manager's phone, and the website ends up showing four stock photos and a phone number. But nobody planning a house or refurbishing an existing building decides on the basis of a service list. They decide because they have seen what comes out at the end.

## The challenge

- Make the work visible: a shell construction and a finished house are the same project — side by side they tell a story, separately almost none.
- Working across borders: a firm handling projects in Freiburg, Strasbourg and Basel loses enquiries on a German-only website.
- Trust before the first conversation: clients check the team, the process and the references long before they pick up the phone.
- Opened on site: a large share of these visits happen on a phone, often on a poor connection — the site has to be as fast there as at a desk.

## The solution

Immo-App answers those four points not with a feature catalogue but with four decisions. The transformation gallery puts before and after into the same frame and hands the visitor the slider — they don't see a result, they uncover it themselves. The four language versions are not translation widgets but full pages with their own addresses that search engines can index separately. Team, process, references and frequently asked questions stand as sections of their own, so the background research ends on the site rather than on a review platform. And every page is pre-rendered, so it appears immediately even on a thin connection.

_The Immo-App transformation gallery: the shell construction on the left, the turnkey house on the right, a draggable slider in between. — The slider can be dragged to either end — or jumped to with the “Before”, “50 / 50” and “After” buttons._ (https://pub-ee92c923c9954077b449900193b4651f.r2.dev/blog/028518a9-4179-4892-bf21-45754ef89315-immo-app-architekturbuero-transformation.webp)

## User experience

The entry point is three rotating project images, not a welcome text. From there the page runs in the order a client thinks in anyway: what do you do, what have you built, how does that look before and after, who works on it, what do others ask, how do I reach you. The language switch sits in the header and leads to the same place in the chosen language rather than back to the home page.

- Images in WebP throughout, fonts shipped with the page instead of fetched afterwards — both save loading time on a mobile network.
- Four languages with their own addresses (/de, /en, /fr, /tr) and hreflang annotations — the chosen language is remembered for the next visit.
- A contact form with marked mandatory fields, a search field in the header and an FAQ accordion cover the three most common next steps.

## What this means for your firm

The business core of this setup is not the technology but the order in which the evidence arrives. An enquiry rarely comes out of a description of services; it comes when somebody has seen a project that resembles their own and then gets the impression that the process is sound. A second language version costs a one-off translation and permanently opens a market that starts forty kilometres away. And a site that appears instantly on a phone does not lose the visitors who take a quick look between two appointments.

- **4** — languages from one codebase
- **~20** — pages including legal and blog
- **6** — reference projects in three countries
- **100 %** — of images in WebP format

## Why this approach?

For a site that changes four or five times a year, a permanently running server is the wrong kind of effort. Immo-App is therefore pre-rendered and delivered as a finished page; the technology behind it — Next.js with React and TypeScript — stays invisible to the operator and only becomes relevant when an editing system, a project archive or a client area is to be added later. That is exactly the point: the setup is deliberately chosen so that the second stage is not a rebuild.

## Your project

Immo-App is built as a demo project, but every decision in it comes from the everyday reality of architecture, construction and renovation businesses. If your firm needs a web presence that shows projects rather than listing them, the same setup can be built with your references, your services and your languages — if in doubt, starting with a single before-and-after sequence you have already photographed anyway.

[See solutions for architects and construction](/solutions/architects-construction)