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 Old:
The New:
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
The Old:
The New:
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.
paint.net blog 
Me! Share a bit if you’re so inclined. I like what you’ve got in Paint.Net — what else is on your mind?
Awesome, Rick.
Details are important in every aspect of life… in these details we see the love the developer have to his ‘child’ (program).
Leandro
I seconds Chris.
I’d also be interested in your thoughts.
I’ve tried fixing ugly, disorganized, seriously dysfunctional UI on open-source projects and had my changes shot down. It’s nice to see that some third-party programmers do realize that UI should not be a one-to-one graphical mapping of how things are implemented in code.
My Paint.NET pet peev is this: often I want to work on small images at high zoom levels (icons, etc) but when I want to edit the left or right edges of the image the darned tool windows are always in the way! It would be great if you could dock the tool windows to the side of the main window, Visual Studio-style. (Yes, I know this would waste a lot of screen real estate; my screen’s pretty big, I don’t mind)
> It would be great if you could dock the tool windows to the side of the main window
Alternatively, you could allow the window to scroll off the “edge” of the image a little way, if you know what I mean. Probably less work that implementing docking tool windows 🙂
I was thinking of switching to paint.net and installed it this afternoon, and I totally argee with tthe docking thing, that would be one way to solve my problem.
I’m currently working on a image (800×600) on a screen (1280×1024) and theres nowhere I can put the smallest color pallet (aprox 260×300) that doesn’t overlap my image when at 1:1 zoom. crazy.
sorry if I’m missing something, please feel free to email me if i am.
Paul.
I also agree with the docking thing, it has to be the outstanding reason why I am still using classic MSpaint. I hate floating tool/palette windows.
Hi
Sometimes I think I should be put in a quiet room and taken care of by kindly but firm nurses. I have been using Paint Shop Pro and I like a one pixel rule in black around all my pictures. This seem authomatic in Paint.Net which seems, in many ways, the superior program. Yet, reading the correspondence above it seems automatic. How am I missing it?
One more thing (don’t you hate that when they put it in e-mails?) on Paints Shop Pro I can ask them to sharpen the image. I know it is a trompe l’oeil but I like it. Does that exist as well under another name?
Gareth sitting on his own in a room in Bangkok and wondering if he is being unduly dense.
What you have done is all well and good. Improvements to aesthetics is always a plus; except when it takes the place of functional improvements. I hope in a future release that you and your team will make docking tool windows as easy as docking a toolbar in MS Office. That being said I really can’t complain. You all have designed a good program with more potential than I have seen in Photo Shop or Correl. And you all have a better attitude towards users than these other companies have towards paying customers. Thanks for all your hard work.