图片压缩工具
做一个网页,把照片压小,腾出手机空间。五步做完,你有一个网址,发出去谁都能打开。
第 1 步 找需求
一句话说清:给谁、解决什么、他现在怎么凑合
先定人,再定做什么。反过来的做法是先想「我会做什么」,做完再找人,通常找不到。
这一步只产出一句话。第一个项目不用你找需求,我给你定好了:
为相册存满、每张都舍不得删的人,
解决手机装不下新拍的照片,
他现在用硬删掉一批去年的凑合着。
三行分别是给谁、解决什么、他现在怎么凑合。第三行最关键:他已经在用一个明知吃亏的办法顶着。真烦人的事,人一定会想办法凑合。
现在换你。想一个人,不用写下来。你身边谁总说手机内存不够?想不到就想你自己,你手机里是不是也有一批删不掉的照片。第 4 步要发的人就是他。
想到这个人,第 1 步就完了。
这三行为什么是这么写的
「为谁」写处境,不写人群标签。「摄影爱好者」是标签,你对不上号;「相册存满、每张都舍不得删」是处境,你能立刻想起一个人。
「怎么凑合」写他真在用的东西。硬删掉一批去年的,他不是不心疼,是没别的办法。这种「明知道亏,还是得做」的动作,比「有点麻烦」更能说明问题有多痛。
第三行答不上来,这个需求就是假的。真烦人的事,人一定会想办法凑合。想不出他怎么凑合,说明他其实没那么在意。
第 2 步 做产品
让 AI 写这个网页
你不写代码。你把要求说清楚,AI 写。要求写得越死,它越老实:你说「做个压缩工具」,它会自作主张加上进度条、水印、批量处理;你写清哪几样不要做,它才照做。
下面这一整段我写好了。原样复制,发给一个 AI,三个都行,手机号注册,免费,网页版就够。框里的字不用看懂,它是写给 AI 看的。
它回你的是一整段代码,从 <!DOCTYPE html> 开头,到 </html> 结尾,中间没有别的话。拿到这段代码,这一屏就完了,下一屏把它存成文件。
它不听话
只给了一半:回「继续,把剩下的代码给我」。
它写了「这段代码的作用是…」:回「只给代码,不要解释」。
它自作主张加了拖拽、进度条、批量处理:把上面「不要做」那一段单独发它一次,说「按这个删掉多余功能」。
界面很丑,像十几年前的网页:它没按【界面】那段做。把【界面】整段单独再发它一次,说「按这个重写界面,别改功能」。
它说「我无法生成代码」:换一个。这个要求大部分 AI 都能做。
第 2 步 做产品
存成文件,双击打开
这一步得在电脑上做。手机上存 html 文件很麻烦,别折腾。
代码待在聊天窗口里没用,要存成一个文件。双击能打开,说明它已经是个网页,不是一段文本了。到这一步,你才第一次看见自己做的东西长什么样。
- 点屏幕左下角的开始菜单,输入「记事本」,回车打开。
- 把代码整段粘进去。满屏英文和符号,正常,不要动它。
- 点顶部菜单的文件,选另存为。文件名写 index.html。
- 下面两个下拉框要改:保存类型拉到最下面选所有文件,编码选 UTF-8。改完再点保存。
- 去你保存的位置找到这个文件,双击。
双击之后,屏幕上应该就是这样。上面是示意,细节可能有出入。
能打开、能看到压缩界面,第 2 步就做完了。
看到的不是这样
满屏英文代码:文件存成了 .txt。重新另存为,文件名手动加上 .html。
一片空白:保存类型没改成「所有文件」,文件实际叫 index.html.txt。
东西比三样多:AI 多做了。把「不要做」那段再发它一次,让它删掉。
按 F12 有红字:把红色那几行完整复制给 AI,一个字别改,也别说「我觉得是因为」。报错里有文件名和行号,你一改信息就丢了。
压完还是超过你填的数:先看测试图是什么格式。截图和设计稿是 PNG,无损格式,压不下去,只能一路降分辨率,这是格式决定的,代码没错。用手机拍的 JPEG 测。
达标了但糊了:一张 5MB 的图硬压到 200KB 这种极端值,工具可能一路降到 300px 才成功。文件够小,图已经没法看。代码没问题,把数字填大一点,记下来,第 5 步要用。
第 3 步 上线
放到网上,拿到一个网址
现在它只在你自己的电脑上,别人打不开。上线就是把这个文件放到别人的服务器上,换成一个网址,你自己电脑关不关都不影响。
用 Cloudflare,免费,一个邮箱,不用绑卡,国内一般能直接打开。
- 没有账号先注册,邮箱加密码,不用绑卡。
- 去邮箱点一下验证链接。
- 打开这个页面。全英文,正常。加载慢,耐心等十几秒。
- 填项目名,英文小写,比如 tupian-yasuo。不能有空格和中文。填完点 Create project。
- 新建一个文件夹,把 index.html 放进去,再把这个文件夹拖进虚线框。那个框只收文件夹和 zip,单个文件拖不进去。文件夹叫什么无所谓,不影响网址。
- 点 Deploy site,等十几秒。看到 Success! Your project is deployed 就是成了,下面有一行蓝色链接。
那行链接就是你的网址,形如 tupian-yasuo-22.pages.dev。后面那几位是 Cloudflare 自动加的,每个人不一样。手机和电脑都能打开。
网址能打开,第 3 步就做完了。把网址复制下来存好,第 4 步要发给一个人。
卡住了
注册过不去:验证邮件没来就翻垃圾箱,或者换 QQ 邮箱、Gmail 再试一次。点开链接是登录页,说明还没登录,先登录再点一次。
Create project 是灰的:项目名不合格。只用英文小写、数字和连字符,别用下划线和大写。
拖不进去:单个文件不行,必须是文件夹或 zip。按第 5 条放进文件夹再拖;如果框里只让选 zip,右键 index.html → 发送到 → 压缩(zipped)文件夹,把生成的 zip 拖进去。
打开网址是 404:文件夹里多套了一层。index.html 必须在文件夹的第一层,不能是「文件夹/另一个文件夹/index.html」。
Cloudflare 卡超过 30 分钟:换 Netlify。注册完直接把文件夹拖进网页,步骤更少。
三个平台都卡住:把卡住那一屏截图发给你用的 AI,问「我卡在这一步,下一步该点哪里」。截图要一起给,光描述它猜不准。
第 4 步 获客
发给一个人
东西在网上,不等于有人在用。这一步要的是一次真实的打开:他点了没有、打不打得开。
别写产品介绍。「我做了个产品,欢迎体验」没人点。发这句就行:
我做了个把照片压小的工具,能帮我看一眼打得开吗?
打不开告诉我就行,不用别的。
发给谁:第 1 步你想的那个人。想不出具体的人,就去相册存满的人待的地方,摄影群、宝妈群、豆瓣小组、小红书评论区都行,不用认识他们。三五个地方里有一个回,就算走通。
什么算数:他点开了、说打不开、说太糊了。什么不算数:点赞、播放量,还有他没点开就说的那句「看着不错」。没点开,你就什么都没验证到。
算数的那些,把他说的话原样记下来,别转述。有人回了你,哪怕只说「打不开」,第 4 步就做完了。
没人回
发出去 0 反应,是正常结果。你的账号没有权重、没有粉丝。换一个渠道再发一次;两个渠道还是 0,就别公开投了,改私信,找 3 个具体的人一个一个问。公开发是等人来,私信是去敲门。
他说打不开:先用你自己的手机打开一次。你自己也打不开,是网址发错了或者没部署成功,回第 3 步重来。你自己能打开,那是他的网络或浏览器问题,让他换一个浏览器再试。
想发抖音:链接放在评论区第一条或主页简介,标题写「你是不是也遇到过手机内存不够」,别写「我做了个工具」。
没人回,要不要改产品:不要。产品还没被验证,改产品没有依据。
第 5 步 迭代
记下哪里跟你想的不一样
这一步写的东西,是给下一个项目用的:哪一句你以为对了,结果错了。
四段加起来 300 字以内,里面至少有一句让你不太舒服的话。全在夸自己,等于什么都没记到。
第 1 题要靠第 1 步那三行。回去看一眼:是「为谁」错了,还是「解决什么」错了。
边写边存,关掉网页也不会丢。
四段都写了字,第 5 步就做完了。
写不出来
他只回了「打不开」,别的什么都没说:这本身就是一条。第 1 题写「我以为他能打开,结果打不开」,第 2 题写「我没预料到的是,他的手机上根本打不开」。你的东西在真实设备上跑不起来,这是最有用的记录。
全都没差:说明反馈太客套。去找那个真的压了图的人,再问一句「哪一步卡了」。
想不出第 4 题:如果只保留一个功能,留哪个?那个功能之外的东西,下次都不做。
五步走完了
你走完了一整圈
找需求、做产品、上线、获客、迭代。这五环连起来,就是一个人把东西做出来、给到别人手上的全过程。
手上应该有三样:一个能打开的网址,一条真实的反馈,一段写着「哪里跟我想的不一样」的记录。反馈要是还没有,回第 4 步发完再来。这一步没走,后面全是猜。
还差一环:收钱
收钱没在这五步里,因为它得等一个前提:真的有人反复打开你那个链接。在那之前谈收钱,谈的都是想象。