Annoying UI bits...

Thank you so much for taking the time to post on this, and for working up the mockup image.

I agree with you about the spacing. My only concern is that when you click the donation button it goes away. In the current design, this gets rid of any imbalance on the left. In your design, it may leave the right area feeling empty, but that may not be a bad thing.

I will play around with your suggestions and post back before releasing an update.

Thanks again!

I have made some tweaks, check out these screenshots.

I moved the "Test Window" button up to the top right as well, and expanded the width of the "Resizing/Zooming" segmented button.

I would appreciate hearing what you think on these. I'm very open to continue adjusting the design.

First, with donation button enabled.

Second, enabled without donation button.

Third, with donation button disabled (so uninstall button is visible.)

I like it, I think it is much better like this. The only thing that disturbs me a little is the lack of a common baseline between the typographic elements ("SizeWell plugin is enabled/disabled" vs. "Test Window"), which is not something easy to solve due to it's differente body sizes... I think it was better when Test Window was on the other box, but I understand what you say about the empty space at right (maybe if the box height were a little smaller that space wouldn't disturb that much).

On the other side, a little more playful but uncertain as an idea I have to admit, I thought about integrating those two big top boxes in one, but I didn't have the time to came out with a satisfying resolution. The current elements there are very large, I'm not sure but I think that there may be a way to handle its proportions to make it a little more subtle and unified in less space.

I mean, the enabled/disables switch has an almost screaming size, plus the Rezising/Zooming buttons evidences an extremely forced large width. I guess you've already tried something around this kind of suggestions, but well, I had to spell out the idea.

Thanks for your attention and work!

Still tweaking, would like to hear what you think of this round.

I took your advice and moved the Test Window button back down, but put it on the right side. To fill out the top area more I changed "SizeWell plugin" to "SizeWell SIMBL Plugin" which made the language a more consistent with what is in the installer. But, the install/uninstall plugin button still says "SizeWell plugin" for lack of space.

If you're worried about the space inside the "Uninstall SizeWell Plugin" button, you could always just rename it to "Uninstall." I think it's sort of implicit as to what the button's function is, and with less text, you can make the button larger in height so it can make better use of the space on the right of the "enable/disable" slider. Maybe you could insert a giant red rectangular button ala iOS style that lies flush with the height of the slider on the left.

I really like how that button looks!

The only thing is... if I were to call the button "Uninstall" I would want to add the ability for the button to fully uninstall SizeWell, the current uninstall leaves the prefPane, that is why I called it "Uninstall SizeWell plugin". But, I can add that functionally. First it will offer to remove the plugin, and then offer to remove the prefPane.

I am gonna give an attempt to recreate this style button and post back with my results. Thanks so much for your advice and insight.

One issue with having the button be a full uninstall...

If the user uninstalls the plugin and leaves the preference pane... from that point the button should be able to either reinstall the plugin, or unstinall the preference pane to finish the full uninstall. The issue is: what should be button label be, since there are two choices? Install or Uninstall. So maybe thats an argument for just leaving the button to never be able to uninstall the preference pane (which can be uninstalled by right clicking the SizeWell icon in the main System Preferences view).

I am playing about with the custom button. I need to stop messing with it for a while though. I have other (paid) work I need to focus on.

For a very simple change (before I finish be custom button), how do you think this looks?

It looks good so far. I know the button I mocked isn't grounded at all in any existing UI elements within the standard graphical library of Interface Builder or any other developer tool, so it's effectively going to be an image that changes state on click to show the depressed button. For the purposes of quick testing though, it looks good.

Alright, not sure if I am totally satisfied with these, but figured I would show you what I have so far... Both install and uninstall buttons with normal and pressed states.

Maybe make the "install" button green to stick to "traffic light" color psychology where green initiates something and red stops it. There is an awful lot of grey in the config window, so bright colors might also want to be desaturated maybe by 10% or so, such that they stand out without being excessively obvious. The font inside the button itself should be lowered by a point or two perhaps? Again, the button stands out well as is, and bigger fonts might make it almost stand out too much, if that makes sense.

For more UI consistency, I'd say take one of the metallic rectangular pill buttons on the very bottom and find a way to recreate them with slight color saturation in green and red variants. I could create some mockups, which would be a lot more helpful.

The color of this new button is a little more mellow looking.

If you would be willing to create some mockups, I would definitely appreciate it! My photoshop skills (actually using Pixelmator) are very novice.

I have a minor update ready to roll, I am considering releasing it with the buttons I have worked up.

Any new buttons can definitely get implemented in a later update.

Marking this topic as implemented...