development-guide

Shape components

development-guide

Three dimensional scenes in Decentraland are based on the Entity-Component model, where everything in a scene is an entity, and each entity can include components that shape its characteristics and functionality. The rendered shape of an entity is determined by what component it uses. Primitive shapes # Several basic shapes, often called primitives, can be added to an entity by giving the entity a MeshRenderer component. The following shapes are available. ...

Make your scene discoverable

December 21, 2022
development-guide

Decentraland offers a vast array of content. You must ensure your scene stands out and connects with its audience. Here are some key strategies: Social media: Share your scene on social media platforms to increase its visibility. Include multimedia content to tempt more players, don’t just add a link and text. Decentraland’s Discord server is also an excellent platform to engage with the community. Categories and tags: Utilize categories and tags to help players find your scene through the search feature on the Decentraland map. ...

UI Button events

October 28, 2022
development-guide

To make a button in your UI, create a Button UI element. The button must have the following: value: A string with the text to display on the button. It can also have: onMouseDown: A callback function that runs every time the user pushes the pointer button on the entity. 📔 Note: To click on a UI component, players must first unlock the cursor from the view control. They do this by pressing the right mouse button and keeping it pressed, or by hitting Esc. ...

UI Positioning

October 28, 2022
development-guide

For all kinds of UI content, use the uiTransform component to set the size, position, and other properties related to the entity’s alignment. The uiTransform component works in the screen’s 2d space very much like the Transform component works in the the scene’s 3D space. import { ReactEcsRenderer } from '@dcl/sdk/react-ecs' ReactEcsRenderer.setUiRenderer(() => ( <UiEntity uiTransform={{ width: '200px', height: '100px', justifyContent: 'center', alignItems: 'center', }} uiBackground={{ color: Color4.Green() }} /> )) Positioning properties # The alignment of UI entities is based on the Flexbox alignment model. ...

UI Text

October 28, 2022
development-guide

Ad text to your UI by creating a Label entity. A Label entity has the following fields that can be configured: value: The string to display fontSize: The size of the text, as a number. NOTE: The fontSize is not affected by the size of its entity or parent entities. color: The color of the text, as a Color4 . font: The font to use, taking a value from the Font enum. ...

Troubleshooting

June 29, 2022
development-guide

❗Warning: This is a legacy page covering functionality with the old SDK version 6. See the latest version of this topic here . Issues when running preview # Issue: Can’t run any scene preview, error message says mentions Permissions denied or EACCES # Your operating system doesn’t allow you edit permissions on the folder where you want to run the project. When running the scene, some dependencies need to be installed, but it’s forbidden. ...

Troubleshooting

June 29, 2022
development-guide

Issues when running preview # Issue: Can’t run any scene preview, error message says mentions Permissions denied or EACCES # Your operating system doesn’t allow you edit permissions on the folder where you want to run the project. When running the scene, some dependencies need to be installed, but it’s forbidden. You need to configure the folder’s permissions to allow your Windows/Mac/Linux user account to edit files in them. ...

Create a library

February 8, 2022
development-guide

Libraries are a great way to share solutions to common problems. Complex challenges can be approached once, the solutions encapsulated into a library, and whenever they come up you just need to write one line of code. By sharing libraries with the community, we can make the productivity of all creators grow exponentially. Currently, these libraries in the Examples page are available for all to use. We encourage you to create and share your own as well. ...

Workspaces

February 8, 2022
development-guide

Run multiple Decentraland projects in preview by grouping these into a workspace. Run multiple adjacent scenes to see how they fit, or also run multiple smart wearables together to see how they interact with each other and with different scenes. Running multiple projects in a workspace provides a much more complete testing alternative, to ensure different content works well together. Create a workspace # Create a top-level folder to hold the workspace. ...

Modifier areas

September 24, 2020
development-guide

❗Warning: This is a legacy page covering functionality with the old SDK version 6. See the latest version of this topic here . Avatar Modifiers # Avatars behave and look consistently throughout Decentraland as they walk across scenes. However, you can add an AvatarModifierArea to a region of your scene to affect how player avatars behave when they enter that area. ❗Warning Please limit the amount of AvatarModifierAreas you use in your scene to just a couple. ...