TechPrufer
Get started
Shopify
Shopify logoShopify · Feature trail

Browser-based Virtual Hangout Platform

1 post · Jun 2022

What this trail covers

Shopify developed and enhanced Shopify Party, a browser-based internal tool designed to make virtual hangouts more engaging and fun. The platform allows employees to use 3D avatars to explore virtual worlds and connect through games, moving beyond traditional video chat fatigue. Key technical aspects include leveraging Unity WebGL for 3D rendering and Normcore for peer-to-peer networking and synchronized game state. Development focused on non-prescriptive gameplay, hop-in/hop-off friendliness, and ease of learning. Customization options for avatars were implemented through texture application and shaders. The project was completed in three months by utilizing third-party assets and custom character design.

All Shopify trails
  1. How We Built Shopify Party - ShopifyThis post details the technical implementation of Shopify Party, a browser-based virtual hangout platform. It covers the game design principles (non-prescriptive gameplay, hop-in/hop-off friendly, easy to learn) and the tech stack used. Key technical contributions include: - **Unity WebGL:** Used for 3D rendering and exporting to WebGL via WebAssembly, leveraging Unity's editor, asset management, and built-in physics. - **Normcore:** Implemented as the networking framework, utilizing a peer-to-peer model for game state synchronization, VoIP, and networked physics. It efficiently syncs state by pushing updates to connected clients and interpolating positions for smooth movement. - **Room Time Synchronization:** Used to synchronize non-player-controlled objects (e.g., moving platforms) by making their movement a function of synchronized room time, ensuring consistency across clients. - **Character Customization:** Achieved through applying textures to a base 3D model, combining outfit textures within a single shader for performance, and enabling user-uploaded designs. - **Asset Utilization:** Leveraged third-party assets from the Unity Asset Store for props and environments to accelerate development.