Getting Started

In-Game Setup

1. Place a Computer or Console
2. Craft/spawn a ScriptedScreens Circuitboard (Lua Chip) or Motherboard (Lua Chip)
3. Insert an Integrated Circuit (Lua) into the board's built-in chip slot
4. Insert the board into the computer
5. Open the IC10 Editor and paste a Lua script

Tablet Setup

For tablets, use a Cartridge (Lua Chip) or Cartridge (Lua Chip, Wireless). Insert the Lua chip into the cartridge's slot, then insert the cartridge into a tablet.

Programmable Visor Setup

For visor HUDs, use Programmable Visor Glasses (crafted at the Tool Manufactory Tier 2) with an Integrated Circuit (Lua) inserted into the visor's chip slot. Visor scripts use ss.hud instead of ss.ui, and the HUD only runs while the visor is powered and worn in the glasses slot.

If you are building for visors, read Programmable Visor HUDs next - that page covers ss.client_overlay(), safe-area helpers, drag behavior, and the visor example scripts.

Wiring Devices to Pins

If your script reads or writes external devices (dials, lights, sensors):

1. Use a screwdriver on the bolt on the side of the console to open the configuration screen, or on a Computer insert a Configuration Disk. Vanilla Data Disks do not enter config mode - use them for portable ic.disk storage instead.
2. Assign devices to pins d0 through d5
3. Your script can use ic.read(0, ...) / ic.write(0, ...) to talk to whatever device you assigned to d0, etc.

Your First UI

local ui = ss.ui.surface("main")
ss.ui.activate("main")

-- Get screen dimensions (physical screen size, or 256x256 fallback)
local size = ui:size()
local W, H = size.w, size.h

ui:clear()

-- Background
ui:element({
    id = "bg",
    type = "panel",
    rect = { unit = "px", x = 0, y = 0, w = W, h = H },
    style = { bg = "#0F172A" }
})

-- Title
ui:element({
    id = "title",
    type = "label",
    rect = { unit = "px", x = 20, y = 10, w = W - 40, h = 40 },
    props = { text = "SCRIPTEDSCREENS" },
    style = { font_size = 24, color = "#22C55E", align = "left" }
})

-- Button
ui:element({
    id = "btn",
    type = "button",
    rect = { unit = "px", x = 20, y = H - 60, w = 180, h = 40 },
    props = { text = "CLICK ME" },
    style = { bg = "#334155", text = "#FFFFFF" },
    on_click = function(playerName)
        print("Clicked by: " .. tostring(playerName))
    end
})

ui:commit()

Understanding the Script

Surface

A surface is a named UI view. You create one with ss.ui.surface("name") and activate it with ss.ui.activate("name"):

local ui = ss.ui.surface("main")
ss.ui.activate("main")

Elements

An element is a UI widget identified by a unique id. You define it with a table containing type, rect, props, and style:

ui:element({
    id = "title",           -- Unique identifier
    type = "label",         -- Element type
    rect = { unit = "px", x = 20, y = 10, w = 200, h = 30 },  -- Position/size
    props = { text = "Hello" },     -- Content properties
    style = { font_size = 18, color = "#FFFFFF" }  -- Visual styling
})

Commit

Changes are batched. After creating/updating elements, call ui:commit() to push them to the screen.

Rect / Layout Units

• unit = "px" - Pixels (top-left origin, Y increases downward)
• unit = "%" / "percent" - Percentages (0-100) of screen size

Next Steps

• Surfaces & Views - Multi-page UIs
• Programmable Visor HUDs - Wearer-tied HUD overlays with ss.hud
• Elements - Element handles and updates
• Display Elements - Full element type reference
• Example Gallery - Copy-paste examples