AiFront mobile app

ollowing the launch of the AiFront web platform The Piplos Media team has developed a fully-fledged PWA version of the app, optimised for mobile use and quick access from any device without the need to download it from the App Store or Google Play.

The main aim of the project was to transform the AI façade visualiser into the most user-friendly mobile tool possible for use ‘in the field’—directly on site, at construction sites or when meeting with clients.

Project objective

Develop a mobile version of AiFront that:

• functions as a native app
• can be installed on a smartphone with a single click
• provides quick access to AI-generated facade visualisations
• maintains the high performance and user experience of the web version
• works on Android, iOS, tablets and desktops

The problem

The classic web version of the project was well-suited to desktop use, but in practice, users often work from their smartphones:

• taking photos of the façade directly on site
• showing options to the client during a meeting
• quickly comparing materials
• using the service whilst on the move

However, developing separate native apps for iOS and Android significantly increased the time and cost of launch.

Solution

PWA architecture

Instead of creating two separate mobile apps, a modern PWA (Progressive Web App) architecture was implemented.

This made it possible to:

• launch the app directly from the browser
• pin it to the device’s home screen
• use full-screen mode just like a native app
• reduce development costs and timeframes
• maintain a single codebase

UX and mobile experience

The interface has been completely redesigned for mobile use cases:

• simplified navigation
• adaptation of the editor interface for touch control
• optimised interaction areas
• improved drag-and-drop functionality on mobile devices
• smooth transitions and animations

Particular attention was paid to performance and the app’s ‘native’ feel.

Key features:

The PWA version supports:

• uploading photos of building facades from a smartphone
• AI-powered material visualisation
• working with user projects
• viewing results in full-screen mode
• saving and re-editing projects
• responsive design for smartphones and tablets

Technology stack

Frontend

• React + TypeScript
• Vite
• Tailwind CSS
• PWA configuration и service workers
• Responsive UI architecture

UX/UI

• Mobile-first design
• Interfaces optimised for touchscreen navigation
• Glide-morph effects and modern UI animations
• Smooth micro-interactions

Performance

• lazy loading
• image optimisation
• resource caching
• accelerated loading via service workers

The benefits of the PWA approach

For businesses

• Launch without publishing on the App Store or Google Play
• Single codebase
• Faster product development
• Lower maintenance costs

For users:

• One-click installation
• Works just like a regular app
• Quick access from the home screen
• No need to download from app stores