交付物、环境依赖与交付测试
交付的标准:别人在别人的电脑上、不问你,能独立用完一次。作者的电脑什么都不缺,所以自测测不出交付问题。
在自己电脑上测一百遍,一百遍都对
图片、字体、网络都在,交付问题一个也测不出
换一台电脑、换一个浏览器、断一次网,各开一次
三次都能正常用完,才交出去
"在我这儿能跑"是软件行业里最有名的一句话:程序依赖的东西散落在开发者的机器上,换个环境就少一样。科研界近些年也有不少期刊要求作者连同数据和运行环境一起提交,因为只有作者自己跑得出来的结果,别人无法检验。行业的解法都是把环境带给对方,本章"把依赖装进包里"是这个方向上最朴素的一步。
交付物是接收方拿到的整个包:程序文件、素材、说明文件。压缩时压文件夹本身,不要选中里面的文件再压。
接收方拿到的全部东西:程序文件、用到的素材、说明文件。
把整个文件夹打成一件,传输时不会散、不会漏。
单独发出 index.html
素材和说明都不在,对方要来问你才能用
程序、素材、说明放进同一个文件夹,压成一件
对方不用问你就能开始
程序运行时要靠外部提供的东西,叫环境依赖。对方环境里缺了它,解法只有两条:装进包里,或者干脆不依赖。
程序运行时要靠外部提供的东西:图片文件、字体、路径、网络。
依赖的东西在对方环境里不存在。
浏览器找不到指定字体时改用系统默认字体,不报错也不提示;字体宽窄不同,排版跟着变。
因为有字体回退,本课程一律用系统自带字体。
图片没有跟着包一起走
图鉴页九张示意图全变成破图标,页面结构还在,内容没了
图片放进 img 一起打包;或者改用文字和边框画示意
对方打开看到的和你一样
<!-- ✕ 问题包:引用网上的字体。对方断网或加载失败,字体悄悄换掉 --> <link rel="stylesheet" href="https://fonts.example.com/css2?family=…"> <!-- ✓ 合格包:只用系统自带字体,谁的机器上都有 --> <style> body { font-family: "Microsoft YaHei", "PingFang SC", sans-serif; } </style> <!-- ✕ 问题包:完整路径。这个位置只在作者自己的电脑上存在 --> <img src="C:\Users\yangmin\Desktop\叶片照片.jpg"> <!-- ✓ 合格包:相对路径,图片跟着包一起走 --> <img src="img/ye-quanyuan.svg"> <!-- ✕ 问题包:链到一个后来改过名的文件 --> <a href="图鉴.html">翻一下图鉴</a> <!-- ✓ 合格包:文件名和链接对得上 --> <a href="guide.html">翻一下图鉴</a>
速查:路径里出现冒号加斜杠(C:\ 或 https://),就是在指向包外的东西。用编辑器搜这两串,比通读代码快得多,一分钟能查完一份作品。
README 的读者是不认识你、也问不到你的人。五段一段都不能少,第四段已知限制最能体现水平。
交付包里的说明,行业里统一叫这个名字,一般放在包的最外层。
README 第四段:主动说清作品做不到什么。
只写能做什么
对方把"没做"当成"做坏了",回来问你,或者判定不能用
"只覆盖校园里常见的三个类群"
对方知道边界,缺陷变成设计范围
冒烟测试只看能不能正常用完一遍,主流程走不完就不必细测。测试题要先写好,再改作品。
交付前的快速验证,只看能不能正常用完一遍,不细究细节。
先写测试题和判定标准,再回头改被测的东西。
| 前置条件 | 操作 | 预期结果 |
|---|---|---|
| 刚解压,从没打开过 | 双击 index.html | 页面完整显示,没有破图标 |
| 已断开网络 | 刷新页面 | 字体与排版和联网时一致 |
| 在第一步页面 | 连续走完三步 | 给出一个明确结论,不是空白 |
| 一条记录都没有 | 直接看列表区 | 显示提示文字与下一步入口 |
每条测试题三段齐全:前置条件、操作、预期结果。换一个人照着做,得到的结论应该一样。
照着已经做出来的样子出题
没做的地方不会被问到,通过率很高,也没有意义
先定前置条件、操作、预期结果
没做到的地方也会被问出来
可用性指一个没人教的人能不能顺利用完。首屏至少要有三件:标题、一句话说明、引导动作。
一个没人教的人,能不能顺利用完。
| 系统的话 | 人的话 |
|---|---|
| 确定 | 确认删除这一条 |
| 出错了 | 手机号需要是 11 位数字 |
| (一片空白) | 暂无记录,点右上角「新增」开始 |
| 操作失败 | 这一步需要先选一个分类 |
右边每一条都说清了"是什么"或"下一步做什么",左边只通知发生了一件事。改提示语不用动页面结构,只改几个字,是可用性里成本最低的一项。
AI 只看你给的那段文字,不会脑补没写的部分,可以当第一个陌生用户。提示词要写明只挑问题,不要改。
| 提示词里的这句话 | 缺了它,AI 会怎样 |
|---|---|
| 只读这份说明,不要替我改 | 直接把改好的说明甩给你。你不知道原来哪里不清楚,下一次还会写成原来那样 |
| 不要夸奖,只挑问题 | 先夸"结构清晰、内容完整",占掉半屏,真正的问题挤在最后两行 |
| 交付物还缺什么 | 只挑文字表述,不提少放了素材和说明。包里少了图片,说明写得再好也用不了 |
| 对方那里缺了它会出现什么现象 | 只说"这里引用了外部资源",你判断不出严不严重 |
挑一个本专业里真实存在的小麻烦,做一个工具解决它。可以完全换题材,三条硬要求不能变。
十四个题目用来启发,不要照抄。
| 硬要求 | 含义 | 不满足的信号 |
|---|---|---|
| 够小 | 一到三个页面,一件事做透。做不完的作品交不出来 | 功能列了五条以上 |
| 有具体的人 | 说得出谁、在什么情况下、遇到什么麻烦,不能写成"广大同学" | 说不出具体的使用场景 |
| 本地能跑完 | 不联网、不登录、不需要多人共用同一份数据 | 要多人同时看同一份数据 |
"给同学用的一个小工具"
工具做什么、界面放什么都定不下来
"生物科学的学生野外实习采到一片叶子,想先缩个大概范围再翻检索表"
工具做什么、界面放什么随之确定
按六步完成期中作品。交换之前先过自检十条,重点是搜 http、搜冒号加斜杠,再断网刷一次。
对照三条硬要求逐条过,砍掉的理由要写下来
产出:选定的题目与砍掉的选项交付要求整段贴进去,一句不删:单文件或整包、不引外部资源、不用图片
产出:一个能用的页面入口改名 index.html,素材全部放进文件夹,README.txt 放最外层且五段齐全
产出:一个完整的文件夹重点是搜 http、搜冒号加斜杠,再断网刷一次
产出:十条自检表压成一个包发给同组。拿到对方的包之后全程不许说话
产出:互测记录两份修完再让同组走一遍,第二遍应该六步都不卡
产出:修订后的包| 项目 | 要求 | 怎么查 |
|---|---|---|
| 1 包里有 README | 放在最外层,五段齐全:怎么打开、包里有什么、怎么用、已知限制、作者与日期 | 解压后第一眼能不能看见它 |
| 2 入口文件叫 index.html | 别人不用问就知道点哪个 | 让一个不知情的人指出该点哪个文件 |
| 3 用到的素材都在包里 | 或者干脆不用外部素材 | 在别的电脑上打开,看有没有破图标 |
| 4 路径全是相对的 | 没有盘符,没有网址 | 在编辑器里搜冒号加斜杠,搜不到才算过 |
| 5 不引用网上的字体和图标 | 只用系统自带字体 | 搜代码里的 http,再断网刷一次 |
| 6 换台电脑能打开 | 整包拷过去,双击就能用 | 拷到同组的电脑上,双击一次 |
| 7 换个浏览器不跑版 | 排版与字体一致 | Chrome 和 Edge 各开一次,对比首屏 |
| 8 手机宽度能读 | 没有横向滚动条 | 把窗口拖到手机那么窄 |
| 9 主流程能走完一遍 | 从第一步到最后一步,中间不卡 | 做一次冒烟测试 |
| 10 页面里没有编造的内容 | 姓名、电话、示例数据都已替换 | 通读一遍所有文字,找"张三""示例""待填" |
对方测你的包时,你全程不许说话。卡住本身就是结论,不必把对方教会。
替他点开,或者告诉他下一步
不再是独立用完一次,测出来的东西全不算数
看他卡在哪里、卡了多久
有话等他测完再说
他没过的地方,你帮他找原因
他错过了这次能学到的东西
他没过的那几行,直接说看到了什么
找原因是他的活
| 步 | 动作 | 看什么 | 结果 |
|---|---|---|---|
| 1 | 解压,看包里有什么 | 能不能一眼看出哪个是入口 | |
| 2 | 读 README | 看完知不知道该怎么开始 | |
| 3 | 双击入口文件 | 有没有破图、有没有点不动的地方 | |
| 4 | 走一遍主流程 | 从第一步到最后一步,中间卡没卡 | |
| 5 | 换一个浏览器再开一次 | 排版有没有跑、字体是不是同一个 | |
| 6 | 断网再开一次 | 和联网时有没有区别 |
拿到对方的包,照这六行走,卡在哪一行就在那一行写清现象。六行全过,才算这个包交得出去。
提交四项内容,按六条标准验收。评分中交付可用性占 40%。
| 期中考核评分 | 内容 | 占比 |
|---|---|---|
| 交付可用性 | 同组六步全过,换机、换浏览器、断网都能用完 | 40% |
| 作品完成度 | 主流程完整,选题够小且说得出具体的人 | 35% |
| 演示与说明 | README 五段齐全,取舍说得清楚 | 25% |
按教师提供的作业模板(Word)填写,文档开头注明选题与专业方向。提交渠道见课堂通知,当堂提交。
零代码应用开发 · 第 8 章 期中测试与交付