The Problem with Cross-Stitch Pattern Previews

Contents

• What Should a Pattern Preview Be?
• Why Some Are Misleading
• How to Spot Unrealistic Previews
• Browser Image Rendering

Introduction

Whatever size or style of cross-stitch pattern you do, it represents a cost in the form of equipment, material and threads as well as time and effort. For smaller samplers it’s usually very clear what the final piece will look like so there is little chance of surprises and often the promotional image may be of an already completed piece.

samplers rarely look different to their previews so aren’t an issue

As we move toward larger, full-coverage patterns though this becomes a little impractical. It often takes just minutes for an operator to create a cross-stitch pattern from a photo or artwork image but that pattern could take years to actually stitch. It wouldn’t be practical or cost effective to expect every pattern to be stitched before it was sold, so instead we have to rely on the mockup or preview image to see what the final result looks like.

Unfortunately, these can sometimes be misleading usually showing a “better” result than you will actually get which is disappointing considering you may spend $ hundreds on materials and years working on them. A cross stitch pattern isn’t like a jigsaw where an original photo on the box is appropriate.

Shouldn’t pattern previews be WYSIWYG - What You See Is What You Get?

What Should a Pattern Preview Be?

If you’ve read any of our earlier articles on the technicalities of cross-stitch pattern conversion, you’ll know that there are lots of similarities between digital images and cross-stitch. At a fundamental level, a stitch on a piece of fabric can be equated to a pixel in an image and vice-versa.

Although there are some similarities to buying a jigsaw, which would typically have the original photo on the box, it makes more sense for a cross-stitch pattern to show how the final piece will appear (although there is nothing wrong with showing the original image as well, as long as it’s clear this may not be what you are going to get).

we’re not making jigsaws, so using the original source photo isn’t enough

Most pattern-making apps work internally by producing an image where each pixel is a stitch of that thread color so you’d think that it would be a no-brainer to simply present that image as the mockup or preview. That’s the approach we took with ours because we want it to be clear that the final piece should look like the image on the pattern.

Why Some Are Misleading

But not all do this. I’ve seen some very well-known pattern stores where some of their mockups are actually just the original artwork with a feint grid overlaid on top to give the appearance that it is a real mockup even though it really isn’t. The end result is that the product image is misleading and can look significantly better than how the actual pattern will come out

I don’t know why this is done, whether it is just a lack of understanding, laziness (although it seems like it would be “more” work to do this) or if it’s deliberate to improve sales - after all, which of these images would make you more inclined to buy a pattern:

… the original image?

… or a realistic preview of how the completed piece based on the pattern being sold will look?

NOTE: this pattern is deliberately small & crude to highlight the potential difference between a photo and a genuine mockup - we can make much better patterns than this! More on why it looks “bad” later …

If the pattern is very large the effect will be less dramatic but even so, some image may have detail in a face, for example, with eyelashes clearly visible in the preview but if it was actually shown as a true representation of the pattern, the entire eye would need to be represented within the space of only a few pixels / stitches. i.e. it’s impossible for the detail in the fake mockup to really exist.

But it gets worse - because the original image will inevitably be full-color, that means it can use any of 16 million colors which is always going to look significantly better than a piece reproduced using maybe 60 as per the pattern.

What you see is definitely not what you’re going to get! We think that’s wrong and people should not mis-sell their products in this way.

How to Spot Unrealistic Previews

If you’re buying a pattern that is a very small piece then it should be immediately obvious if the preview is the original photo with no pixelation. A larger piece may not be quite so obvious. One way to tell is to resize the image to the pattern size and check if the detail is still there - things like small detail ending up as a few pixels / stitches show that the preview isn’t realistic.

If you have a photo viewing app, most will provide some kind of “color analysis” for an image and can tell you the number of colors and / or show you the “levels” of the RGB components used. A genuine cross-stitch pattern preview will have spikes and the exact number of colors as the pattern specifies. Here’s that small kitten pattern earlier showing it has 28 colors and clear, distinct spikes at different points of the RGB spectrum:

Compare that to a fabricated mockup - this is for a pattern that has 80 colors but the mockup actually has … 162,468 colors - about 360x times more colors than DMCs entire palette. Notice too that the levels are curves and cover the entire spectrum, a sure sign that the “mockup” is a complete fabrication.

if the product image is so misleading, are you going to be happy with the result?

But even if everyone used accurate mockup images, there are still other technical issues to contend with.

Browser Image Rendering

Browser vendors compete to make their app offer the best internet experience and this includes making web pages look as good as possible. One way they do this is rendering images so that they are crisp and sharp when they contain enough detail (i.e. they are as large or larger in pixels than the space they occupy in the page) but when they don’t, the default is usually to make the image look smooth rather than pixelated.

As there is a good chance that our pattern preview (effectively a relatively small image) needs to be shown at a larger size than it actually is then unfortunately, this means that a browser make take what we should prefer was kept as a pixelated image (to accurately reflect how a completed piece would look) and smooth everything out making it look more like a higher quality version. It’s just the browser doing what it thinks is best and would suit the majority of web-pages - making images look better as the default.

Here’s an example - the top image should hopefully show a smoother image than the more pixelated on below it:

Those are both the same image but if they were shrunk down as a “preview” image on a webpage, the blurred looking one would actually look better and less pixelated than the pixelated one which is the more accurate version.

Fortunately though, we can give the browser a hint of how we want the image to be rendered to ensure that our mockup preview is reproduced as accurately as possible so that it truly represents the pattern that someone is going to buy and the piece that they will create from it.

We hope that pattern sellers phase out misleading mockups in favour of more accurate WYSIWYG images as it isn’t difficult or complicated. People often spend a lot of time and money on this craft hobby and it’s horrible to think that someone could have been misled and end up disappointed with the result, even imagining that they must have done something wrong for it not to come out as promised.

Some of the previews are inexcusable, many I think are more todo with the technical challenges and it’s clear that the stores are trying to provide accurate and meaningful previews to their customers. We’re working on tooling that will make it possible for people to both provide accurate previews AND protect their images and ensure quick site loading - stay tuned!

As always, please like and follow us on our Thread-Bare Stitching Facebook Page or Thread-Bare Stitching Pinterest Channel for news and notification of future articles. We are also excited to announce our Thread-Bare Flosstube Channel come and check it out !