I’ve always been a stickler for good looking UI. To that end, I actually have very positive things to say about a lot of the work Apple has done in this space – a few people at work have even jokingly called me a traitor because of my iPhone J
With the original release of Paint.NET v1.0, one mantra I applied to any UI was, “If it isn’t good enough to look like it could be in Windows or Office, then it isn’t finished.”
Oh man, you should have seen our horrible and ugly File->New dialog before I laid down the law on that! J Chris Trevino was a bit fed up with me the day I forced him to do fit-and-finish on that dialog. In the end he agreed it was very much worth it though. (This was over 3 years ago.)
The point is, I made darn sure that the dialogs in v1.0 had good looking and consistent spacing, alignment, ordering, etc. Over the years I’ve continually made changes to Paint.NET to improve its aesthetics in ways that either didn’t hamper, or that even improved, functionality. For 3.0 I spent a lot of time just playing with the color scheme in the toolbar in order to find something that looked great in Windows Vista. I settled on solid white – go figure! A UI that is pleasing to the eye is much more satisfying to use than another UI that is otherwise functionally identical but that is an eyesore. Every once in awhile I’ll see some other application where it’s obvious nobody spent anytime worrying about this stuff, and it’s painful. I’d write more but it’s Friday and I really need to go drink a beer.
Anyway, I could go on and on about this, and hey maybe I will another time (who wants to hear my thoughts on UI and UX* design? Anyone?). The real meat of this post is that I just wanted to show two quick changes to the UI in Paint.NET v3.10 that don’t change its functionality at all, but that do enhance the user experience by way of just being better looking. In UX, I consider these changes to be two “inches” worth of progress. They aren’t changes that would necessitate a release by themselves, but it was fun to throw them in for this upcoming v3.10 release.
The Layers Window – Finally, Some Fit ‘n Finish
The differences are subtle, but it fixes something that’s nagged me for awhile (namely that the Layers window looked like it was from 1995). First, you’ll notice there is no static-sized border around each layer’s preview area. The black 1-pixel border is now fit to the size of the layer, and the standard drop shadow is also added. This is something I have really disliked for awhile because the old borders “clumped up” on the vertical edges so we ended up with a 2 pixel vertical border, but a 1 pixel border on the horizontal edges.
Second, the blue selection highlight extends the full width of the layer row. The checkbox area in particular now looks more correct.
The Image List – Okay, I made the ‘X’ look better
So I’ve had a few (two or three) complaints about the rendering or aesthetics of the close/’X’ in the image list. I didn’t really notice or care much myself, but I was in a good mood about a week ago and figured, “Why not?” So I adapted the ‘X’ image that’s used for Edit->Cut and that I also saw used in some of the stock Vista Sidebar Gadgets for their “close” buttons. I think it looks a little more stylish, although it might not be noticed by most people. That’s ok. For future releases I’ve also got my eye on the image list dropdown icon (the white-with-black-outline down arrow in the “new” screenshot right above), and the “this image has unsaved changes” orange asterisk.
Like I said, these are minor changes that do nothing to affect Paint.NET’s functionality or ease of use. Hopefully they will add one or two points worth of “warm fuzzies”. And hey, those warm fuzzies add up!
Stay tuned. I’m hoping for a beta release of 3.10 this weekend!
* “UX” stands for User eXperience. It’s a term that includes the user interface and the experience of using it as a complete unit. For example, you might refer to the workflow of pasting an image as “a UX”. You could say that you “improved the UX” while in fact you may have removed some UI.