Mobile app version of vmapp.org
Login or Join
Martha945

: My sketch exports seem to be pixelated even when am exporting it to 1x I have noticed that my exports are not as sharp as they look in the Artboard. To give an example am trying to export

@Martha945

Posted in: #SketchApp #Vector

I have noticed that my exports are not as sharp as they look in the Artboard. To give an example am trying to export the Google Play Badge from this dribble file: dribbble.com/shots/1849549-Free-Vector-App-Store-Badges
But the text seems to be blurry.

10.04% popularity Vote Up Vote Down


Login to follow query

More posts by @Martha945

4 Comments

Sorted by latest first Latest Oldest Best

 

@Rambettina927

Don’t trust the preview

The export preview is just there for convenience*. You'll noticed that if you create additional exports for the same asset, there's still just one preview.

Pixel view is your friend

If you want to see the non-vector degradation, just switch on View > Canvas > Show pixels (aka cmd + opt + p). Now switch to 100% zoom and you'll see your work in all it's pixelated glory.

The exception

Sketch assumes you're building interface assets, not retouching your girlfriend's lazy eye. It's geared toward png. If you want to see how bad the jpg compression is, you'll need to export and check it in a browser or your favorite image viewer.

* You can actually drag the export from that thumbnail to a folder, if you want

10% popularity Vote Up Vote Down


 

@Smith574

I was having this same issue. I have one of the new (retina?) Mac Pros. The default export setting is at 1x size. When I upped it to 2x and 3x, the resolution got better and better. 3x was optimal. Give that a shot!

Conclusion: Within Sketch 3, my art board looked sharp and was not pixelated. When I exported the board as a PNG or JPG, its default 1x export size yielded a result that seemed pixelated. When you up the export size to 3x, it should come out just as it looks within your Sketch app - sharp and beautiful! Note, you can see these changes in real time on the right hand side of your screen when you're playing with export settings. As soon as you click 2x and/or 3x, you'll notice the difference right in the export preview window.

Hope this helps!
Cheers

10% popularity Vote Up Vote Down


 

@Nimeshi706

This is a user interface problem.

If you examine actual pixel dimensions of the export preview item in your screen capture, the actual pixel dimensions of the preview are about 370 x 113 pixels.

If I am reading the screenshot properly, then your actual export settings appear to be 130 x 40 pixels.

The export preview is rendering an image as 130x40 and then stretching ("zooming" or "enlarging") that image by 3x when showing it to you.

This may be a byproduct/problem with the software UX running with high-density settings or MacOS "retina 2x" where the UX is being rendered at high pixel dimensions but simulating a 1920x1080 resolution (etc)

10% popularity Vote Up Vote Down


 

@Berumen635

I have downloaded your file from Dribble and export all 3 buttons in the file and the exported files are not blur at all at any size (1x, 2x, 3x). For the preview thumbnail image that you see at the right in the export section, I guess it is always blur like that :)

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme