Vista Wawer Real Estate Website
Coding of the website for the real estate developer “Vista Wawer”
Live previewClient
Rednet
Industry
Real estate
Duration
1 month 2 weeks
Location
Poland
Project Author
Goals
Implementation of a table-based property search
Develop a dynamic search system that allows users to filter apartments without reloading the page.
Integration of a visual search map
Create a system using SVG and JavaScript that lets users select floors and hover over apartments to view details such as apartment number, size, number of rooms, and status.
WordPress integration
Enable content management features to easily update apartment details, images, and descriptions on the website.
Customization and personalization of contact forms
Implement automatic contact form filling for each apartment, making communication between potential buyers and the real estate office faster and more personalized.
Implementation overview
The project started with coding six unique designs provided by the client’s graphic designer, using HTML, CSS, JavaScript, and PHP. The website was fully integrated with WordPress using the Advanced Custom Fields (ACF) plugin, allowing the client to edit all images and text on the site.
A key element of the project was the real-time property search system built with AJAX, which allows users to filter apartments by parameters such as size, floor, number of rooms, and type of property (residential or commercial). Users could also sort the results in ascending or descending order based on these parameters.
In addition, an interactive visual search map was implemented using SVG. Users could hover over apartments on the map to get detailed information such as apartment number, size, number of rooms, and status. JavaScript dynamically displayed this information, pulling data from the SVG attributes. If an apartment was available, clicking on it opened a detailed section with the option to download the apartment card and a pre-filled inquiry form specific to that apartment.
The website was optimized for performance to ensure fast loading times and compatibility with different browsers. Extensive testing was also conducted to ensure smooth functionality across various devices.
Used technologies
Summary
The project resulted in the creation of a responsive real estate website that combines an advanced AJAX-based search with an interactive visual map. WordPress and ACF integration made it easy for the client to update apartment listings, while personalized contact forms improved user communication. The site was optimized for speed and tested across multiple browsers, providing a seamless and efficient user experience.