首页作品

Pastel Dress 的创作过程

项目生活

页面截图
页面截图

Pastel Dress 是一款免费的浏览器换装游戏,无需注册,打开即可玩。

我希望女儿可以一个人安静地搭配衣服、编小故事。它也是 Fishenal Studio 的一个小作品。

我经常给女儿买各种小玩具,她从很小的时候就喜欢买那种换装的人物贴纸,这些贴纸虽然不贵,但是回来玩几次就玩腻了,而且有的还需要手工组装,数量有限。

说实话我还是很赞赏这些商家的设计的,他们的角色设计得很可爱,服装和场景也非常多样,他们应该都是有长期合作的艺术家。

我本来以为用 AI 生成这些图片应该很容易,但实际上却没那么简单,我尝试了 Gemini 和豆包,发现他们各自擅长的领域不同,比如 Gemini 可以比较准确地生成我想要的内容,但绘图风格比较写实,豆包可以生成更接近中国市场的可爱图片,于是我就用它俩结合做了一批场景和人物图像,我女儿看了很兴奋,于是我相信可以继续做下去,我也觉得在计算机上更适合玩这种“一次性”游戏,而且有着无限可扩展性,也没有物理上损坏或者粘度失效等问题。

另外一个激励我的点是,小孩子对玩具的品质要求没那么高,我女儿在玩的时候并没有追求什么服装是否对齐、是否和人物合身、人物拿起东西有没有手放在把手上之类,他们会很粗糙地玩,因为真正的乐趣其实是在他们脑子的想象里。这点和成年人有所不同,成年人可能更关注细节,如果细节做得不好他们会觉得这个作者技术不够成熟。

所以如果没有对细节的担忧,我就放心大胆地让 AI 帮我生成代码,在跟 AI 探讨之前,我没有太想明白如何对齐服装和人物的位置,如果所有素材再要记录一个坐标用于对齐,那这个工作量也太过庞大和复杂。AI 给我的方案简单很多,直接把所有的素材做成大小一致的透明 WebP 图片,这样不需要记录坐标信息,因为所有图片,哪怕是一个很小的头饰,也是在一个完整的矩形图像里。

即便这样,其实工作量也并不小,处理数十张图片,我在 Pixelmator Pro 里将它们一一对齐,再依次导出。

素材
素材

其实最大的技术层面的困惑来自导出,我分组对齐所有类型的素材之后,我发现我没法一次性导出不同图层的所有 assets,因为之前的模式是生成切片一次导出,但现在都在一个画面里叠加,只有一张切片,我只能手动一个个切换可见性分别导出!这是个巨大的工作量,再和 AI 探讨之后,我们认为只能通过脚本实现,用 Mac 自带的自动化工具,一个个导出。我那一百多个素材居然导出了将近半个小时,看起来像是自动化工具在图层显隐方面必须一个个遍历,而且导出本身都要花费一定的时间。

对这个项目另外一个担心是过多的图片影响加载效率,但实际上图片都经过压缩并导出 WebP 格式,可以在保留透明度的情况下极大地压缩体积,并且采用了图片的按需加载,实际页面效率很好,在 Vercel 看到的访问分析也很优秀,除了国内地区产生了访问限制之外。

成品出来之后,我让我女儿试玩,我知道她在玩具方面通常耐心不足,但这次算是最好的一次试玩,她一次性玩了将近一个小时的时间,这突破了她的记录,也让我有信心这个项目确实是可以玩的,是有价值的。

这个项目我让我的孩子当我的产品设计师,不过我会引导她的思路。后续她希望我可以添加和道具互动的功能,可以像游戏一样过关,也可以加一些小游戏。

这几个功能点其实都不好实现,比如和道具互动意味着场景里要生成和切图大量的元素,小元素在大场景里位置信息也要逐个手动添加。小游戏和奖励系统,比如金币、经验、获取不同服装的解锁,也需要增添新的功能维度。游戏通关一方面要增加简单的游戏功能,还需要关卡方面的数值考虑。

最简单的更新其实还是更新几套衣服,添加不同的场景吧。

这个项目我做了简单的推广,我预计很难找到目标用户,项目部署在 Vercel 上也隔绝了国内用户,国外用户的话我想部分有孩子的家长可能会有这个需求。目前有几十到几百个访问流量,每天在个位数,这个数据离产生广告或者会员营收都相距甚远。

另外这个项目确实太简单,留存很难,如果真的想提高留存,可能还是需要增加小游戏,提供奖励系统、每日任务之类。

另外说明一下,以下的油管视频是我本人亲自配音,我本以为自己配音比 AI 更真诚、能有更好的流量数据,结果还不如后面 AI 做的,但或许这也不是主要因素,相比于内容和质量来说。

项目信息

周期
2026.7 - now