Behind the Build: Laying Solid Foundations for Digital twins

Digital twins are not a new concept in virtual worlds. From contemporary recreations of New York City in games like The Division and Marvel's Spider-Man to historical depictions in the Assassin's Creed series, we have consistently sought to construct familiar worlds when given the necessary tools. But what if we want to create something new? Sure, we could utilize tools like SimCity or Minecraft to generate a utopian cityscape, but these systems have their limitations, whether in art style or in the tools available.

Hi again, it's Tommy, and in this article, I'll be sharing the story of how Zaha Hadid Architects approached us with an exciting vision: to create a social, participatory platform allowing architects, investors, and even future residents to collaborate on the design and configuration of a future city—and the challenges around delivering this.

Zaha Hadid is synonymous with architecture, marked by iconic and forward-thinking structures like the Phaeno Science Center in Germany and the Guangzhou Opera House in China. Essentially, if you come across a cool and interesting-looking building, it’s likely Zaha Hadid Architects had a hand in building it. And thus, a fundamental question was posed:

"Why shouldn't our architectural approach be equally pioneering?"

Why are we still relying on outdated methods like blueprints or spreadsheets when a more dynamic solution exists? Imagine an interactive platform that fosters real-time collaboration among all stakeholders within a shared virtual environment.

MSquared set out to create such a platform—one that is accessible on any device, eliminating the need for bulky downloads. This means your senior team can effortlessly collaborate and provide approvals from anywhere, at any time.

The Experience

A platform designed to theoretically fulfill this use case wasn't enough; a live element was crucial, and the timeline was tight. In a mere eight weeks from Zaha signing on with MSquared, we were tasked with delivering a “Co-Create” live experience. This experience was timed to coincide with an exhibition for the new Beeah Headquarters in Sharjah and was to be online 24/7 for three months.

After a few days of ideation and collaboration, a scope was established:

Map and Configurator: Zaha Hadid Architects had previously developed their city map within Unreal Editor for Fortnite (UEFN). A key advantage of MSquared’s platform is its seamless compatibility, allowing for the remarkably straightforward porting of this existing map with minimal challenges. This ease of migration significantly accelerated development and demonstrated the platform’s user-friendliness for creators familiar with Unreal Engine environments.

Pixel Streaming First: The experience needed to be instantly accessible on any device with a web browser, requiring no downloads or powerful hardware. This was achieved by leveraging MSquared’s built-in pixel streaming capabilities. Unlike traditional game engines that demand significant client-side resources, MSquared seamlessly streams the interactive 3D environment directly to the user's browser. This pre-existing integration within the platform made the “Pixel Streaming First” approach remarkably straightforward to implement, ensuring broad accessibility and a frictionless user experience for all stakeholders.

Super-Fast Loading Times: Pixel streaming, while offering instant accessibility, can sometimes introduce noticeable loading times as the entire interactive environment is streamed to the user. MSquared addressed this by pioneering a pak embedding technology. This innovation intelligently prepackages and compresses critical initial assets directly within the pixel streaming client. When a user accesses the platform, these essential elements load almost instantaneously from their local device, significantly reducing the initial black screen or loading spinner experience. The remaining assets are then streamed in the background as needed, creating a perception of near-instant loading and ensuring a truly frictionless user experience from the very first click.

Big Screens: Our experiences are typically designed to run on standard desktop PC and mobile aspect ratios. However, the exhibition presented a unique challenge with its large, often irregularly shaped screens. This required dedicated development effort to ensure the seamless display and functionality of the experience across these unconventional dimensions.

Early on, it was apparent that we weren't just delivering a solution; we were building a foundation for the client on top of MSquared. A significant part of our work involved empowering their in-house engineering team to develop their desired level and gameplay mechanics, enabling them to build upon our robust technology.

So after a week or so of active development and coaching Zaha’s dev team, things were progressing smoothly. The Unreal Engine development was yielding positive results, and Zaha's vision was clearly taking shape. However, as is often the case, a seemingly minor request emerged, ultimately leading to...

Avatars Assemble!

“MSquared just announced a custom avatar creator—can we use it?”

That's a fair question, especially since we've said it's good to go. But anyone in production or engineering might immediately wince at such a big scope change to a project that’s otherwise on track. Luckily for the client, we aren’t your typical engineers or producers!

That being said, this ask would require the following work:

Custom Avatar Front End: Developing a bespoke user interface for the avatar creator, allowing users to intuitively select and customize their avatars.
Seamless Integration: Ensuring smooth communication and data transfer between the custom avatar front end, the MSquared platform, and the Unreal Engine experience to deliver a unified user journey.
Performance and Scalability Testing: Rigorous testing of the entire avatar system to guarantee optimal performance, low latency, and stability, even with a large number of concurrent users.

You know how this ends, though, right? Of course, we delivered everything needed on time, and the client had a super successful event. This project's success, much like the BBC event, stemmed from our exceptional technology and dedicated engineering team. It was also great to learn some lessons internally, as Zaha Hadid Architects were technically MSquared’s first avatar customer!

The Culmination of the Project

Looking back, we picked up a few key things that really shape how we tackle new projects:

Rapid Prototyping and Iteration: The ability to deliver a live “Co-Create” experience in just eight weeks, including a significant scope change for custom avatars, highlights the importance of agile development and rapid iteration.
Seamless Platform Compatibility: MSquared’s platform demonstrated significant value through its seamless compatibility with existing tools like Unreal Editor for Fortnite (UEFN), allowing for easy migration of client assets.
Accessibility and Performance First: Prioritizing “Pixel Streaming First” and developing pak embedding technology were crucial for ensuring instant accessibility on any device with super-fast loading times, enhancing the user experience.
Adaptability to Diverse Display Needs: The project highlighted the need for dedicated development to support unconventional display requirements, such as large and irregularly shaped screens for exhibitions.
Empowering Client Teams: A key part of MSquared’s success involved empowering the client’s in-house engineering team, enabling them to build upon the platform’s robust technology.
Managing Scope Changes Gracefully: The successful integration of a custom avatar creator late in the project, despite being a significant scope change, demonstrates effective project management and a flexible engineering approach.
Internal Learning and Innovation: The project provided valuable internal lessons, particularly as Zaha Hadid Architects became MSquared’s first avatar customer, driving future innovation.

These takeaways really drive home our commitment to building solid solutions for virtual worlds, and we're always pushing to innovate and go above and beyond for our partners.