Image effects and adjustments with delivery URLs

A product photograph can need a square card, a subdued background and a smaller editorial image. If each output is a repeatable recipe, a delivery URL can request it from the preserved source. The team defines the crop, adjustment or effect once and reuses that recipe without manually exporting another file for every placement.

The model is explicit:

preserved source image → transformation chain → delivery representation

The application requests the transformation. Vyso applies it and returns the representation. People still decide which treatment suits the image and where it should appear.

Transform the delivery representation, not the source

The source asset is the authoritative image stored in the library. A delivery representation is an output generated from that source with specified operations. Vyso's image-delivery documentation keeps these roles separate: the source remains available for other representations.

A grayscale hero and a square product card can therefore use the same source key with different transformation chains. They do not each need a new authoritative asset record merely because their delivered appearance differs. The generated results can still be cached.

This distinction helps when a library starts accumulating files such as hero-gray.jpg, hero-gray-mobile.jpg and hero-bright.jpg. If their only difference is a reusable delivery recipe, record the recipe and its intended placement. Keep separate files when they contain independent creative work or business meaning.

Use transformations for repeatable presentation

Delivery transformations suit operations you can describe consistently with parameters: a standard crop, a thumbnail size, grayscale treatment, blur, border or a chosen brightness adjustment. The same recipe can be applied to different source images, though each source still needs a visual check.

A brightness factor suitable for one photograph can wash out another. A center crop can work for a centered product and cut off a subject positioned near the edge. Repeatability describes the requested operations; it does not mean every source will produce a suitable composition.

The useful automation is repeating those operations when the application requests an image. A transformation URL does not choose a creative direction or decide that a photograph needs correction.

Keep creative edits as separate assets

Retouching a face, combining several photographs, removing an object or applying local masks involves decisions that a short delivery recipe cannot adequately record. Preserve that work as an edited asset, alongside the original and any working files your production process needs.

A variant can also deserve its own record because it is an independently approved campaign deliverable, a hand-composed layout or an image with a different editorial purpose. Store the finished creative when the exact result must be retained. Its delivery sizes can then be derived from that new source.

A useful test is whether the output can be recreated from the source and recipe, and whether it has meaning beyond its presentation settings. Resizing an approved creative fits a delivery workflow. Recreating its manual composition belongs in an editor.

Read and build a transformation URL

Vyso's public delivery host is https://cdn.vyso.io. Each operation occupies a path segment. Parameters follow a colon, with commas separating multiple values in the same step. Slashes separate successive operations.

In the examples, ASSET_ID.jpg means the actual source asset key, including its original extension. Replace it with the key from your library. The URL requests a representation of that asset.

A brightness adjustment uses a multiplier:

https://cdn.vyso.io/brightness:value=1.1/ASSET_ID.jpg

Here, 1.1 requests increased brightness. It is a setting to inspect on your image, not an instruction to correct every upload. Other documented adjustments include contrast, gamma, saturation, grayscale and sharpening.

The sepia effect needs no parameters:

https://cdn.vyso.io/sepia/ASSET_ID.jpg

Effects such as vignette, pixelate and border have their own parameters. Use the transformation reference for canonical names and accepted values. Build a recipe for the treatment you need; adding more operations is not inherently an improvement.

Build a recipe for a specific placement

Choose the placement's geometry first, then add the visual treatment and output encoding. Keep the recipe short enough to review as a set of deliberate choices.

A square product card

For a landscape source large enough to support the requested dimensions, scale proportionally to a height of 800 pixels, take an 800 × 800 center crop, then apply chosen brightness and sharpening settings. Finish with an explicit WebP output:

https://cdn.vyso.io/resize:height=800/crop:width=800,height=800,focus=center/brightness:value=1.1/sharpen:value=1/format:type=webp/ASSET_ID.jpg

The geometry defines the card. The tonal and sharpening settings are example choices to review, especially where product color or surface detail matters. Keep the source key's .jpg extension even though the delivered representation is WebP; the format step requests the output format.

