豆包在 9 月把大模型 2.1 Pro 更新到了 0915 版本，这次升级里有一个对普通人特别友好的能力：“看图写代码”——拍一张手绘草图、发一张网页截图、甚至给一段软件操作录屏，AI 就能生成能用的代码和页面。配合豆包工作客户端里的”应用生成”功能，不会写一行代码的人，也能做出自己的网页和小工具。这篇教程手把手带你上手，全程不需要任何编程基础。
一、先搞清楚：这次更新给了普通人什么
一句话总结：以前”做个网页”是程序员的活，现在是”会拍照、会打字”就能干的活。
- 看图写代码：把设计稿、手绘草图、界面截图、操作录屏发给豆包，它直接生成对应的代码，覆盖网页、小游戏、3D 展示等场景
- 应用生成：在豆包工作客户端里用对话描述需求，直接生成报名页、数据看板、统计表这类能分享给别人用的小应用，零代码
- 更省钱：新版图像和视频推理的 Token 消耗比上一代减少 30% 以上，同样的事，跑起来更便宜
适合谁：想给班级/公司/小店做个报名页的人；有想法但不会编程、又不想花几千块请外包的人；想给孩子演示”从想法到网页”过程的家长。
二、准备工作（5 分钟）
- 第 1 步：电脑上打开豆包官网（doubao.com）下载”豆包”桌面客户端并登录，建议升级到最新版（2.29 以上），才能用上 0915 新模型的能力
- 第 2 步：新用户默认可领 30 天免费会员；大学生完成学生认证还能再领 3 个月。免费额度也够完成本篇的练习
- 第 3 步：准备一张图。可以是手绘草图（纸上画好拍照）、一张你喜欢的网页截图，或者用画图工具随手画的方框图
注意：具体功能入口和免费额度以 App 内实际界面和官方说明为准，不同版本可能略有差异。
三、实操一：把手绘草图变成网页（核心玩法）
这是最值得练熟的一招。假设你给小区业委会做一个”活动报名页”，纸上画了三个格子：标题、活动介绍、报名按钮。动手：
- 第 1 步：手机把草图拍清楚，传到电脑（或直接把图片文件拖进豆包对话框）
- 第 2 步：输入提示词（模板见第六节），比如：”根据这张手绘图做一个网页，标题是小区中秋游园会报名，下面是活动时间和介绍，底部放一个报名按钮，风格简洁喜庆，手机上打开也要好看”
- 第 3 步：等它生成。豆包会先讲思路再给代码，你不用看懂代码，直接找”预览/运行”按钮看效果
- 第 4 步：用大白话改——”标题字再大一点””按钮换成红色””加一行联系电话”。每说一次它改一版，像跟美工提需求一样
- 第 5 步：满意后保存/导出文件。想让别人访问，可以把生成的页面文件发到豆包的分享功能，或让豆包告诉你怎么免费托管（如 GitHub Pages 的保姆级步骤）
验收标准：手机打开不乱、按钮点了有反应、文字没有错别字。达不到就把截图发回去让它修——”你看这个截图，按钮偏了，修一下”。
四、实操二：零代码搭一个能用的小应用
如果连草图都懒得画，直接用豆包工作里的应用生成能力，纯对话搞定：
- 第 1 步：打开豆包工作客户端，新建对话，选择应用生成/工作任务类入口
- 第 2 步：一次说清需求，别挤牙膏：”帮我做一个亲子运动会报名页，需要填写：孩子姓名、年龄、家长手机号、报名项目（30 米跑/跳绳/两人三足，可多选），提交后我能在后台看到报名列表”
- 第 3 步：生成后先自己试一遍：填一条假数据、提交、看后台能不能收到——这一步千万别省
- 第 4 步：把链接发到微信群里让大家填，收集完让豆包把报名表导出成 Excel 或做成统计看板
同款玩法还能做：店铺问卷、聚会统计、班级值日表、二手闲置登记页。核心公式就一条：要收集什么信息 + 收集完你想看到什么。
五、实操三：两个进阶小技巧
- 截图仿布局：看到别人家页面排版好看，截个图发给豆包：”参考这个布局，把内容换成我的英语班招生信息”。注意只仿布局，文案图片换成自己的，避免侵权
- 给表格做看板：把 Excel 拖进豆包工作，说”按月份统计销售额，做成带柱状图的可视化页面”——0915 版本强化了信息可视化能力，数据汇报瞬间专业起来
六、3 个直接可抄的提示词模板
- 草图转网页：”根据这张手绘图生成一个单页网页。要求：1. 标题、内容、按钮的位置和草图一致；2. 配色用（暖橙+白）；3. 手机和电脑打开都正常；4. 代码写在一个 HTML 文件里，方便我保存。”
- 报名应用：”帮我做一个活动报名小应用：收集姓名、手机号、选项（可多选）；提交后给出成功提示；我能查看和导出所有报名记录；页面顶部放活动标题和一句介绍。”
- 修改迭代：”这是我现在的页面截图，有三个问题：1.（具体问题）；2.（具体问题）；3.（具体问题）。帮我修好，其他部分别动。”
七、新手最容易踩的 4 个坑
- 需求一次说不清：AI 不是你肚子里的蛔虫。第一句话就把”给谁用、放什么内容、要什么功能、什么风格”说完，比挤十次牙膏效率高得多
- 不测试就发给别人：一定先用假数据走一遍全流程。链接发到群里才发现按钮点不动，是最伤信心的事故
- 把敏感信息交给 AI：报名页别要求填身份证号、银行卡这类信息；公司内部数据做看板前先做脱敏。涉及客户资料的活，交付后删本地文件
- 期望一步到位：AI 生成的第一版是”60 分初稿”，你的每次大白话修改才是把它推到 90 分的关键。改 3—5 轮是正常节奏，别第一版不满意就放弃
说到底，”看图写代码”这类能力真正的意义，不是让每个人都去当程序员，而是把”我有个想法”到”做出来能用”之间的距离，缩短到一个下午。报名页、统计表、展示网站……这些以前要么求人要么花大钱的小事，现在值得你自己动手试一次。做好了发朋友圈，那种成就感是真实存在的。