mcp-uimax

Instructions

Implementation Reference

• src/server.ts:201-258 (handler)

  The 'quick_review' tool is defined, registered, and implemented within 'src/server.ts'. It captures a screenshot using 'captureScreenshot' and returns a design review prompt.

    server.tool(
      "quick_review",
      `Quick design-only review. Captures a screenshot and returns it with a focused design review methodology. No code analysis, no performance audit — just visual/UX feedback. Great for rapid design iteration.
  
  After receiving the screenshot, analyze it as a senior UI designer and provide 5-10 high-impact observations with specific fixes.
  
  This tool is FREE — runs entirely within Claude Code.`,
      {
        url: z.string().url().describe("URL of the page to review"),
      },
      async ({ url }) => {
        try {
          const screenshot = await captureScreenshot({
            url,
            width: 1440,
            height: 900,
            fullPage: true,
            delay: 1000,
            deviceScaleFactor: 2,
          });
  
          return {
            content: [
              {
                type: "text" as const,
                text: `# Quick Design Review\n\n**URL:** ${url}\n**Captured:** ${screenshot.timestamp}\n\nScreenshot:`,
              },
              {
                type: "image" as const,
                data: screenshot.base64,
                mimeType: screenshot.mimeType,
              },
              {
                type: "text" as const,
                text: [
                  ``,
                  `---`,
                  ``,
                  `# Review Methodology`,
                  ``,
                  QUICK_DESIGN_PROMPT,
                  ``,
                  `---`,
                  ``,
                  `After generating your design review, implement the fixes directly in the code.`,
                ].join("\n"),
              },
            ],
          };
        } catch (error) {
          const message = error instanceof Error ? error.message : String(error);
          return {
            content: [{ type: "text" as const, text: `Quick review failed: ${message}` }],
            isError: true,
          };
        }
      }
    );