Skip to content

feat: Add UI validation tool to detect common layout issues #63

@kevinswint

Description

@kevinswint

Description

Add a tool that analyzes the UI hierarchy and reports potential issues before they become visible bugs.

Proposed Tool

validate_ui

- path: string (optional, defaults to all ScreenGuis)

Returns:
- overlapping_elements: pairs of elements that visually overlap
- offscreen_elements: elements partially or fully outside viewport
- pixel_positioning_warnings: elements using Offset without Scale
- missing_constraints: containers without UISizeConstraint
- anchor_mismatch: elements where AnchorPoint doesn't match Position

Use Case

Catch layout bugs programmatically instead of requiring visual inspection. Especially useful for mobile where Claude cannot see the Device Emulator.

Context

When building responsive UI, common mistakes include:

  • Using pixel positioning (UDim2.new(0, 100, 0, 50)) instead of scale
  • Forgetting UISizeConstraint causing elements to grow/shrink unexpectedly
  • Mismatched AnchorPoint and Position causing elements to appear in wrong locations
  • Elements that work on desktop but overflow on mobile screens

A validation tool would catch these issues without requiring manual visual inspection.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions