做产品的时候才发现,自己完全不会做展示图
这两年断断续续做了一些小产品。
写代码其实还好,功能、接口、部署这些都比较顺。但每次准备把产品发出来的时候,总会卡在一个很奇怪的地方:做展示图。
比如:
- 官网放一张 MacBook / iPhone 的产品图
- 发 Product Hunt 或 Hacker News 想配一张封面
- 有时候想在社交平台发一下产品截图
如果只是直接贴一张截图,总感觉有点太 「原始」 了。
我也试过很多办法:找 PSD mockup、用 Figma 模板、或者网上找现成的设备样机。但每次替换屏幕、调透视、调背景,总是要折腾一会儿。有时候只是想做一张简单的展示图,反而花的时间比写功能还久。
后来有一段时间我就自己写了个小工具,本来只是想偷懒用的。
一开始只是把截图套到设备里,生成一张样机图。后来慢慢又加了一点别的方式,比如可以直接用 AI 生成 mockup,或者用社区里别人做好的模板。
现在大概有几种比较简单的用法:
- 传一张截图,生成设备样机
- 用 AI 直接生成一张 mockup
- 用社区里的模板快速套一个
如果想细调,也做了一个简单的编辑器,可以自己调一些细节,比如位置、角度、背景之类的。
大概是这个效果:
生成的样机效果图:



最近把这个东西整理了一下放出来试试。
如果你平时也会做产品页面,或者偶尔需要发产品截图,可能会用得到:
https://mockup-make.com
现在其实还挺粗糙的,如果有哪里不好用、生成效果不太行,或者有什么想加的设备 / 模板,也欢迎体验一下随便提意见。我自己也还在慢慢改。










