SuperAPI AI 工具集

muapi-url-to-design

设计与创作

查看项目

更新于 10-15 11:53

技能介绍

URL to Design 是一个面向网站界面重设计的生成式技能,核心用途是:分析一个网站 URL,并生成重新设计、改进后的 UI——以现代审美、更好的信息层级和全新的品牌方向重现视觉设计。

主要能力

  • 根据网站 URL 生成整页重设计效果图(桌面端)。
  • 生成同一页面的移动端响应式重设计效果图。
  • 支持指定页面类型、目标视觉风格,以及是否保留原有品牌色/Logo。
  • 生成后可将桌面端与移动端稿并排展示,并提供设计改进的文字总结。
  • 可进一步按需生成特定区块(如 hero、定价卡片、用户评价)的独立素材。

输入参数

  • url(text,必填):要分析和重设计的网站 URL,例如 "https://example.com/pricing"。
  • page_type(text,可选,默认 landing page):页面类型,如 "landing page"、"pricing page"、"product page"、"dashboard"、"about page"。
  • redesign_style(text,可选,默认 modern, minimal, premium, dark mode):重设计的目标视觉风格,例如 "glassmorphism, vibrant gradient"、"clean corporate, light mode"。
  • keep_brand(text,可选,默认 yes):是否保留现有品牌色/Logo,取值为 "yes" 或 "no"(完全重新构想)。
  • screenshot(image_url,可选):当 URL 无法抓取时,可提供当前页面的截图。

使用方式 该技能由 LLM 编排:读取各阶段内容,向用户收集缺失的输入,然后调用 muapi CLI 命令。若 MUAPI_API_KEY 未设置,需先执行 muapi auth configure。

阶段 A — 重设计生成:提交包含两个并行步骤的计划。 1)整页重设计稿:若提供了 {{screenshot}},使用 muapi 图像编辑(model=gpt4o-edit);否则使用 muapi 图像生成(model=gpt4o-text-to-image)。提示词为:Professional UI/UX redesign of a {{page_type}} for the website at {{url}}. {{redesign_style}} design. Modern web design, 2025 aesthetic. Includes: hero section with clear headline and CTA button, features/benefits section, social proof, clean footer. Pixel-perfect, Figma-quality mockup. Desktop viewport, 1440px width design. 若 {{keep_brand}} 为 "no",追加:Completely reimagined brand identity, new color palette. 宽高比为 9:16(纵向以展示完整页面区块)。 2)移动端版本稿:使用 muapi 图像生成(model=bytedance-seedream-v4.5)。提示词为:Mobile-first responsive redesign of the same {{page_type}} — {{redesign_style}} style. iPhone 15 Pro frame, scrollable layout. Clean mobile navigation, thumb-friendly CTAs, optimized for 390px width. Modern 2025 mobile UI design. 宽高比为 9:19.5。

生成之后:将桌面端与移动端稿并排展示;提供所做设计改进的文字总结;可提议将特定区块(hero、定价卡片、用户评价)生成为独立素材。

对于尚无 CLI 别名的模型 ID,可回退到原始端点:curl -X POST https://api.muapi.ai/api/v1/<endpoint> -H "x-api-key: $MUAPI_API_KEY" -H 'content-type: application/json' -d '{...}',并用 muapi predict wait <request_id> 轮询。发起每次调用前,将 {{input_name}} 占位符替换为用户的实际输入。

适用场景

  • 对现有网站进行视觉重设计探索,快速产出桌面端与移动端概念稿。
  • 在保留或完全重塑品牌的前提下,尝试不同视觉风格。
  • 为落地页、定价页、产品页、仪表盘、关于页等页面类型生成设计方向。

限制与注意事项

  • 若 URL 无法访问,需请用户提供截图或描述当前设计。
  • 始终应改进的方面包括:字体层级、留白、CTA 可见性和移动端响应性。
  • 触发关键词:url to design、redesign website、website redesign、ui redesign、landing page design、page redesign、website to design、convert url to design。
  • 关于收费、价格、平台支持范围等具体信息,资料中暂未提供。