Projectile Launcher Gizmo In Typescript!
I am super excited to share a TS Projectile Launcher Tutorial! 😄 I have covered this in Codeblocks so many times, but this is the first time in TS, definitely going to come back and expand on this in a future video, so let me know what you want to see in that video 🙂
🎥 On-Demand Video - Build-Along: Sky’s The Limit - Create Stunning Custom Skydomes
Use the newly released custom skydome feature to alter your world's environment and bring users to new places. This hands-on session covers everything from skybox composition basics to advanced implementation techniques. You'll learn to create your own custom skydomes and enhance GenAI-generated ones with custom maps. Plus, we'll walk through proper creation workflows and formatting techniques to ensure your skydomes perform flawlessly. Resource Materials attached to this post: Material MEO Material BR Sky Box Viewing Spheres
PSA: Asset Pool Gizmo transfers ownership to first child of the Asset.
As of 6/4/2025, when using an Asset Pool Gizmo to spawn a Template Asset, you need to manually transfer the ownership to other children or siblings. For example, in these 2 images. A needs to transfer ownership to B if you want B to be owned by the player.Custom Skydome Development Guide
Hey friends! I've created a development guide based on my personal experience with the new custom skydome feature in Worlds. This is intended to help you better understand how to make and import custom skydomes into your worlds! Find it here I have included the files I made using Blender if you wish to follow along with the process or you can use your own! *If you have questions or recommendations for amendments, please leave them here for me Hope this helps and happy creating! The skydome I made, for reference. It's a quickly thrown together desktop scene that is still a WIPHow to Import Sounds into Meta Horizons and a lil intro into spatial audio
With the v210 you can now drag and drop your own audio files directly into your world. This hits close to home for me, I run a synthesizer-focused channel where I explore sound design and create assets for immersive technologies. Most days I’m deep in the weeds designing sounds for VR, AR, and interactive spaces. With this update, I can now bring that workflow directly into Horizon Worlds, blending custom synthesis with interactive design. There’s still a bit of housekeeping with naming and managing assets, but the creative possibilities this unlocks got me excited. From ambient beds and sound effects to fully spatial audio cues, it’s now possible to craft rich, layered sound environments that transform how people experience your world.
Customizable spatial CUI panel script
I’m presenting CUI_Spatial, a minimalist and customizable spatial UI panel script for Horizon Worlds. This component allows you to display information, images. perfect for enhancing the user experience in your worlds. The script is documented in both English and Spanish to make integration easier for creators of all levels. You just need to attach it to a CUI gizmo in your world and configure its properties to fit your needs. It's ideal for displaying messages, instructions, logos, or any relevant content in a clean and visual way. I hope this resource is helpful for the community and contributes to improving the quality of experiences in Horizon Worlds! (Apologies if I didn’t format the script properly in the forum I’m still not exactly sure how to do it for TS.) /* CUI_Spatial - Minimal custom UI panel in spatial mode Author: Vicentekk Description / Descripción: This component provides a customizable 3D information panel for Horizon Worlds in spatial mode. You must attach this script to a CUI gizmo that is present in your world for it to function. Este componente proporciona un panel de información 3D personalizable para Horizon Worlds en modo espacial. Debes adjuntar este script a un gizmo CUI que esté presente en tu mundo para que funcione. Example usage / Ejemplo de uso: */ import * as hz from 'horizon/core'; import { UIComponent, View, Text, Image, ImageSource } from 'horizon/ui'; // This script defines a minimal and robust UI panel for Horizon Worlds // Este script define un panel UI mÃnimo y robusto para Horizon Worlds class CUI_Spatial extends UIComponent<typeof CUI_Spatial> { static propsDefinition = { // Text and content / Texto y contenido panelTitle: { type: hz.PropTypes.String, default: 'Info Panel', displayName: 'Panel Title / TÃtulo del Panel' }, descriptionText: { type: hz.PropTypes.String, default: 'Description Text', displayName: 'Description / Descripción' }, showTitle: { type: hz.PropTypes.Boolean, default: true, displayName: 'Show Title / Mostrar TÃtulo' }, showDescription: { type: hz.PropTypes.Boolean, default: true, displayName: 'Show Description / Mostrar Descripción' }, // Colors and styles / Colores y estilos backgroundColor: { type: hz.PropTypes.String, default: '#222C', displayName: 'Background Color / Color de Fondo' }, borderRadius: { type: hz.PropTypes.Number, default: 12, displayName: 'Border Radius / Radio de Bordes' }, borderColor: { type: hz.PropTypes.String, default: '#FFFFFF', displayName: 'Border Color / Color de Borde' }, borderWidth: { type: hz.PropTypes.Number, default: 2, displayName: 'Border Width / Grosor de Borde' }, titleColor: { type: hz.PropTypes.String, default: '#FFFFFF', displayName: 'Title Color / Color del TÃtulo' }, descriptionColor: { type: hz.PropTypes.String, default: '#CCCCCC', displayName: 'Description Color / Color de la Descripción' }, // Typography / TipografÃa titleFontSize: { type: hz.PropTypes.Number, default: 28, displayName: 'Title Font Size / Tamaño de Fuente del TÃtulo' }, descriptionFontSize: { type: hz.PropTypes.Number, default: 18, displayName: 'Description Font Size / Tamaño de Fuente de la Descripción' }, // Dimensions / Dimensiones width: { type: hz.PropTypes.Number, default: 400, displayName: 'Panel Width / Ancho del Panel' }, height: { type: hz.PropTypes.Number, default: 200, displayName: 'Panel Height / Alto del Panel' }, padding: { type: hz.PropTypes.Number, default: 20, displayName: 'Inner Padding / Padding Interno' }, // Background image and logo / Imagen de fondo y logo backgroundImage: { type: hz.PropTypes.Asset, default: null, displayName: 'Background Image / Imagen de Fondo' }, showLogo: { type: hz.PropTypes.Boolean, default: false, displayName: 'Show Logo / Mostrar Logo' }, logoImage: { type: hz.PropTypes.Asset, default: null, displayName: 'Logo' }, logoSize: { type: hz.PropTypes.Number, default: 64, displayName: 'Logo Size / Tamaño del Logo' }, }; // This method builds the UI tree to be displayed in the panel // Este método construye el árbol de UI que se mostrará en el panel initializeUI() { const panelStyle = { flexDirection: 'column' as const, alignItems: 'center' as const, justifyContent: 'center' as const, padding: this.props.padding, backgroundColor: this.props.backgroundColor, borderRadius: this.props.borderRadius, width: this.props.width, height: this.props.height, borderColor: this.props.borderColor, borderWidth: this.props.borderWidth, }; const children = []; // Background image (if exists) / Imagen de fondo (si existe) if (this.props.backgroundImage) { children.push( Image({ source: ImageSource.fromTextureAsset(this.props.backgroundImage), style: { position: 'absolute', width: this.props.width, height: this.props.height, left: 0, top: 0, borderRadius: this.props.borderRadius, zIndex: 0, }, }) ); } // Logo (if enabled) / Logo (si está habilitado) if (this.props.showLogo && this.props.logoImage) { children.push( Image({ source: ImageSource.fromTextureAsset(this.props.logoImage), style: { width: this.props.logoSize, height: this.props.logoSize, marginBottom: 12, zIndex: 1 }, }) ); } // Title (if enabled) / TÃtulo (si está habilitado) if (this.props.showTitle) { children.push( Text({ text: this.props.panelTitle, style: { fontSize: this.props.titleFontSize, color: this.props.titleColor, textAlign: 'center', marginBottom: 8 }, }) ); } // Description (if enabled) / Descripción (si está habilitada) if (this.props.showDescription) { children.push( Text({ text: this.props.descriptionText, style: { fontSize: this.props.descriptionFontSize, color: this.props.descriptionColor, textAlign: 'center', marginBottom: 12 }, }) ); } return View({ style: panelStyle, children, }); } } hz.Component.register(CUI_Spatial);
