Some feedback & feature requests

McKinley
1

First of all: Love this!

I’m a Design System Designer and I have been wondering if we could use SF symbols in my teams iOS app. However, drawing them with Apple’s template in Figma or Illustrator was literally crazy-making. It’s not intuitive for the my being used to drawing 24x24 pixel viewboxes with flattened paths having to transition to points and things that feel like font metrics and such, so I’d never pursued it. After using McKinley for 4-5 hours today it feels possible that I could actually create all the custom sf symbols I need - but I took some notes as I was using it…hope this isn’t too out of pocket.

Great stuff:

  • I am familiar with Glyphs and typeface drawing, so I appreciated some of the familiar features like the slash, enclosures and badges that work similar to diacritics for fonts.
  • The easy way to swap between the ultralight, regular, black
  • Being able to pull in SF symbols to start from
  • Syncing with an existing asset catalog (!!!)

Features I kept wanting in my workflow

  1. For the slash/enclosure/badges I would love to be able to edit the “masters” for those - right now it’s not clear if that is possible in the UI. For example, for my icons the “viewfinder” enclosure type is a bit chonky at the medium weight and I would like to be able to adjust the weight of those as strokes (though it appears today they inserted as flattened paths). And since my app has multiple icons that require a “viewfinder” adornment being able to apply that same edited “master” to each icon would be ideal.

  2. Related to that :backhand_index_pointing_up: , I would love to be able to define my own adornments— in my app’s icon set we have things that are repeated like a lightning bolt or a sparkle that are applied to multiple other icons.

  3. Each of my icons has an outline and a fill variant and some other variations with slashes, badges, sparkles, e.g backpack, backpack.fill, backpack.viewfinder, backpack.viewfinder.fill etc. I would love to be able to duplicate a variant instead of having to reset the sizing each time. So if I draw backpack.viewfinder and adjust the shapes and stroke alignments, I basically want the same thing for the fill variant, and would just duplicate the outline version and then swap in the filled backpack I already drew.

Some usability roadbumps:

  • I want to right click so many things!

    • In the layers panel to delete a selected path or group
    • Right click in layers panel to ungroup a group
    • Right click to delete a variant in the lefthand preview
      • And a way to suppress the “are you sure” dialog

  • Keyboard controls:

    • In the layers panel want to be able to press the delete key to delete a selected path, group or layer. This seems buggy to me, sometimes it works, sometimes not, I assume it’s because the layers pane is kinda like a different window and the focus is not in the right place?
    • Wish I could key up/down in number inputs to increase or decrease the value (like for setting the position of a guide on the canvas)
    • When a path is selected, I want to be able to press enter to enter path editing mode (the thing that happens when you double click a path) since doubleclicking the a line is a bit hard since the target is small

  • Canvas & visual stuff

    • I wish the gridlines were ~10% darker and showed over the drawn elements, it was hard for me to see as I was clicking and dragging nodes
    • I want to be able to change the font preview on the canvas. My app uses a custom font, and our “regular” weight is lighter than SF UI, and our bold weight is lighter than the heavy weight so it’d help with defining the right stroke weights

  • I kept wanting to click + drag to reorder the variants in the preview

  • In general I wish the the layers and the inspector were integrated into the actual main file window instead of floating in their own windows.

  • Potential Bug? - Changing the Text preview does not effect older files that had Hello World before the text was changed. I would expect this to be either a globally configured setting so it applies to files on opening. However, when reopening a saved icon file after updating this setting, it still shows Hello World.

Misc thought:
Since each icon is its own standalone file there doesn’t seem to be a good way to share settings or configs across files. Maybe for things that I would want to be shared across files, maybe there could be a “workspace settings” file, similar to apps like vscode, where the likes of custom adornments, overrides on built-in adornments, and font-preview settings type things could live? Then I could load that workspace settings file (or whatever) when I open my icons. Indesign also has this kind of concept, having a “library” file vs many “document” files. It would be incredibly useful for folks who have large iconsets to draw without requiring a different way of structuring the app

I am heavily considering using this to redraw the 200+ icons I have in my app! Keep up the great work

2

I will reply to this in more detail later, but I just wanted to say thanks for some great feedback!

A few initial thoughts:

For the slash/enclosure/badges I would love to be able to edit the “masters” for those

It’s not currently possible but should be pretty easy to add – they’re just McKinley files with the symbol aligned to the relevant margin. Good idea.

Slash is the exception at the moment, since I draw it as a McKinley ‘line’, and it has some hardcoded stuff for the dynamic replace (that makes it draw on) – McKinley doesn’t support arbitrary draw-on editing, but I special cased the slash.

But all the badges and enclosures are just regular files.

I would love to be able to define my own adornments

That’s pretty much the same. I could make there be a folder you drop them in, maybe?

Each of my icons has an outline and a fill variant and some other variations with slashes, badges, sparkles, e.g backpack, backpack.fill, backpack.viewfinder, backpack.viewfinder.fill etc. I would love to be able to duplicate a variant instead of having to reset the sizing each time. So if I draw backpack.viewfinder and adjust the shapes and stroke alignments, I basically want the same thing for the fill variant, and would just duplicate the outline version and then swap in the filled backpack I already drew.

My intended workflow for that is you do a new variant “Custom (based on primary)”, then select the proxy and choose Arrange → Detach (which breaks the link but turns it editable).

I agree that the UI for this could be better though. The variant stuff already went through a few iterations, and I’m still not happy :slight_smile:

I want to right click so many things!

I’ll do a context menu audit.

In the layers panel want to be able to press the delete key to delete a selected path, group or layer. This seems buggy to me, sometimes it works, sometimes not, I assume it’s because the layers pane is kinda like a different window and the focus is not in the right place?

I have reworked selection in the layers palette (shipping in 1.0.1), but I should do a focus audit for it too.

When a path is selected, I want to be able to press enter to enter path editing mode

Ah good shout, I missed that one! (My terminology for it is an editing scope, btw – you can do it on groups etc too. It’s kind of copied from Illustrator’s isolation mode, but with some of the things that annoyed me in Illustrator fixed (like escape key to go up a level).

I wish the gridlines were ~10% darker and showed over the drawn elements

I’ll have a look. I could make it configurable if I don’t like it :slight_smile:

I kept wanting to click + drag to reorder the variants in the preview

That’s another no brainer that I just hadn’t thought of yet. Aside from the primary variant (which is special), there’s no reason I couldn’t do that.

In general I wish the the layers and the inspector were integrated into the actual main file window instead of floating in their own windows.

This one is quite polarising I think! I’m going to see how hard it would be to make them dockable.

Potential Bug? - Changing the Text preview does not effect older files that had Hello World before the text was changed

At the moment it’s a document-specific setting, but you can set the default for it in Settings → Document Defaults.

Would you expect it to be app-specific, i.e. it doesn’t save the text differently for each document?

Since each icon is its own standalone file there doesn’t seem to be a good way to share settings or configs across files

It’d be great if you could let me know which things you’d want to share. Margins, I guess? Would you want the canvas rendering colours in there? (They’re also document-specific but with a “settings” default.)

I am heavily considering using this to redraw the 200+ icons I have in my app! Keep up the great work

Don’t forget you can import your existing SF Symbols. It doesn’t convert them back to strokes, but it’s still a starting point :slight_smile:

3

Some of your requests (reorder variants, better right click menus) are in version 1.2.