Matt Gemmell

TOLL is available now!

An action-thriller novel — book 2 in the KESTREL series.

★★★★★ — Amazon

UI feedback request

development & interface 2 min read

Feedback solicited on an application UI mockup.

When I was recently working on an icon which represented the concept of UI design, I had an idea for an OS X application. It seemed to me that there’s a hole in the developer tools in terms of icon design; they don’t include a tool to help with the assembly of icons for our applications, IconComposer etc notwithstanding. Ergo, I’ve been designing an app to help with that task.

It’s important to note that this is not a general-purpose image editor. The target market for the app is Mac OS X developers (Cocoa, Carbon, AppleScript Studio, REALbasic and so on) who want to create or assemble icons for their own software, in a few standard styles: application icons, document icons, plugin icons, and possibly some others like icons for disk images and so on. The presumption is that these people can’t afford to hire a professional design house, or don’t want to for some reason, and that the types of icons they need are relatively standard.

The basic workflow is that, upon creating a new document, the user will be asked which type of icon they want to create, from a list with mini-previews of each type. They will then be shown the document window, which you can see here. (Here’s a full-size version.)

When an Icon Element is selected on the left, you can see a description of it in the pane below, much like in Automator. Double-clicking an Icon Element, or dragging it into the canvas in the center of the window, will cause it to be added to the icon. All of the current Icon Elements are shown in topmost-first order in the Layers list on the right. The drawer displays appropriate controls for configuring the selected Layer. Finally, there are some controls below the canvas for determining how the icon preview is displayed; the Canvas Background color is for display purposes only, since icons will naturally be exported with transparent backgrounds.

There will likely be more Icon Elements than are shown in the screenshot, and those ones are just for application icons; different Icon Elements will be present for other icon types (such as Page Curl and File Extension Text for document icons, and so on). Likewise, there may be more options than are shown for the “Document Page” Icon Element; I’m not asking for feedback on those aspects.

What I’m interested in is general feedback on the UI and the app concept. I’m particularly interested in your thoughts on the following areas:

  1. Should there be a more explicit way to add an Icon Element to the canvas, in addition to double-clicking or dragging?
  2. Saving the document will save in a custom format which can be reopened and edited again later, naturally, but users will be more focused on saving icon graphics (PNGs, TIFFs, or whatever). Is it sufficient to simply offer an Export command in the File menu, or does this need to be made more obvious in the UI?
  3. Does any of the terminology strike you as awkward or inappropriate? E.g. "Icon Elements", "Layers", and so on.

General thoughts and feedback will of course also be gratefully received. As a technical side-note, I’ve done a few technology experimentations with using Core Image for compositing, perspective distortion and such, and it rocks. The app will use Core Image, and will thus be Tiger-or-later only. Lastly, any suggestions as to what to call the thing would be handy.