Skip to main content
Glama

ui_to_artifact

Convert UI screenshots into code, prompt, specification, or description. Specify target type and optional requirements for tailored output.

Instructions

将 UI 截图转换为指定产物:代码、提示词、规格说明或描述。

Args: image: UI 截图(路径 / URL / base64 URI)。 target_type: 目标产物类型,可选:code(前端代码)、prompt(复刻用提示词)、 specification(规格说明)、description(文字描述)。 question: 可选,额外要求,如"用 React + Tailwind""响应式"。

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
imageYes
questionNo
target_typeYes

Output Schema

TableJSON Schema
NameRequiredDescriptionDefault
resultYes
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

No annotations are provided, so the description carries the full burden of behavioral disclosure. It explains the conversion target and parameter semantics, but does not describe any process details, limitations, or edge cases (e.g., handling of invalid images, output format). It adds some context beyond the schema by enumerating target types, but still leaves behavior somewhat open.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is concise, front-loading the core purpose in the first sentence, followed by a clearly structured Args block. Every line adds information without waste. The formatting, though simple, is easy to parse and perfectly sized.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness5/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a three-parameter tool with an output schema, the description covers the essential context: input, target types, and optional requirements. The output schema handles return values, so the description does not need to explain them. It is sufficiently complete for an agent to select and invoke the tool correctly.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters5/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 0%, and the description fully compensates. It explains 'image' with formats (path/URL/base64 URI), 'target_type' with all four allowed values, and 'question' as an optional parameter with examples. This is a model of parameter documentation for a low-coverage schema.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description opens with a clear statement of purpose: '将 UI 截图转换为指定产物:代码、提示词、规格说明或描述。' (convert UI screenshot to specified artifacts: code, prompt, specification, or description). It uses a specific verb (convert) and resource (UI screenshot), and clearly distinguishes from siblings like image_analysis or extract_text_from_screenshot, which focus on analysis/extraction rather than generation.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description implies usage context by listing target artifact types, but it does not explicitly state when to use this tool versus alternatives or provide exclusions. Sibling tools are not referenced, so an agent would have to infer the niche from the purpose sentence alone. This meets the 'implied usage' level, not full guidance.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Install Server

Other Tools

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/sunqb/vision-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server