glyph-motion.slate-app.online
glyph-motion.slate-app.online
live
Unverified (seed import)
Media & Personal
10 tools
imperative implementation
Glyph Motion Studio for WebMCP — direct motion in natural language, keep every keyframe under your control.
First seen 2026-11-05 · Last seen 2026-11-05 · Source: webmcp.com
Answer 3 · Act 7 · Transact 0 · Score: Not yet scored
Tool inspector
preview_timeline_patch
act
imperative
Validate a set of timeline operations, stage them as an ephemeral preview, render it on the visible canvas (autoplays unless reduced motion is on), and return diagnostics. Does NOT change the committed scene — the user judges the motion first. Requires baseRevision from get_scene (REVISION_CONFLICT if the scene moved). Prefer small targeted patches (update_step) over rebuilding everything. Do not stack multiple from tweens on the same target property: update the existing entrance or use fromTo for later motion. Limits: 24 steps, 12s total, 8s per tween. Then call apply_timeline_patch with the returned previewId to keep it.
Page: /?scene=glyph-hero-scene
Input schema
| Property | Type | Required | Description |
|---|---|---|---|
baseRevision |
integer | yes | sceneRevision from get_scene |
intent |
string | no | One short user-facing sentence describing the creative goal (shown in the activity log) |
operations |
array | yes | — |
autoplay |
boolean | no | Play the preview immediately (default true) |
Raw JSON schema
{
"type": "object",
"properties": {
"baseRevision": {
"type": "integer",
"minimum": 0,
"description": "sceneRevision from get_scene"
},
"intent": {
"type": "string",
"maxLength": 200,
"description": "One short user-facing sentence describing the creative goal (shown in the activity log)"
},
"operations": {
"type": "array",
"minItems": 1,
"maxItems": 32,
"items": {
"description": "One domain operation on the timeline.",
"oneOf": [
{
"type": "object",
"properties": {
"op": {
"const": "add_step"
},
"step": {
"type": "object",
"properties": {
"id": {
"type": "string",
"pattern": "^[A-Za-z0-9][A-Za-z0-9_-]{0,63}$",
"description": "Unique, stable, human-readable id, e.g. \"symbol-enter\""
},
"label": {
"type": "string",
"maxLength": 80
},
"target": {
"type": "object",
"description": "Semantic target. type \"id\" = one element by its id; \"group\" = every member of a semantic group (e.g. \"accents\"); \"role\" = every element with that role. No CSS selectors.",
"properties": {
"type": {
"type": "string",
"enum": [
"id",
"role",
"group"
]
},
"value": {
"type": "string",
"pattern": "^[A-Za-z0-9][A-Za-z0-9_-]{0,63}$",
"description": "Element id, group id, or one of: primary, secondary, accent, utility"
},
"scopeToId": {
"type": "string",
"pattern": "^[A-Za-z0-9][A-Za-z0-9_-]{0,63}$",
"description": "Scene element id the target lives in. Optional when the scene has one element."
}
},
"required": [
"type",
"value"
],
"additionalProperties": false
},
"tweenType": {
"type": "string",
"enum": [
"from",
"to",
"fromTo",
"set",
"drawSVG"
],
"description": "\"from\" is the usual choice for entrances."
},
"props": {
"type": "object",
"description": "Animated values. For \"from\": the starting values (animates TO the natural state). For \"to\": the end values. For \"fromTo\": end values here plus starting values in fromProps.",
"properties": {
"x": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Horizontal offset in SVG units"
},
"y": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Vertical offset in SVG units"
},
"scale": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": "Uniform scale (1 = natural size)"
},
"scaleX": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"scaleY": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"rotation": {
"type": "number",
"minimum": -1080,
"maximum": 1080,
"description": "Degrees"
},
"skewX": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"skewY": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"opacity": {
"type": "number",
"minimum": 0,
"maximum": 1,
"description": ""
},
"strokeWidth": {
"type": "number",
"minimum": 0,
"maximum": 60,
"description": ""
},
"transformOrigin": {
"type": "string",
"description": "e.g. \"50% 50%\", \"center\", \"left top\""
},
"svgOrigin": {
"type": "string",
"description": "Absolute SVG-coordinate pivot, e.g. \"130 130\" (use for orbit/rotation around a point)"
},
"fill": {
"type": "string",
"description": "Hex or rgb() colour"
},
"stroke": {
"type": "string",
"description": "Hex or rgb() colour"
},
"drawSVG": {
"type": "string",
"description": "For drawSVG steps: start value, e.g. \"0%\" or \"50% 50%\""
},
"fromProps": {
"type": "object",
"description": "Starting values (fromTo only)",
"properties": {
"x": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Horizontal offset in SVG units"
},
"y": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Vertical offset in SVG units"
},
"scale": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": "Uniform scale (1 = natural size)"
},
"scaleX": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"scaleY": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"rotation": {
"type": "number",
"minimum": -1080,
"maximum": 1080,
"description": "Degrees"
},
"skewX": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"skewY": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"opacity": {
"type": "number",
"minimum": 0,
"maximum": 1,
"description": ""
},
"strokeWidth": {
"type": "number",
"minimum": 0,
"maximum": 60,
"description": ""
},
"transformOrigin": {
"type": "string",
"description": "e.g. \"50% 50%\", \"center\", \"left top\""
},
"svgOrigin": {
"type": "string",
"description": "Absolute SVG-coordinate pivot, e.g. \"130 130\" (use for orbit/rotation around a point)"
},
"fill": {
"type": "string",
"description": "Hex or rgb() colour"
},
"stroke": {
"type": "string",
"description": "Hex or rgb() colour"
},
"drawSVG": {
"type": "string",
"description": "For drawSVG steps: start value, e.g. \"0%\" or \"50% 50%\""
}
},
"additionalProperties": false
}
},
"additionalProperties": false
},
"duration": {
"type": "number",
"minimum": 0,
"maximum": 8,
"description": "Seconds per target"
},
"position": {
"description": "Start time: absolute seconds (number), or relative string: \"<\" (with previous step), \">\" (after previous), \"+=0.2\"/\"-=0.2\" (relative to timeline end), \"<0.15\" (0.15s after previous start). Pattern ^([<>])?([+-]=)?(\\d+(\\.\\d+)?)?$",
"oneOf": [
{
"type": "number",
"minimum": 0,
"maximum": 12
},
{
"type": "string",
"pattern": "^([<>])?([+-]=)?(\\d+(\\.\\d+)?)?$"
}
]
},
"ease": {
"type": "string",
"pattern": "^(none|linear|power[1-4]|sine|expo|circ|quad|cubic|quart|quint|back|elastic|bounce)(\\.(in|out|inOut))?(\\(\\s*-?\\d+(\\.\\d+)?(\\s*,\\s*-?\\d+(\\.\\d+)?)?\\s*\\))?$",
"description": "GSAP ease name: power1-4.out|in|inOut, sine, expo, circ, back.out(1.4), elastic.out(1,0.4), bounce.out, none"
},
"stagger": {
"description": "Seconds between each target when the target matches several elements, or a config object.",
"oneOf": [
{
"type": "number",
"minimum": 0,
"maximum": 4
},
{
"type": "object",
"properties": {
"amount": {
"type": "number",
"minimum": 0,
"maximum": 4,
"description": "Total seconds spread across all targets"
},
"from": {
"description": "\"start\" | \"center\" | \"end\" | \"random\" | index",
"oneOf": [
{
"type": "string",
"enum": [
"start",
"center",
"end",
"random"
]
},
{
"type": "number",
"minimum": 0
}
]
},
"ease": {
"type": "string",
"pattern": "^(none|linear|power[1-4]|sine|expo|circ|quad|cubic|quart|quint|back|elastic|bounce)(\\.(in|out|inOut))?(\\(\\s*-?\\d+(\\.\\d+)?(\\s*,\\s*-?\\d+(\\.\\d+)?)?\\s*\\))?$"
},
"sortBy": {
"type": "string",
"enum": [
"dom-order",
"x-position",
"y-position",
"distance-from-center"
],
"description": "Spatial order for the stagger (e.g. distance-from-center to guide the eye inward)"
}
},
"required": [
"amount"
],
"additionalProperties": false
}
]
},
"critical": {
"type": "boolean",
"description": "If true, an unresolved target rejects the whole preview"
}
},
"required": [
"id",
"target",
"tweenType",
"props",
"duration",
"position"
],
"additionalProperties": false
},
"index": {
"type": "integer",
"minimum": 0,
"description": "Insert position (default: append)"
}
},
"required": [
"op",
"step"
],
"additionalProperties": false
},
{
"type": "object",
"properties": {
"op": {
"const": "update_step"
},
"stepId": {
"type": "string",
"pattern": "^[A-Za-z0-9][A-Za-z0-9_-]{0,63}$"
},
"changes": {
"type": "object",
"description": "Only the fields to change. props are shallow-merged; set a prop to null to remove it. stagger: null removes the stagger.",
"properties": {
"label": {
"type": "string",
"maxLength": 80
},
"target": {
"type": "object",
"description": "Semantic target. type \"id\" = one element by its id; \"group\" = every member of a semantic group (e.g. \"accents\"); \"role\" = every element with that role. No CSS selectors.",
"properties": {
"type": {
"type": "string",
"enum": [
"id",
"role",
"group"
]
},
"value": {
"type": "string",
"pattern": "^[A-Za-z0-9][A-Za-z0-9_-]{0,63}$",
"description": "Element id, group id, or one of: primary, secondary, accent, utility"
},
"scopeToId": {
"type": "string",
"pattern": "^[A-Za-z0-9][A-Za-z0-9_-]{0,63}$",
"description": "Scene element id the target lives in. Optional when the scene has one element."
}
},
"required": [
"type",
"value"
],
"additionalProperties": false
},
"tweenType": {
"type": "string",
"enum": [
"from",
"to",
"fromTo",
"set",
"drawSVG"
],
"description": "\"from\" is the usual choice for entrances."
},
"props": {
"type": "object",
"properties": {
"x": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Horizontal offset in SVG units"
},
"y": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Vertical offset in SVG units"
},
"scale": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": "Uniform scale (1 = natural size)"
},
"scaleX": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"scaleY": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"rotation": {
"type": "number",
"minimum": -1080,
"maximum": 1080,
"description": "Degrees"
},
"skewX": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"skewY": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"opacity": {
"type": "number",
"minimum": 0,
"maximum": 1,
"description": ""
},
"strokeWidth": {
"type": "number",
"minimum": 0,
"maximum": 60,
"description": ""
},
"transformOrigin": {
"type": "string",
"description": "e.g. \"50% 50%\", \"center\", \"left top\""
},
"svgOrigin": {
"type": "string",
"description": "Absolute SVG-coordinate pivot, e.g. \"130 130\" (use for orbit/rotation around a point)"
},
"fill": {
"type": "string",
"description": "Hex or rgb() colour"
},
"stroke": {
"type": "string",
"description": "Hex or rgb() colour"
},
"drawSVG": {
"type": "string",
"description": "For drawSVG steps: start value, e.g. \"0%\" or \"50% 50%\""
},
"fromProps": {
"type": "object",
"description": "Starting values (fromTo only)",
"properties": {
"x": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Horizontal offset in SVG units"
},
"y": {
"type": "number",
"minimum": -2000,
"maximum": 2000,
"description": "Vertical offset in SVG units"
},
"scale": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": "Uniform scale (1 = natural size)"
},
"scaleX": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"scaleY": {
"type": "number",
"minimum": 0,
"maximum": 10,
"description": ""
},
"rotation": {
"type": "number",
"minimum": -1080,
"maximum": 1080,
"description": "Degrees"
},
"skewX": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"skewY": {
"type": "number",
"minimum": -89,
"maximum": 89,
"description": ""
},
"opacity": {
"type": "number",
"minimum": 0,
"maximum": 1,
"description": ""
},
"strokeWidth": {
"type": "number",
"minimum": 0,
"maximum": 60,
"description": ""
},
"transformOrigin": {
"type": "string",
"description": "e.g. \"50% 50%\", \"center\", \"left top\""
},
"svgOrigin": {
"type": "string",
"description": "Absolute SVG-coordinate pivot, e.g. \"130 130\" (use for orbit/rotation around a point)"
},
"fill": {
"type": "string",
"description": "Hex or rgb() colour"
},
"stroke": {
"type": "string",
"description": "Hex or rgb() colour"
},
"drawSVG": {
"type": "string",
"description": "For drawSVG steps: start value, e.g. \"0%\" or \"50% 50%\""
}
},
"additionalProperties": false
}
},
"additionalProperties": false
},
"duration": {
"type": "number",
"minimum": 0,
"maximum": 8,
"description": "Seconds per target"
},
"position": {
"description": "Start time: absolute seconds (number), or relative string: \"<\" (with previous step), \">\" (after previous), \"+=0.2\"/\"-=0.2\" (relative to timeline end), \"<0.15\" (0.15s after previous start). Pattern ^([<>])?([+-]=)?(\\d+(\\.\\d+)?)?$",
"oneOf": [
{
"type": "number",
"minimum": 0,
"maximum": 12
},
{
"type": "string",
"pattern": "^([<>])?([+-]=)?(\\d+(\\.\\d+)?)?$"
}
]
},
"ease": {
"type": "string",
"pattern": "^(none|linear|power[1-4]|sine|expo|circ|quad|cubic|quart|quint|back|elastic|bounce)(\\.(in|out|inOut))?(\\(\\s*-?\\d+(\\.\\d+)?(\\s*,\\s*-?\\d+(\\.\\d+)?)?\\s*\\))?$",
"description": "GSAP ease name: power1-4.out|in|inOut, sine, expo, circ, back.out(1.4), elastic.out(1,0.4), bounce.out, none"
},
"stagger": {
"oneOf": [
{
"type": "null"
},
{
"type": "number",
"minimum": 0,
"maximum": 4
},
{
"type": "object",
"properties": {
"amount": {
"type": "number",
"minimum": 0,
"maximum": 4,
"description": "Total seconds spread across all targets"
},
"from": {
"description": "\"start\" | \"center\" | \"end\" | \"random\" | index",
"oneOf": [
{
"type": "string",
"enum": [
"start",
"center",
"end",
"random"
]
},
{
"type": "number",
"minimum": 0
}
]
},
"ease": {
"type": "string",
"pattern": "^(none|linear|power[1-4]|sine|expo|circ|quad|cubic|quart|quint|back|elastic|bounce)(\\.(in|out|inOut))?(\\(\\s*-?\\d+(\\.\\d+)?(\\s*,\\s*-?\\d+(\\.\\d+)?)?\\s*\\))?$"
},
"sortBy": {
"type": "string",
"enum": [
"dom-order",
"x-position",
"y-position",
"distance-from-center"
],
"description": "Spatial order for the stagger (e.g. distance-from-center to guide the eye inward)"
}
},
"required": [
"amount"
],
"additionalProperties": false
}
]
},
"critical": {
"type": "boolean",
"description": "If true, an unresolved target rejects the whole preview"
}
},
"additionalProperties": false
}
},
"required": [
"op",
"stepId",
"changes"
],
"additionalProperties": false
},
{
"type": "object",
"properties": {
"op": {
"const": "remove_step"
},
"stepId": {
"type": "string",
"pattern": "^[A-Za-z0-9][A-Za-z0-9_-]{0,63}$"
}
},
"required": [
"op",
"stepId"
],
"additionalProperties": false
},
{
"type": "object",
"properties": {
"op": {
"const": "reorder_steps"
},
"stepIds": {
"type": "array",
"items": {
"type": "string"
},
"description": "Every existing step id, in the new order"
}
},
"required": [
"op",
"stepIds"
],
"additionalProperties": false
},
{
"type": "object",
"properties": {
"op": {
"const": "set_timeline"
},
"totalDuration": {
"type": "number",
"minimum": 0.1,
"maximum": 12,
"description": "Declared timeline length in seconds (the track extends automatically if steps run longer)"
},
"defaults": {
"type": "object",
"properties": {
"ease": {
"type": "string",
"pattern": "^(none|linear|power[1-4]|sine|expo|circ|quad|cubic|quart|quint|back|elastic|bounce)(\\.(in|out|inOut))?(\\(\\s*-?\\d+(\\.\\d+)?(\\s*,\\s*-?\\d+(\\.\\d+)?)?\\s*\\))?$"
},
"duration": {
"type": "number",
"minimum": 0.01,
"maximum": 8
}
},
"additionalProperties": false
}
},
"required": [
"op"
],
"additionalProperties": false
}
]
}
},
"autoplay": {
"type": "boolean",
"description": "Play the preview immediately (default true)"
}
},
"required": [
"baseRevision",
"operations"
],
"additionalProperties": false
}
Similar websites
wfsim.app
wfsim.app
A Warframe calculator that simulates the fight instead of estimating it — builder, simulator, optimizer. Every formula cites its source, and the golden tests ar…
live
Unverified
Media & Personal
enemies_targets_list
enemies_target_new
enemies_target_copy
enemies_target_open
enemies_target_set
Inspect tools
commonplace-webmcp.vercel.app
commonplace-webmcp.vercel.app
Commonplace is an editable social reading space built for people and their browser agents.
live
Unverified
Media & Personal
Transact tools
commonplace.get_page_state
commonplace_get_page_state
commonplace.get_reading_list
commonplace_get_reading_list
commonplace.get_profile
Inspect tools
pixelforge-studio.appcaster.chatgpt.site
pixelforge-studio.appcaster.chatgpt.site
A professional browser pixel-art editor for drawing, frame animation, palettes, sprite sheets, GIF export, and WebMCP automation.
live
Unverified
Media & Personal
Transact tools
plan_text_creation
get_text_creation_status
create_from_text
claim_text_creation
update_text_creation
Inspect tools
pixelite.taskcraft.site
pixelite.taskcraft.site
Pixelite
live
Unverified
Media & Personal
Transact tools
get_document_info
list_layers
get_active_layer
get_selection_info
new_document
Inspect tools