VT-Platform, cross-platform interface WEB, Mobile, Desktop.
The Issue: Communication in the AECO sector is limited and complex.
In the construction and AECO sector, there is a communication gap between office staff and on-site personnel.
This project aims to bring communication technologies into the work environment, closing the gap between the office and the construction site with user-centered technics.
Research and problem diagnosis
The design process began by identifying critical points where information is lost or errors occur. To achieve this, various actions were carried out:
Observation on-site and in the office, interviews and workshops, process mapping, analysis of information flow, documentation of tools and devices used, structured surveys and interviews, etc.
Based on this information, a communication gap map was developed, prioritizing those gaps that have the greatest impact on costs, time, or safety, and laying the groundwork for the development of appropriate technological solutions.
Web
+
Augmented reality
+
Virtual Reality
=
VT-Platform
Definition of objectives and conceptual design
After this first research phase, the objectives were defined, establishing use cases, possible solutions, and future KPIs.
At this stage, augmented reality began to gain relevance, as it offered the possibility of bringing 3D BIM models directly to the construction site, facilitating their understanding and organically resolving interpretation difficulties.
The conceptual design focused on developing a functional MVP with virtual reality for the office, a web platform for management, and an AR app for the construction site all three interconnected to facilitate communication, enable testing, and assess the project’s feasibility.
The design concept was created through wireframes in Figma, and later, following the evolution of the MVP, the professional version was released.
Web HomePage
The platform is organized into companies, which in turn host users and projects. This structure facilitates collaboration between companies, a critical aspect of the construction industry.
The initial version of the cards lacked distinguishing information, colors, or icons to differentiate one project from another. They were distinguishable only by their titles and a number for each one.
While this design was more visually harmonious, early internal testing revealed that it was not functional. Users often struggled to locate specific projects.
To address this issue, each project is now assigned a unique color and icon, which can be customized. This approach not only engages users in the creation process but also makes it easier to remember and identify each project.
BIM 3D Model viewer
The viewer is designed for the use of 3D BIM (Building Information Modeling) models, which, in addition to containing the building’s geometry, include a construction information database.
One of the issues we identified using Smartlook was that users were not viewing the models in AR. To address this, we implemented a direct access solution using a QR code in the web viewer. This allowed users to seamlessly open the same model in the app that they were viewing on the web. We also change some navbar names.
This solution led to a 10% increase in AR model views, enabling office users to quickly access the models and discuss them with a more realistic perspective.
Files management
Team management
File management allows you to overwrite, upload new versions of the same file and transfer content between files (such as measurements, notes, positioning anchors) through an easy-to-use, step-by-step guided interface. This kind of interactions are in all the Multiplatform interface AR/VR/WEB.
User management enables you to monitor construction personnel, view statistics on uploaded files and resolved issues while managing the team and their permissions effectively.
Project control dashboard
Initially, the product lacked dashboards, and when users accessed the project, they were presented with only a brief summary.
After conducting interviews with the sales and support teams, they highlighted several issues they had identified, emphasizing the need to measure and track the actual progress of projects effectively.
This feedback revealed that we had been focusing on operational workflows rather than management. As a result, there was no way to accurately assess project progress.
Several ideas were considered to address the issue, including integrating downloadable resources into the tools and generating monthly email reports. Initially, the focus was on creating dashboards with the capability to generate downloadable and printable files, which facilitates both on-screen visualization and field use.
This solution was successfully validated through on-site client interviews, leading to the implementation of complementary features, such as the automatic generation of incident reports in PDF format.
VT-Platform has its own design system:
VT-Platform was designed to continuously evolve with new solutions.
To support this growth, a design system was developed in Figma to streamline the process.
Check VT-Platform web here:
Augmented Reality App design:
The augmented reality application presented a significant challenge due to the limited design information available for these emerging technologies. After conducting thorough research that considered competitors and trends from leading tech companies, the initial approach focused on blending familiar mobile usage concepts with simple 3D interactions at key moments.
This strategy resulted in an interface with a very quick learning curve and an intuitive approach, leveraging actions already familiar to users from mobile devices.
Measure tool
Interactions within the space are guided to facilitate understanding, supported by a simple introductory tutorial provided when using the tool for the first time.
BIM Data tool
Issue traking solution
The solutions can be integrated into the main application and consist of AR, VR, and web components.
These solutions focus on digitizing complex on-site processes, such as layout planning or issue resolution.
Tools menu AR
Responsive menus
To ensure ease of use in any situation, the interfaces have been designed to support both vertical and horizontal orientations. Initially, this functionality was not planned, as it significantly increased development complexity.
It was only when we started requesting videos from our partners that we realized most of them were recording in horizontal format.
All menus feature simple iconography to represent complex actions, such as using a digital anchor or adjusting the opacity of a digital object.
Check AR APP in the markets here:
The graphic content for the markets was designed to showcase the application’s features and capabilities, with a focus on explaining to the general public how augmented reality can enhance an artistic work.
Virtual reality features:
VT-Platform employs a unified design language and aesthetic across all three technologies (AR, VR, and Web), ensuring seamless understanding and usability across each. This approach was intentionally developed to emphasize the concept of a cohesive system rather than separate, standalone applications.
Special care has been taken to establish a clear and consistent design language throughout every aspect of the platform.
VR Model selection & settings
To enhance usability, a screen-based system was created, inspired by the logic of using a computer. This system allows users to easily change the main settings and access the project they will be working on
Hand tools menu in VR
Once the model is selected, the user is immersed in it lowering the menu on the left remote, allowing them to aim at it with a pointer or selector in their right hand, which enhances visibility and ease of use.
Draw tool for VR
The tools available in all the multiplatform interface AR/VR/WEB include: viewing the BIM database for each component of the model, measuring dimensions, painting on the model or in mid-air, accessing architectural plans, adjusting the opacity of specific model parts, creating section cuts, filtering by model components and scaling the model.
The tools included in the application went through several development phases. In the alpha version, pre-defined solutions were not yet considered. Instead, users were provided with tools they could combine to create their own customized solutions.
Following the launch of the beta version and initial feedback from user testing, we discovered that customers struggled to create solutions. They found it unclear what each tool combination could offer or how to effectively combine them.
To address this issue, we decided to offer pre-packaged, one-directional workflows with clearly defined starting points and endpoints. These streamlined packages provided users with a more structured and intuitive approach.
By the time we prepared the production version, we realized that in some cases, users only needed access to a single tool. One prominent example was the “Measure” tool, which saw significant demand for standalone use. To accommodate this, we introduced the AR Tools package, available for casual use at no additional cost across all plans.
The success of offering pre-designed solutions was measured by the number of sales generated from these packages.
Check Oculus quest application here:
The result:
After studying the user type, conducting usability tests, A/B testing and developing user personas, I was able to create a multiplatform interface VR/AR/WEB very simple that brings all the advantages of VT-Platform closer to the average construction user.
.
The design system comprises over 200 elements that interact seamlessly, giving the project a unique identity, enhancing usability, and simplifying development.
.
This is reflected in its usage, with a total of 1,000 registered companies and thousands of people using it daily on various construction sites around the world.
.
Throughout this project, I learned the importance of user testing and how solid research can lay the foundation for an effective interface. Additionally, I learned a new way to organize big projects and gained valuable experience with various techniques for gathering feedback, such as A/B testing, planning user interviews, or creating user personas.
.
The project remains active and continues to evolve gradually, incorporating new technologies and solutions easily thanks to the design system.
Main technologies in this project:
Prototyping and Wireframing, Interaction design, Accessibility (WCAG), User research and analysis (Google Analytics, Hotjar, Test A/B, Interviews...), Responsive design, AGILE, SCRUM and design thinking, User-centered design (UCD),Design systems (Libraries, tokens, documentation...), User research techniques and analysis (Google Analytics, Hotjar, Test A/B, Interviews...), AGILE, SCRUM and design thinking and User-centered design (UCD)
Want to know how this product sold? Take a look at the website creation.