CoryT87 Posted January 25, 2017 Share Posted January 25, 2017 How do I export images to match Apple's Icon requirements? Quote Link to comment Share on other sites More sharing options...
A_B_C Posted January 25, 2017 Share Posted January 25, 2017 Hi CoryT87, and welcome here! Are you talking about iMessage stickers? If so, have you seen the following page? https://developer.apple.com/stickers/ There you will find plenty of information on the required format, and there are also Photoshop templates you can open in Affinity Designer. What regards exporting your artworks, I believe you can meet the requirements quite easily by using the Export Persona. The in-app help files provide ample information on using the Export Persona. Just go to Help > Affinity Designer Help > Export. Hope that helps! If not, please drop a line … :) Alex Quote Link to comment Share on other sites More sharing options...
Uuiop Posted January 26, 2017 Share Posted January 26, 2017 Hi CoryT87 and welcome. Further to ABCs reply, if you just want to make a simple icon for the Mac Finder, you can select the area you want to use in an image, and make a screenshot (cmd-shift-4). Open this in Preview, Select All (cmd-a) and Copy. Now use Get Info (cmd-i) for the file or folder to which you want to add the icon, click on the icon in the top left corner and paste it there. Using the same Get Info method, you can copy and paste icons between files too. A_B_C 1 Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 I was able to get it, but I need help with getting a transparency background for Xcode. I've checked the box in the document settings for transparency background and even hid the white background, but when I export as PNG, I get a gray background. I don't want this as I'm using it for my iMessage sticker packs. Can you please help? Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 3, 2017 Share Posted February 3, 2017 You will have to set the Matte parameter to transparent (“red diagonal strike-through on white canvas”) before exporting, and it should work. This setting is accessible right away in the Export Options panel of the Export Persona as well as by clicking the More … button on the standard export dialogue (my screenshot). Hope that helps … :) Alex Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 Thanks for the info, but when I export for some reason the gray background shows a little bit because of the slice. Can you help with this? Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 Also, when you create a rectangle, why does it not line up with the grid? The only thing that snaps to the grid is the resize window. Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 3, 2017 Share Posted February 3, 2017 Hmm … I am sorry but I am not completely sure what you are talking about. The “grid” in my screen shot is just a checkerboard pattern meant to tell you that the document has a transparent background. It is not a design grid. Is that what you mean? :unsure: Well, actually you could adopt the following workflow: Create a new document with a transparent background. Make sure that it shows the checkerboard pattern. Create your icon design Go to Export Persona, create a slice, make sure that “Matte” for this slice is set to transparent, and export to an alpha channel aware file format like PNG You shouldn’t see any grey background in your exported image file Does that help? :) Alex Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 3, 2017 Share Posted February 3, 2017 Hmm … I just reread the whole thread … what do you mean by “the gray background shows a little bit because of the slice”? :unsure: Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 I'm trying what you said but I set the artboard to the size I want then I try to slice the image but it's apparently two different sizes on the slice part. Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 how to do i add screenshots for you to see what im talking about Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 Here are some screenshots so you can see what im talking about Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 3, 2017 Share Posted February 3, 2017 If I understood you correctly, you simply want to export the artboard as a whole and are not interested in the slice called “slice 1”? Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 Correct. But according to the Persona, the artboard is a different size than the regular artboard. Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 3, 2017 Share Posted February 3, 2017 Hmm … this is weird. I would perhaps delete all existing slices (not your design layers and not the artboard itself, to be sure) and create a new slice from scratch, just to see if the issue persists. :unsure: Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 what chat service do you use? It'll probably be easier if we use a chat service Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 3, 2017 Share Posted February 3, 2017 I am sorry, I have no chat service, and it is unfortunately already a bit late on my side of the planet, so I fear I will have to log off now … but maybe you can upload your Affinity Designer document and I will have a look tomorrow morning. :) Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 3, 2017 Author Share Posted February 3, 2017 Ok, here's the file. icons.afdesign Quote Link to comment Share on other sites More sharing options...
R C-R Posted February 4, 2017 Share Posted February 4, 2017 I think the problem is buried at the lowest level of the Snow Icon group in the Cloud subgroup are two very large rectangular curves (5403.2 pt wide by 8607.9 pt high) that a mask in the subgroup layer above them mostly hides. The lowest one seems to be empty so it can be deleted without changing anything. The blue one with the gradient could be resized to fit completely in the artboard, but you would have to change its gradient to maintain the same appearance. It would simplify things a lot if you released the mask, making it a pixel layer, & applied the blue gradient directly to it. You could then get rid of all the subgroups, something like the attached. icons simplified.afdesign Quote All 3 1.10.8, & all 3 V2.4.1 Mac apps; 2020 iMac 27"; 3.8GHz i7, Radeon Pro 5700, 32GB RAM; macOS 10.15.7 Affinity Photo 1.10.8; Affinity Designer 1.108; & all 3 V2 apps for iPad; 6th Generation iPad 32 GB; Apple Pencil; iPadOS 15.7 Link to comment Share on other sites More sharing options...
A_B_C Posted February 4, 2017 Share Posted February 4, 2017 Hi Cory, thank you for your file. It seems your main issue is that you apparently get two different document sizes in the Draw Persona (1024 x 768) and in the Export Persona (3072 x 2304). Well, the explanation is simple, as soon as you have a look at the selected document units: Draw Persona (“Document Setup”): 1024 x 768 points @ 216 dpi Export Persona: 3072 x 2304 pixels Though this is not entirely clear from the user interface, please have in mind, that the Export Persona is basically a pixel-based environment, and the document dimensions you have selected during the document setup process are translated to pixel values, as soon as you enter the Export Persona. This is the explanation for the difference that you are seeing. Sorry, I had missed this tiny detail on your screenshots yesterday. I hope my explanation will help you. :) Alex Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 4, 2017 Share Posted February 4, 2017 R C-R … hmm … seems I cannot find the layer you are talking about in the original file. The PNG is just fine on my machine … :unsure: Quote Link to comment Share on other sites More sharing options...
R C-R Posted February 4, 2017 Share Posted February 4, 2017 R C-R … hmm … seems I cannot find the layer you are talking about in the original file. The PNG is just fine on my machine … :unsure: I downloaded the icons.afdesign file Cory provided in post #18. The layers I am talking about are highlighted in this screenshot: The Transform panel shows this for either of them: EDIT: Double click on the thumbnail of either of these layers in the Draw persona to zoom the view to fit them in the window. Note that they are much, much larger than the artboard. Do you not see the same thing? Quote All 3 1.10.8, & all 3 V2.4.1 Mac apps; 2020 iMac 27"; 3.8GHz i7, Radeon Pro 5700, 32GB RAM; macOS 10.15.7 Affinity Photo 1.10.8; Affinity Designer 1.108; & all 3 V2 apps for iPad; 6th Generation iPad 32 GB; Apple Pencil; iPadOS 15.7 Link to comment Share on other sites More sharing options...
A_B_C Posted February 4, 2017 Share Posted February 4, 2017 Oh, I see … thank you. Yes, I agree, this is a somewhat uncommon document structure … :) Quote Link to comment Share on other sites More sharing options...
CoryT87 Posted February 4, 2017 Author Share Posted February 4, 2017 So how should I have it set up then? I was using points because that's what's used for Apple's devices. Quote Link to comment Share on other sites More sharing options...
A_B_C Posted February 4, 2017 Share Posted February 4, 2017 Could you please describe the intended use of your image a little more closely? And could post a link to the Apple developer resources you are referring to? What document type is required in your case? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.