I'm having trouble understanding how to create icons for macOS 11. I know the new correct design is to put your image inside of that squircle shape, but I'm having trouble figuring out how to do that. To add to my problem, I wanted to design the icon to look like Xcode or Preview or Garage Band, etc...where there is a "tool" shape that hangs off of the edges.
The app I'm designing for is a utility app. So my icon has kind of a wood texture shape in the middle on top of a white background. And then I have a tool shape sitting on the bottom right corner hanging just off of the edge (like the preview icon).
The HIG allows for design like this on third party apps, but it also give the guidance to use icon images that are NOT rounded and are flattened; allowing the system to round the edges itself. However, this would make it impossible to add a secondary shape that extends beyond the squircle. So I downloaded the photoshop design kit for macOS 11 and used that to generate my icon images. That works OK. But even though I'm using the masking and the alignment grid, the icon, once imported to Xcode, doesn't look right. The proportions are all wrong. The squircle shape is the wrong height relative to the system and Apple Pro Apps. The tile shape itself is the same height as the Xcode icon including the blue tile and the hammer. So I even just removed the tool shape and just used a plain tile square image that I dragged directly to Xcode. But when running, the icon's proportions are still much bigger than the system icons.
This was all done with just plain flat PNGs and using the Photoshop macOS kit. I don't have a Sketch license to try this out. But I'm thinking about later trying to do the Adobe XD template. The best I can tell...the mask size in the Photoshop template file is the wrong size.
Is there something I'm missing? Should I just buy Sketch and use that?
The app I'm designing for is a utility app. So my icon has kind of a wood texture shape in the middle on top of a white background. And then I have a tool shape sitting on the bottom right corner hanging just off of the edge (like the preview icon).
The HIG allows for design like this on third party apps, but it also give the guidance to use icon images that are NOT rounded and are flattened; allowing the system to round the edges itself. However, this would make it impossible to add a secondary shape that extends beyond the squircle. So I downloaded the photoshop design kit for macOS 11 and used that to generate my icon images. That works OK. But even though I'm using the masking and the alignment grid, the icon, once imported to Xcode, doesn't look right. The proportions are all wrong. The squircle shape is the wrong height relative to the system and Apple Pro Apps. The tile shape itself is the same height as the Xcode icon including the blue tile and the hammer. So I even just removed the tool shape and just used a plain tile square image that I dragged directly to Xcode. But when running, the icon's proportions are still much bigger than the system icons.
This was all done with just plain flat PNGs and using the Photoshop macOS kit. I don't have a Sketch license to try this out. But I'm thinking about later trying to do the Adobe XD template. The best I can tell...the mask size in the Photoshop template file is the wrong size.
Is there something I'm missing? Should I just buy Sketch and use that?