Interactive home visualisation tool

In an increasingly online world, consumers have come to expect greater levels of self service and flexibility in their digital experiences. At the same time, web technologies are advancing to allow for some truly innovative experiences. ABC Homes wanted to meet these customer demands and leverage new technologies by introducing powerful and exciting new ways for people to visualise and immerse themselves in their future dream home.

There is a range of existing technologies homebuilders use to display ‘virtual tours’ of their home designs. Many of these are created by capturing 360 degree photography of real homes (often display models). While these do a great job of creating an immersive experience, they’re limited to homes that are already built. This is where situ’s home visualisation platform comes into play.

Based on technology often found in the video game industry, situ’s home visualisation platform (made up of situView for home interiors, and situFACADE for external views) allows homebuilders to render their home designs, and associated products and appliances, in high resolution 3D environments. ABC Homes recognised the potential in this technology and brought situ on board to create 3D renders for their catalogue of home designs. Our goal was to integrate the technology into the website in a user-friendly format, and build a highly interactive and intuitive interface around it, to align with the ABC Homes brand.

Workshopping

In order to understand the specific capabilities of the situ platform, and to marry those capabilities with ABC Homes’ requirements, we facilitated a workshop with situ and ABC Homes.

By bringing the situ, ABC Homes, and Tundra teams together, we were able to align on key goals and objectives, technical possibilities and constraints, user needs, and design directions.

As ABC were looking to launch this new experience as quickly as possible, we also discussed the initial scope of the new functionality to clearly visualise a minimum viable product and build a roadmap of future feature updates.

Beyond these workshop activities, we continued to work very closely with the situ team to ensure we were implementing their technology in the best way possible, for users and for ABC Homes’ internal content authoring team.

User Experience and User Interface design

situ’s home visualisation platform has a wealth of useful and interesting features, however the platform doesn’t have a default user interface. This allowed us to create a bespoke home visualisation user experience from the ground up.

As certain features and capabilities of the situ platform weren’t part of the initial scope of the MVP release, special care was taken to ensure that our treatment of the user interface could expand and grow over time, without crowding the interface, and without requiring multiple redesigns when new features and controls are enabled over time.

Our focus while building the interface around this virtual visualisation experience was to give people easy access to the various tools and features of the platform in ways that users have become accustomed to when using similar experiences online. For example, a simple sidebar menu clearly presents options and settings to people to enable them to view the interior or exterior of the home, navigate a home’s floor plan, select interior or exterior colour schemes, and more.

Front-end Development and CMS setup

When implementing the situ platform with ABC Homes’ website (running on Craft CMS), we had speed, usability and scalability front of mind. We found common patterns within situView themes and situFACADE styles, which meant we could set these up once and link them to their respective floor plans.

The situ User Interface was integrated into the Next.js website, leveraging the robust capabilities of the React framework. This proved instrumental in developing a resilient application while significantly optimising our development time. The framework’s support for both server-side rendering (SSR) and static site generation (SSG) ensures enhanced performance, improving both initial page load times and SEO.

We wanted to ensure content entry was efficient for the ABC Homes team, so we created a content model in Craft CMS to easily manage references to over one hundred combinations of individual panoramas and facades. This was based on a simple categorisation system and lists of comma-separated values to match the available styles and options within the situ portal that could be easily copied from a spreadsheet. We also included an automated job to import resources to be used for the website UI, to save content authors hours in managing thumbnails and preview images.

This new home visualisation tool provides a powerful, immersive and flexible way for home buyers to imagine themselves in a brand new ABC Home. By marrying an exciting new technology with our deep understanding of user needs and the home buyer journey, users now have the ultimate freedom to visualise their dream home.

ABC Homes has a powerful new way to present products to their audience, and potential customers now have an engaging, personal, and immersive way to visualise one of the most important and major purchases of their lives.