Cursor实战:10分钟复刻一个网页版小猫补光灯

文摘   科技   2025-01-13 20:58   山东  


点击上方🔺公众号🔺关注我✅

你好啊,我是雨飞,见字如面感谢阅读,期待我们下一次的相遇。

最近,小猫补光灯的APP彻底火了。这款软件就是为自拍党提供了最基础的补光功能,操作便捷,功能极简,大大节省了用户使用的时间。

虽然很多人质疑他的技术难度,但是技术的高低从来不是衡量一款产品好坏的关键因素。毕竟大家又不是在做大模型,没有高深的技术就是做不出来claude这种模型,产品只要让自己的用户满意就足够了。今天,就让我们花10分钟的时间,复刻一个网页版的补光灯效果。

下面是展示界面。

最中间的区域是摄像头展示界面,需要开启摄像头权限才能看到内容。下面是可以选择的背景色,提供了亮度、饱和度、色相功能的调节。

直接使用 Composer 进行生成,输入我们的要求。

提示词: 

请帮我做一个补光灯的网站。它的原理是利用屏幕的反光给女生的脸部进行补色。# 要求1、可以调节背景色2、在屏幕中间调用摄像头展示人脸

这样,就可以得到最基础的网站结构,正常情况会生成三个文件,一个是主页的 html 文件,另一个 css 的样式文件,还有一个 js 脚本。

接下来,增加饱和度,色相调节功能。

提示词:

请帮我增加饱和度和色相调节的功能。并且添加几种女生喜欢的滤镜风格

继续进行优化,可以输入参数值,不需要每次拖动滑块。

提示词:

请在滑块调整的时候,在滑块右侧给出参数值,用户可以输入参数值进行设置

更换背景色,提供几个常用的颜色。

提示词:

请增加几个女生常用的背景色,供我们选择

接下来,你可以给AI一个更好的身份,让他帮我们美化下界面,更适合女性用户喜欢。

提示词:

你是一位优秀的大厂产品经理,请从女生喜欢的角度去思考和分析,并优化这个产品的UI界面,让更多女性用户喜欢

最后,增加好拍摄功能,结束网站的搭建。

tips:AI时代,创意和需求本身比技术更重要,你可以尝试去以下的地方发现需求。

1、https://www.producthunt.com/ 

2、七麦数据:https://www.qimai.cn/


如果你觉得这篇文章对你有启发,欢迎点赞收藏转发下。目前运营了两个Cursor交流群,付费、免费的都有,有想一起交流学习的可以添加下方的微信,邀你一起学习。


❤️常驻小尾巴❤️

加微 1060687688,备注「公众号」,送你一份「AI工具与副业变现指南

推荐阅读

「雨飞同行」这是雨飞的介绍(第8版,交个朋友,限时送福利)

雨飞AI笔记
个人V:1060687688,添加后,发送暗号“777”送你一份副业与AI相关的见面礼。 雨飞个人号,AI算法从业者,在职场搞副业,探索一人企业。在AI时代,持续分享自己在学习、副业路上的所见、所思,记录雨飞个人IP打造中的心路历程。
 最新文章