AmplyViewer is a cutting-edge application developed to empower real estate companies with an engaging, photorealistic 3D representation of their projects. Accessible across all devices (desktop, tablet, and mobile), AmplyViewer offers real estate developers a compelling, immersive tool to showcase properties online, providing a powerful first impression for potential buyers.
Technologies Used
Built on a modern stack, AmplyViewer uses the Astro framework with TypeScript for a robust, responsive front end. Three.js powers interactive 3D apartment selection, allowing users to explore properties by clicking on individual windows to reveal apartment details. The application is deployed as a static site on Netlify, and a dedicated backend server built with Convex facilitates seamless data exchange. AmplyViewer connects with Airtable, where real estate managers can dynamically update apartment information, such as availability status (available, booked, sold) and general details, keeping the platform fresh and accurate for clients. i18next is used to provide multilingual support, ensuring a localized experience for diverse markets.
Architecture
AmplyViewer is designed as a modular, embeddable iframe application, making it easy for real estate companies to integrate into their existing websites. Hosted independently on Netlify, each client receives a dedicated application folder, which maintains organized and secure project deployment. The backend handles essential tasks, such as retrieving apartment data from Airtable and checking license validity for each customer who has purchased AmplyViewer, ensuring smooth functionality for each deployment.
Key Features
AmplyViewer’s standout features are designed to engage potential buyers and deliver an intuitive user experience:
- Photorealistic 3D Rendering: Users can interact with 3D property models that visually simulate the future building, creating an impressive, lifelike viewing experience.
- Interactive Apartment Selection: By clicking on windows, users can access specific apartment details, creating an immersive and exploratory journey through available units.
- Rotational Navigation: Clients can rotate the 3D model using intuitive navigation buttons, allowing full visibility of the property’s exterior.
- Dynamic Data Integration: Airtable allows property managers to easily update apartment information, ensuring timely updates to availability and other essential details.
Key Challenges
The development of AmplyViewer presented several technical challenges:
- 3D Interactivity: Implementing Three.js for smooth, responsive 3D rendering across devices required fine-tuning to ensure a consistent and photorealistic experience for all users.
- Backend Integration: Managing real-time data retrieval and license verification with Convex meant ensuring secure and stable integration with Airtable, enabling managers to make updates effortlessly without breaking application functionality.
- Embedding Flexibility: Designing AmplyViewer as an iframe application involved structuring each deployment to be highly modular and adaptable to various client websites, all while maintaining security and ease of maintenance.
Target Audience
AmplyViewer is tailored for real estate developers seeking to captivate potential buyers through advanced 3D visualizations. It serves as an ideal digital solution for projects at the marketing stage, where interactive property previews can make a critical impact on buyer engagement and decision-making.
Access
AmplyViewer is fully hosted and managed, with deployment managed per client as a Netlify-hosted application embedded within client sites.