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
Result:
As a result, AiFront now has a fully-fledged mobile version that:
- has expanded the product’s use cases
- has made the service convenient for use on-site
- has increased user engagement
- has maintained a consistent user experience across web and mobile
The project has moved a step closer to becoming a fully-fledged AI SaaS product for the construction and façade industry.