I have made a mockup of my UI for an iPhone app I'm making in Sketch. How do I calculate the resolution for each object in the UI and how do I export each components as a .png or .jpeg .So (for example) in the Sketch UI the is a rectangle, how do I export only that rectangle as an image and how can I get the correct resolution (iPhone 4-6 is 326ppi, 6 Plus is 401ppi)
Asked
Active
Viewed 71 times
1
-
Have you used the slices tool? Or create art boards? – ErickES7 Aug 09 '15 at 15:31
-
I created art boards – Junaid Aug 09 '15 at 16:56
-
1Sketch automatically exports images for different resolutions with the naming convention used by Xcode. Like image, image@2x, and image@3x. – Vakas Aug 09 '15 at 16:56
-
It's not totally automatic, you would have to define them each export with the appropriate suffix – ErickES7 Aug 09 '15 at 19:17
-
@Junaid okay, and you want to export individual components, correct? Not an image of the mockup – ErickES7 Aug 09 '15 at 19:18
1 Answers
1
So, this is why I LOVE Sketch 3, the export tool in the inspector. Check out this video they provided.
They're different ways to export using the inspector:
- Exporting Art Boards: select an art board and in the right hand panel there'll be an export set up to export in PNG
- Slices: this one allows you to fully customize what to include in your export, layers and a background, etc
- Grouped Layers: I believe you can also export grouped layers as well. Same inspector as a slice or art board
I hope the video helps :)

ErickES7
- 558
- 6
- 16
-
-
Welcome!(: love sketch for its export stuff check out their other videos, lots of cool stuff – ErickES7 Aug 09 '15 at 20:39