format:type=webp and quality:value=80 are separate operations. If adding an explicit quality setting, place it after the selected format and inspect the result. For decisions about dimensions, encoding and compression, use the separate image quality and performance workflow.

A subdued background

A background treatment can use a width-only resize, grayscale conversion and blur:

https://cdn.vyso.io/resize:width=1200/grayscale/blur:value=2/ASSET_ID.jpg

This keeps the source aspect ratio while requesting a different visual treatment. The blur value is a supported parameter, not a promise that any text placed over the image will be readable. Check the image with the actual overlay and layout.

Treat crop and transformation order as intentional

Cropping selects a region from the image at that point in the chain. It changes composition. A one-dimensional resize scales proportionally; it does not make the same compositional decision.

Consider a 1600 × 1000 source. Resizing it to a width of 800 produces an 800 × 500 image. A subsequent 800 × 500 crop keeps that whole frame. Reversing the operations first extracts an 800 × 500 region from the larger source; the subsequent width-800 resize leaves that region at the same size. Both outputs are 800 × 500, but they show different amounts of the original scene.

Crop focus values include center and top. Choose an anchor deliberately and inspect where the subject falls. A standard anchor can be useful across a group of similarly composed images; a manually composed campaign crop may deserve a separate edited asset.

The chain runs in URL order. Keep that order consistent with the approved recipe, including where effects and format conversion occur. Not every reordering produces a visible difference, but the sequence is part of the requested representation.

Save repeated recipes as presets

A preset stores a reusable transformation configuration. It can give a repeated placement a short URL and a shared recipe instead of having each application maintain its own long chain.

After creating a preset with the slug product-card and the card configuration above, request it through:

https://cdn.vyso.io/preset/product-card/ASSET_ID.jpg

product-card is an example name for a preset you create, not a built-in treatment. Preset configuration is workspace-scoped. The delivery preset guide explains the model, and the Developer API reference covers authenticated creation and updates.

Keep a small shared set of recipes for repeated placements, with a person or team responsible for reviewing changes. A saved preset makes a configuration reusable. Brand approval and decisions about which applications use it remain part of your workflow.

Keep the set of variants finite

A configurable transformation service makes it easy to accumulate nearly identical outputs. Widths of 790, 800 and 810 pixels, combined with many brightness and effect settings, can leave a team maintaining variants nobody deliberately chose.

Define useful widths and a small set of named treatments. Keep the operation order, parameter spelling and values consistent when generating URLs. Use presets for repeated placements and direct chains for deliberate exceptions.

If a user-facing control previews many settings, decide which chosen values the application will retain and publish. A temporary preview does not need to become a permanent recipe or a new library asset. Record enough context to know what a published recipe is for.

Reuse stable URLs and verify updates

A stable recipe and URL identify a reusable representation while the source and preset configuration remain unchanged. Vyso's caching documentation describes reuse of generated variants and exposes cache behavior through response headers.

Inspect Cache-Control and related headers when investigating delivery. Avoid adding a changing timestamp to an otherwise unchanged URL merely because a page was rendered again. Do not assume a permanent cache lifetime or that every cache already holds the result.

Changing a source or saved preset can change what a stable URL should return. Account for cache invalidation and verify the output received by consuming applications. For a materially different treatment, a new recipe name can also make the intended change explicit. That is an application naming decision, not an automatic withdrawal mechanism.

Check the representation in its consuming application

The frontend supplies layout, responsive-image markup, alt text, loading behavior and priority. The delivery URL supplies the requested image output. Include that URL in the application or publishing system that controls the placement.

Before reusing a recipe across a library, check:

• Whether the crop retains the intended subject and has the expected dimensions.
• Whether adjustments preserve important color, texture and detail.
• Whether the treatment works on more than one source, including an awkwardly composed image.
• Whether the preset or direct chain used by the application matches the reviewed recipe.
• Whether a changed source or preset reaches consumers as intended after caches are considered.

Keep independently meaningful creative as its own asset. For reproducible presentation variants, retain the source key, recipe and placement together so the next export request can use the same delivery configuration.