Code
Build custom mechanics, effects, physics, and shaders with a Code Layer, generated by INTELLIGENCE or written by hand.
The Code Layer runs custom code to create mechanics, effects, and interactive experiences that PLAY's standard layers can't. It's the layer behind Feature Generation: when you ask INTELLIGENCE to build a custom feature, it creates a Code Layer in your project.
Most Code Layers are generated by INTELLIGENCE, so you rarely need to read or write the code yourself. You adjust the feature through controls in the Properties panel, swap its art like any other layer, and ask INTELLIGENCE for changes. If you want full control, you can also write the code by hand.
Creating a Code Layer
Ask INTELLIGENCE (recommended). Describe the feature you want. INTELLIGENCE writes the code, adds any art and sounds it needs, and places the layer in your current scene. See Feature Generation.
Add one manually. Click the + button to open the Add Layer menu and choose Code, or press the
Ohotkey. PLAY adds an empty layer named New Code that fills the artboard. It draws nothing until you add code in the Code Editor.
Properties Panel
A Code Layer's Properties panel has these sections, top to bottom:
Transform sets the layer's position and size.
Code holds the feature's controls and the Code Editor button. See below.
Progression holds the layer's Triggers and Variables. See Progression.
Timeline sets when the layer starts and ends in the scene.
Animations adds Enter and Exit animations.
The Code Layer itself has no Interactions or Effects section. Interactions belong to the layers inside it. See Layers Inside a Code Layer.
Feature Controls
When INTELLIGENCE builds a feature, it adds a control to the Code section for each value worth adjusting: colors, sizes, speeds, counts, sounds, and so on. Change a value and the layer updates live on the canvas, without re-prompting.
Color picker
Colors. Solid colors only.
Slider or number field
Sizes, speeds, counts, durations, intensities
Toggle
Turning part of the feature on or off
Text field
Words the feature displays
Dropdown
Choosing between preset options
Sound module
Sound effects. See Sound Effects.
Hover a control to see a description of what it does. Controls are created by INTELLIGENCE. To add, remove, or rename one, ask INTELLIGENCE.
Sound Effects
A Code Layer can play its own sound effects, like a pop on every tap or a chime when a goal is reached. Ask INTELLIGENCE to add or change a sound, or attach a sound from your Asset Library to the chat and ask it to use that one.
Each sound appears as a sound module in the Code section, showing the file name. Click the module's settings button to open Audio Properties:
Preview the sound with the play button.
Select a different sound from the Asset Library, or delete the current one.
Volume sets how loud the sound plays, from 0 to 100%.
Sounds are always added in their optimized version. They're listed under Code in the Asset Panel, where you can also replace them.
Shaders
Shaders change how a layer's pixels are drawn. They open up looks that standard layers can't produce: a ripple on tap, a heat shimmer, a glow, a dissolve, or a color grade that cycles over time.
Ask INTELLIGENCE for the effect you want. It can apply a shader to an individual image, text, or shape inside the Code Layer, or to the whole layer. Shaders can respond to taps, pointer movement, progression, and time.
Values like speed, intensity, radius, and color appear as feature controls in the Code section, so you can fine-tune the effect live. Shaders render the same way in the editor, in Preview, and in the exported playable.
Physics
Code Layers include a built-in 2D physics engine for mechanics like falling objects, bouncing, stacking, and slingshots. Ask INTELLIGENCE for the behavior you want, like "drop fruit into a basket and score when they land".
Physics is set up in code, with no separate physics panel. INTELLIGENCE exposes values like gravity, bounciness, and the number of objects as feature controls. The physics bodies take their size from the layers inside the Code Layer, so resizing one of those layers changes how it collides.
Layers Inside a Code Layer
The images, text, and shapes a feature uses are real layers inside the Code Layer. To work with them, click Edit on the Code Layer in the Layers panel, or double-click it on the canvas.
In edit mode:
Swap art. Select an image or shape and use Replace to swap in your own asset. Text layers can be restyled like any other text.
Resize. Width and height are editable. Position and rotation are controlled by the code, so those fields are locked.
Add layers. You can add Image, Text, and Shape layers. A new layer only appears in the running feature once the code uses it, so ask INTELLIGENCE to work it in.
While you're in edit mode, the feature's own drawing is hidden and each layer is shown at its configured size.
Interactions and Analytics
Taps and swipes in a Code Layer are set on the layers inside it. Select one of those layers to see its Interactions section.
Trigger Code interactions are added by INTELLIGENCE. They mark an input the code responds to itself, like a tap that pops a balloon. These rows are locked, since the code handles the response.
Standard actions can be added to the same layers, like Start Next Scene or Launch URL. Code Layer children support Single Tap, Double Tap, and the Swipe gestures.
Every interaction on a layer inside a Code Layer is tracked in Analytics, credited to that layer. CTA actions like Launch URL are also tracked as CTA clicks. To check what a feature reports before you export, open the Analytics Event Monitor in Preview.
Progression
A Code Layer can track its own progress and fire actions when it reaches a goal, using the same Triggers and Variables system as Game Mechanics. The Progression section sits below the Code section.
Variables are created by INTELLIGENCE along with the feature, like the number of items collected. The tab shows each variable and its start value. To add or change a variable, ask INTELLIGENCE.
Triggers are fully editable. Click + to add one, pick one of the layer's variables, set a condition, and choose an action. INTELLIGENCE can also add triggers for you. See Triggers.
A Code Layer's variables can be shown with a Progress Bar or Progress Text in the same scene. They're listed under the Code Layer's name in the Track dropdown. They aren't available in Conditionals.
A Code Layer can't read or change your project's own variables, or another game's.
Code Editor
The Code Editor button in the Code section opens the code for viewing or editing. It's there for advanced authors. Most changes are easier to make by asking INTELLIGENCE.
Reference panel. A sidebar lists everything the code can use, including the physics and shader tools, the layers inside the Code Layer, and the feature controls. Click Hide Reference to close it.
Autocomplete. Suggestions appear as you type, including the names of the layers and controls in this Code Layer.
Save checks the code by running it briefly. If it fails, an error appears under the editor and nothing is saved. If it passes, the code is saved and the editor closes.
Cancel closes the editor and discards your changes.
Assets and File Size
Everything a Code Layer uses, its images, text, shapes, and sounds, is listed under Code in the Asset Panel, where you can replace images, shapes, and sounds. The project's file size breakdown shows these under Code Assets.
Duplicating or copying a Code Layer copies its code, layers, sounds, and progression together.
Last updated