>_
SudoMock

PSD Preparation

Prepare your Photoshop mockup files for optimal rendering. Follow these guidelines to ensure your templates work perfectly with SudoMock.

Smart Objects

Editable design areas

High Resolution

3000px+ recommended

Organized Layers

Named & grouped

File Requirements

SudoMock accepts Photoshop files (.psd) that meet these requirements:

  • Photoshop CC 2015 or newer
  • Maximum file size: 500MB
  • At least one smart object layer
  • RGB color mode (CMYK will be converted)
  • 8-bit or 16-bit depth

File Size Tip

Keep your PSD under 100MB for fastest upload times. Flatten non-editable layers and rasterize effects to reduce file size.

Setting Up Smart Objects

Smart objects are the key to mockup templates. They define where your designs will be placed.

Creating a Smart Object

  1. Select the layer(s) that will hold the design
  2. Right-click → Convert to Smart Object
  3. Or use Layer → Smart Objects → Convert to Smart Object
  4. Double-click the smart object to edit its contents
  5. The contents determine the design area dimensions

Smart Object Size

Make your smart object contents larger than you think you'll need. SudoMock can scale down, but scaling up loses quality. We recommend 3000x3000px or larger.

Naming Conventions

Name your smart objects descriptively. These names appear in the API response:

Good Names

  • Front Design
  • Back Logo
  • Sleeve Print Left
  • Label Tag

Bad Names

  • Layer 1
  • Smart Object 1
  • Copy of Layer
  • asdfgh

Perspective & Transforms

SudoMock preserves smart object transformations, including:

  • Distort: Perspective warp for 3D surfaces
  • Warp: Curved surfaces like mugs, fabric folds
  • Rotate: Angled design placement
  • Scale: Size relative to mockup

Quad Coordinates

For complex perspective transforms, SudoMock extracts "quad" coordinates—the four corner points of the transformed smart object. This ensures pixel-perfect placement.

Layer Effects & Blending

Certain layer effects are supported:

✓ Supported

  • Blend modes (Multiply, Screen, Overlay, etc.)
  • Opacity
  • Layer masks
  • Clipping masks

⚠ Flatten These

  • Complex layer styles (bevel, emboss)
  • 3D effects
  • Video layers
  • Adjustment layers (outside smart objects)

Layer Organization

A well-organized PSD is easier to maintain and renders more reliably:

Layer Structure
1
// Recommended layer structure
2
�� T-Shirt Mockup.psd
3
├── �� Adjustments (top)
4
│   ├── Brightness/Contrast
5
│   └── Color Balance
6
├── �� Overlays
7
│   ├── Fabric Texture
8
│   └── Shadow
9
├── �� Design Areas
10
│   ├── �� Front Design (Smart Object)
11
│   └── �� Back Logo (Smart Object)
12
├── �� Product
13
│   ├── T-Shirt Body
14
│   ├── Collar
15
│   └── Sleeves
16
└── �� Background
17
    └── White Background

Optimization Checklist

Testing Your PSD

Before using a PSD in production:

  1. Upload to SudoMock via the Playground
  2. Verify all smart objects are detected
  3. Test with a sample design image
  4. Check that transforms and effects render correctly
  5. Export and inspect the result at full resolution

Use the Playground

The Dashboard Playground is the fastest way to test your PSDs. Upload, preview smart objects, and render—all without writing code.

Need More Help?

Learn about smart objects in depth or contact our support team.

Smart Objects GuideContact Support