用Qoder快速还原Figma页面

更新时间:
复制为 MD 格式

本实验可实现用Qoder快速还原Figma页面。

实验简介

本实验可实现用Qoder快速还原Figma页面。

实验室资源方式简介

进入实操前,请确保阿里云账号满足以下条件:

  • 个人账号资源

    • 使用您个人的云资源进行操作,资源归属于个人。

    • 平台仅提供手册参考,不会对资源做任何操作。

  • 确保已完成云工开物 300 元代金券领取。

  • 已通过实名认证且账户余额 ≥0 元。

  • 本实验预计费用约为 1元(按1小时且使用默认参数计费),将使用300元专属权益优惠券进行费用抵扣,实际费用请以实际账单为准。

如果您调整了资源规格、使用时长,或执行了本方案以外的操作,可能导致费用发生变化,请以控制台显示的实际价格和最终账单为准。

领取专属权益及创建实验资源

在开始实验之前,请先点击右侧屏幕的“进入实操”再进行后续操作

image

本次实验需要您通过领取阿里云云工开物学生专属300元抵扣券兑换本次实操的云资源,如未领取请先点击领取。(若已领取请跳过)

image

重要

实验产生的费用优先使用优惠券,优惠券使用完毕后需您自行承担。

学生认证

实验步骤

  1. 访问Qoder官网,下载并安装Qoder。

    image

  2. 安装完成后,注册并登录Qoder。具体操作请参见快速开始

  3. 点击访问 figma页面,并注册账号

  4. 获取figma key

    • image

    • image

    • image

    • 复制这里的key,保存下来。

      image

  5. 配置Qoder里的Figma MCP

    • image

    • image

    • image

    • image

    • 点击edit按钮,将下面的your key换成前面生成的口令,然后保存下来。

      image

    • 至此,MCP安装成功。

  6. 复制Figma里的希望还原的网页链接

    • Figma里,选择系统默认给的案例

      image

    • 进入后,选中希望还原的页面,点击share

      image

    • 点击,copy link

      image

  7. Qoder还原这个网页

    • 将上一步获取到的Figma链接粘贴到对话框,并告诉qoder希望还原这个页面。然后Qoder就会执行Figma MCP工具,并开始生成网页。

      image

    • image

    • 点击上面的Preview,就可以预览生成的效果了

      image

      image

      image

  8. 实验结束后,Qoder账号无需注销,无资源释放。

关闭实验

  • 完成实验后,点击 结束实操

    image

  • 点击 取消 回到实验页面,点击 确定 退出实验界面,关闭页面结束实验

    image