Blueprint Icon is a Mac app for making quick, throwaway app icons for experimental projects and similar. It’s not designed for creating professional artwork for shipping apps, so it has limited options — just enough so that, if you have a bunch of different R&D projects installed on a test device, you can quickly pick each one out of the crowd.
This isn’t an officially-supported Wooji Juice app. It’s a quick hack I threw together for my own use, and made available to others strictly on an as-is, use-at-your-own-risk basis. It doesn’t even have an auto-updater!
Blueprint Icon requires macOS 10.15 “Catalina” or later.
(If you’re curious, it’s a native Mac app written using SwiftUI.)
Open the app, and open the “Emoji & Symbols” viewer — clicking on the “Command” ⌘ icon should do this, or use the Edit menu command as normal.
- Drag-and-drop a symbol from the viewer onto the canvas.
- You can only drop one symbol at a time.
- But you can drag-and-drop font variations from the palette. You may get higher-quality results by doing this, as the drag-drop includes font information, which the app can use with a higher-quality renderer.
- You can also type into the text field, but it’s not really designed for long text.
- If you type more than one character, you’ll probably need to adjust the slider to reduce the glyph size, otherwise it’ll do something weird (either stretch the icon in ways it shouldn’t, or more likely show “…” instead of the glyph) ¯\_(ツ)_/¯
- If you’ve dragged something with a weird font, you might need to drag something with a regular font to reset it before typing into the text field ¯\_(ツ)_/¯
- You can change the background pattern and colour.
- The first colour swatch is a hand-picked “blueprint-style”. The other colours are default system colours.
- System colours depend on whether you’re in Light Mode or Dark Mode! This is… weird, and bad UI design, but since it does nearly double the number of colour choices you have available, I kept it :)
- You can drag the symbol around inside the icon to reposition it. Centred generally looks best, but you might find this useful when using glyphs that are themselves off-centre (e.g. ”™”), or to achieve a particular effect.
- Double-click on the canvas, or use the “Recentre Glyph” menu item, to reset it to the centre.
When you’re done, Command-E will export a single 1024x1024 .PNG containing your icon.
Or Command-Shift-E will make a folder and fill it with a whole bunch of images at different sizes, corresponding to various iOS and Mac icon requirements, in various resolutions (1x for non-Retina, 2x for standard Retina, 3x for “Super Retina”). There are some duplicates — e.g. 128px @ 2x is the same as 256px @ 1x — but this is intentional to make it easier to find what you’re looking for when setting up assets in Xcode.
Note that when exporting at different sizes, some of the details are scaled differently (e.g. the smaller icons aren’t just the 1024x1024 image scaled down, but at redrawn for each size). This is also intentional, so that (for example) the stripes filling the symbol don’t get washed down to gray. For very tiny icons, it fills the glyph in solid white instead of stripes, as they’re pretty much incomprehensible otherwise.