样机生成器 —— 截图秒变精致样机图

「样机（mockup）」其实分两类，搞清楚区别能少走弯路。第一类是「设备 / 窗口外框」样机：把你的网页或 App 截图套进一个干净的浏览器窗口或手机外框，配上渐变背景和投影——重点是规整、清晰、突出界面本身，常用于作品集、Product Hunt 首图、落地页 hero、文档配图。第二类是「真实摄影场景」样机：把你的设计印在一件 T 恤、一个马克杯、一块门店招牌、一只礼盒上的实拍照片里，重点是「放进真实世界」的氛围感，常用于电商主图、品牌提案、周边预览。设计猫的样机生成器专做第一类——外框全部用代码绘制，所以无论导出多大都是矢量级锐利、不依赖任何图片素材，也不会有素材授权问题。

做一张「能直接用」的设备样机，几个细节决定成败：一是外框选对——展示网站用带地址栏的浏览器窗口最有语境，展示移动端体验用手机外框，只想要干净裁切就选纯图；二是背景别喧宾夺主，一层协调的渐变把界面从死白里托起来即可，留白要够、让画面呼吸；三是投影要柔，制造轻微悬浮感而非生硬黑边。设计猫把这些都调成顺手的默认值，拖图进来、选框、调留白就出图，全程在你浏览器本地合成、图片不上传，适合反复快速产出。

什么时候该离开这个工具、去用付费的摄影场景样机库？当你需要的是「产品在真实环境里」的照片级氛围——几千种实拍的 T 恤、帽衫、手机壳、店面、海报上墙场景，靠代码框做不出来，这时 Placeit 这类专门的样机库更合适，拖一下就把你的设计合进实拍照。简单说：要规整清晰地展示界面，用设计猫（免费、本地、矢量锐利）；要真实世界的氛围照，用专门的摄影样机库。两者不冲突，按用途选即可。