From apple-kit-skills
Build multiplayer spatial board games on visionOS using TabletopKit: configure tables/boards/equipment, manage seats/turns, sync state via Group Activities, render with RealityKit.
npx claudepluginhub dpearson2699/swift-ios-skills --plugin all-ios-skillsThis skill uses the workspace's default tool permissions.
Create multiplayer spatial board games on a virtual table surface using
Generates design tokens/docs from CSS/Tailwind/styled-components codebases, audits visual consistency across 10 dimensions, detects AI slop in UI.
Records polished WebM UI demo videos of web apps using Playwright with cursor overlay, natural pacing, and three-phase scripting. Activates for demo, walkthrough, screen recording, or tutorial requests.
Delivers idiomatic Kotlin patterns for null safety, immutability, sealed classes, coroutines, Flows, extensions, DSL builders, and Gradle DSL. Use when writing, reviewing, refactoring, or designing Kotlin code.
Create multiplayer spatial board games on a virtual table surface using TabletopKit. Handles game layout, equipment interaction, player seating, turn management, state synchronization, and RealityKit rendering. visionOS 2.0+ only. Targets Swift 6.3.
TabletopKit is exclusive to visionOS. It requires visionOS 2.0+. Multiplayer features using Group Activities require visionOS 2.0+ devices on a FaceTime call. The Simulator supports single-player layout testing but not multiplayer.
import TabletopKit in source files that define game logic.import RealityKit for entity-based rendering.| Type | Role |
|---|---|
TabletopGame | Central game manager; owns setup, actions, observers, rendering |
TableSetup | Configuration object passed to TabletopGame init |
Tabletop / EntityTabletop | Protocol for the table surface |
Equipment / EntityEquipment | Protocol for interactive game pieces |
TableSeat / EntityTableSeat | Protocol for player seat positions |
TabletopAction | Commands that modify game state |
TabletopInteraction | Gesture-driven player interactions with equipment |
TabletopGame.Observer | Callback protocol for reacting to confirmed actions |
TabletopGame.RenderDelegate | Callback protocol for visual updates |
EntityRenderDelegate | RealityKit-specific render delegate |
Build a game in three steps: define the table, configure the setup, create the
TabletopGame instance.
import TabletopKit
import RealityKit
let table = GameTable()
var setup = TableSetup(tabletop: table)
setup.add(seat: PlayerSeat(index: 0, pose: seatPose0))
setup.add(seat: PlayerSeat(index: 1, pose: seatPose1))
setup.add(equipment: GamePawn(id: .init(1)))
setup.add(equipment: GameDie(id: .init(2)))
setup.register(action: MyCustomAction.self)
let game = TabletopGame(tableSetup: setup)
game.claimAnySeat()
Call update(deltaTime:) each frame if automatic updates are not enabled via
the .tabletopGame(_:parent:automaticUpdate:) modifier. Read state safely with
withCurrentSnapshot(_:).
Conform to EntityTabletop to define the playing surface. Provide a shape
(round or rectangular) and a RealityKit Entity for visual representation.
struct GameTable: EntityTabletop {
var shape: TabletopShape
var entity: Entity
var id: EquipmentIdentifier
init() {
entity = try! Entity.load(named: "table/game_table", in: contentBundle)
shape = .round(entity: entity)
id = .init(0)
}
}
Use factory methods on TabletopShape:
// Round table from dimensions
let round = TabletopShape.round(
center: .init(x: 0, y: 0, z: 0),
radius: 0.5,
thickness: 0.05,
in: .meters
)
// Rectangular table from entity
let rect = TabletopShape.rectangular(entity: tableEntity)
All interactive game objects conform to Equipment (or EntityEquipment for
RealityKit-rendered pieces). Each piece has an id (EquipmentIdentifier) and
an initialState property.
Choose the state type based on the equipment:
| State Type | Use Case |
|---|---|
BaseEquipmentState | Generic pieces, pawns, tokens |
CardState | Playing cards (tracks faceUp / face-down) |
DieState | Dice with an integer value |
RawValueState | Custom data encoded as UInt64 |
// Pawn -- uses BaseEquipmentState
struct GamePawn: EntityEquipment {
var id: EquipmentIdentifier
var initialState: BaseEquipmentState
var entity: Entity
init(id: EquipmentIdentifier) {
self.id = id
self.entity = try! Entity.load(named: "pieces/pawn", in: contentBundle)
self.initialState = BaseEquipmentState(
parentID: .init(0), seatControl: .any,
pose: .identity, entity: entity
)
}
}
// Card -- uses CardState (tracks faceUp)
struct PlayingCard: EntityEquipment {
var id: EquipmentIdentifier
var initialState: CardState
var entity: Entity
init(id: EquipmentIdentifier) {
self.id = id
self.entity = try! Entity.load(named: "cards/card", in: contentBundle)
self.initialState = .faceDown(
parentID: .init(0), seatControl: .any,
pose: .identity, entity: entity
)
}
}
// Die -- uses DieState (tracks integer value)
struct GameDie: EntityEquipment {
var id: EquipmentIdentifier
var initialState: DieState
var entity: Entity
init(id: EquipmentIdentifier) {
self.id = id
self.entity = try! Entity.load(named: "dice/d6", in: contentBundle)
self.initialState = DieState(
value: 1, parentID: .init(0), seatControl: .any,
pose: .identity, entity: entity
)
}
}
Restrict which players can interact with a piece via seatControl:
.any -- any player.restricted([seatID1, seatID2]) -- specific seats only.current -- only the seat whose turn it is.inherited -- inherits from parent equipmentEquipment can be parented to other equipment. Override layoutChildren(for:visualState:)
to position children. Return one of:
.planarStacked(layout:animationDuration:) -- cards/tiles stacked vertically.planarOverlapping(layout:animationDuration:) -- cards fanned or overlapping.volumetric(layout:animationDuration:) -- full 3D layoutSee references/tabletopkit-patterns.md for card fan, grid, and overlap layout examples.
Conform to EntityTableSeat and provide a pose around the table:
struct PlayerSeat: EntityTableSeat {
var id: TableSeatIdentifier
var initialState: TableSeatState
var entity: Entity
init(index: Int, pose: TableVisualState.Pose2D) {
self.id = TableSeatIdentifier(index)
self.entity = Entity()
self.initialState = TableSeatState(pose: pose, context: 0)
}
}
Claim a seat before interacting: game.claimAnySeat(), game.claimSeat(matching:),
or game.releaseSeat(). Observe changes via TabletopGame.Observer.playerChangedSeats.
Use TabletopAction factory methods to modify game state:
// Move equipment to a new parent
game.addAction(.moveEquipment(matching: pieceID, childOf: targetID, pose: newPose))
// Flip a card face-up
game.addAction(.updateEquipment(card, faceUp: true))
// Update die value
game.addAction(.updateEquipment(die, value: 6))
// Set whose turn it is
game.addAction(.setTurn(matching: TableSeatIdentifier(1)))
// Update a score counter
game.addAction(.updateCounter(matching: counterID, value: 100))
// Create a state bookmark (for undo/reset)
game.addAction(.createBookmark(id: StateBookmarkIdentifier(1)))
For game-specific logic, conform to CustomAction:
struct CollectCoin: CustomAction {
let coinID: EquipmentIdentifier
let playerID: EquipmentIdentifier
init?(from action: some TabletopAction) {
// Decode from generic action
}
func validate(snapshot: TableSnapshot) -> Bool {
// Return true if action is legal
true
}
func apply(table: inout TableState) {
// Mutate state directly
}
}
Register custom actions during setup:
setup.register(action: CollectCoin.self)
setup.add(counter: ScoreCounter(id: .init(0), value: 0))
// Update: game.addAction(.updateCounter(matching: .init(0), value: 42))
// Read: snapshot.counter(matching: .init(0))?.value
Save and restore game state for undo/reset:
game.addAction(.createBookmark(id: StateBookmarkIdentifier(1)))
game.jumpToBookmark(matching: StateBookmarkIdentifier(1))
Return an interaction delegate from the .tabletopGame modifier to handle
player gestures on equipment:
.tabletopGame(game.tabletopGame, parent: game.renderer.root) { value in
if game.tabletopGame.equipment(of: GameDie.self, matching: value.startingEquipmentID) != nil {
return DieInteraction(game: game)
}
return DefaultInteraction(game: game)
}
class DieInteraction: TabletopInteraction.Delegate {
let game: Game
func update(interaction: TabletopInteraction) {
switch interaction.value.phase {
case .started:
interaction.setConfiguration(.init(allowedDestinations: .any))
case .update:
if interaction.value.gesture?.phase == .ended {
interaction.toss(
equipmentID: interaction.value.controlledEquipmentID,
as: .cube(height: 0.02, in: .meters)
)
}
case .ended, .cancelled:
break
}
}
func onTossStart(interaction: TabletopInteraction,
outcomes: [TabletopInteraction.TossOutcome]) {
for outcome in outcomes {
let face = outcome.tossableRepresentation.face(for: outcome.restingOrientation)
interaction.addAction(.updateEquipment(
die, rawValue: face.rawValue, pose: outcome.pose
))
}
}
}
Dice physics shapes: .cube (d6), .tetrahedron (d4), .octahedron (d8),
.decahedron (d10), .dodecahedron (d12), .icosahedron (d20), .sphere.
All take height:in: (or radius:in: for sphere) and optional restitution:.
Start interactions from code: game.startInteraction(onEquipmentID: pieceID).
See references/tabletopkit-patterns.md for group toss, predetermined outcomes, interaction acceptance/rejection, and destination restriction patterns.
Conform to EntityRenderDelegate to bridge state to RealityKit. Provide a
root entity. TabletopKit automatically positions EntityEquipment entities.
class GameRenderer: EntityRenderDelegate {
let root = Entity()
func onUpdate(timeInterval: Double, snapshot: TableSnapshot,
visualState: TableVisualState) {
// Custom visual updates beyond automatic positioning
}
}
Connect to SwiftUI with .tabletopGame(_:parent:automaticUpdate:) on a
RealityView:
struct GameView: View {
let game: Game
var body: some View {
RealityView { content in
content.entities.append(game.renderer.root)
}
.tabletopGame(game.tabletopGame, parent: game.renderer.root) { value in
GameInteraction(game: game)
}
}
}
Debug outlines: game.tabletopGame.debugDraw(options: [.drawTable, .drawSeats, .drawEquipment])
TabletopKit integrates directly with GroupActivities for FaceTime-based
multiplayer. Define a GroupActivity, then call coordinateWithSession(_:).
TabletopKit automatically synchronizes all equipment state, seat assignments,
actions, and interactions. No manual message passing required.
import GroupActivities
struct BoardGameActivity: GroupActivity {
var metadata: GroupActivityMetadata {
var meta = GroupActivityMetadata()
meta.type = .generic
meta.title = "Board Game"
return meta
}
}
@Observable
class GroupActivityManager {
let tabletopGame: TabletopGame
private var sessionTask: Task<Void, Never>?
init(tabletopGame: TabletopGame) {
self.tabletopGame = tabletopGame
sessionTask = Task { @MainActor in
for await session in BoardGameActivity.sessions() {
tabletopGame.coordinateWithSession(session)
}
}
}
deinit { tabletopGame.detachNetworkCoordinator() }
}
Implement TabletopGame.MultiplayerDelegate for joinAccepted(),
playerJoined(_:), didRejectPlayer(_:reason:), and
multiplayerSessionFailed(reason:). See
references/tabletopkit-patterns.md for custom
network coordinators and arbiter role management.
claimAnySeat() or claimSeat(_:)
before interacting with equipment. Without a seat, actions are rejected.TabletopAction or CustomAction. Directly modifying equipment properties
bypasses synchronization.setup.register(action:) before creating the TabletopGame. Unregistered
actions are silently dropped.actionWasRolledBack(_:snapshot:) to revert UI state.parentID in state must reference a
valid equipment ID (typically the table or a container). An invalid parent
causes the piece to disappear.outcome.tossableRepresentation.face(for: outcome.restingOrientation) rather
than generating a random value. The physics simulation determines the result.import TabletopKit present; target is visionOS 2.0+TableSetup created with a Tabletop/EntityTabletop conforming typeEquipment or EntityEquipment with correct state typeclaimAnySeat() / claimSeat(_:) called at game startsetup.register(action:)TabletopGame.Observer implemented for reacting to confirmed actionsEntityRenderDelegate or RenderDelegate connected.tabletopGame(_:parent:automaticUpdate:) modifier on RealityViewGroupActivity defined and coordinateWithSession(_:) called for multiplayerdebugDraw) disabled before release