NoiceSS

An open-source screenshot mockup studio that transforms flat screenshots into stunning 3D presentations with macOS frames, perspective tilts, and curated backdrops.

Technologies

Next.jsReactZustandTailwind CSSPWA

Links

GitHub Live Project

NoiceSS is a browser-based screenshot mockup studio that I built to solve a real pain point: raw screenshots don't sell products, but hiring a designer or opening Figma every single time is overkill.

It wraps your flat screenshots in professional macOS window frames, applies 3D isometric tilting across all axes, and layers them over curated 8K backdrops or custom gradients.

Everything runs 100% client-side — no uploads, no accounts, no watermarks. Your images never leave your browser.

It's also a fully offline-capable Progressive Web App (PWA) powered by Serwist, so you can install it and use it anywhere without an internet connection.

The state management is handled entirely with Zustand, and the export pipeline supports up to 4× Ultra HD resolution in WebP format with full alpha channel support.

Key Features

macOS window frames with customizable traffic lights and realistic Safari chrome for professional-looking mockups.

Full 3D isometric tilting with X, Y, Z-axis rotation and adjustable perspective depth for dynamic presentations.

Decoupled studio lighting with independent brightness, contrast, saturation, and hue controls for screenshots and backgrounds separately.

Offline-first PWA architecture powered by Serwist — fully functional without internet after initial load, installable on any device.

High-fidelity export pipeline supporting 1×, 2×, and 4× resolution scaling with optimized WebP encoding and transparent background support.

" "