Userform Gallery

Scott Handsaker has started a website that deals with userform design called User Form Gallery.

This site is setup to showcase the best in Userform Design (from both a useability and an aesthetic standpoint). If you are looking for ideas and inspiration for your next interface, then you are in the right place.

Business analysts of the world – rise up and create a beautiful interface! Don’t settle for grey!

I’m really looking forward to reading this site, because I’ve always thought my userforms are poorly laid out. One concern I have about Scott’s site is his apparent fixation with color (or colour, as he says). I haven’t read enough of Scott’s work to pigeon-hole him, but the quote above and these from today’s post

Apart from the default gray (yes, this is a pet hate of mine!)

and

Depressing grey – imagine staring at this all day long!

seem to indicate that any userform created in gray is bad. I have a pet hate of my own: color for the sake of color.

His posts RSS and comments RSS are already added to my Bloglines. I think the posts and discussions are going to be invaluable. Who know, in six months he may have me putting color on my userforms!

Great idea for a site, Scott, and good luck.

Posted in Uncategorized

21 thoughts on “Userform Gallery

  1. Hmmm… Whatever colour you use, one of your users will hate it. Some of them will get eyestrain from coloured screens, no matter how restrained you are in choosing a palette. Grey works in a corporate environment.

    However, paler greys work far, far better than the Windows standard.

    But why not tile the form with a mild ‘slate’ or ‘stone’ texture? Careful choice of colour will leave a nice ‘tombstone’ effect with the important stuff in flat polished-looking textboxes against a mildly textured background that does not distract the user.

  2. Timely Topic. I am trying to develop a strong GUI ‘on the sheet’ as well as in UFs.
    (BTW, “colour” is correct where I come from, too.)

    And gray is my preferred palette (not just battleship gray). To explain, application of human factors design principles in real time a “coat of many colours” approach to use gray-scale backgounds and foregrounds. Colours, shapes and behaviour are used to highligh alarms and unexpected events to get the operator’s attention quickly. It really works! (Scott’s use of ‘Minty Green’ is a nice variation on this.)

    I am trying to apply this to Excel layouts at the sheet level for my applications. Unfortunately, Excel wants us to either specify each line and background specifically, or copy the whole format for each cell including conditional formats and data validation. Also, I find the colour pallette limiting in its use – so here comes more VBA code! I’m looking to set up templates and routines so that its is quick and easy to apply a complement of formats to each cell depending on its intended content, and the ability to to change the template once and have the scheme “ripple” through all the cells that are applicable. (I think Don Quiote might like to take this one.)

    I’m hoping to learn lots from Scott’s site

    Alex

  3. Alex, have you played around with the new document themes and named styles in Excel 2007? Lot of potential in terms of using color in a worksheet without making it gaudy. It’s actually very well implemented and has lots of customization capability. Also, that absurd 56-color palette is history.

  4. John – that’s a great suggestion, I’ll follow up. Unfortunately, where I’m working will probably wait to implement Excel 2007 until 2017 ! I still use xl2K as my main tool.

  5. I know we have different colour settings around the world where some areas are very ‘coloured’ while in other areas it’s restricted.

    # That’s why grey background exist as default and where fields for entries are white and therefore is the best choice.

    By using a ‘coloured’ setting it also distract the end-users, especially from a global and regional perspective.

    # That’s why grey background exist as default and where fields for entries are white and therefore is the best choice.

    It exist end-users that are colour blind (complete or semi) which no colour scheme can compensate for.

    # That’s why grey background exist as default and where fields for entries are white and therefore is the best choice.

    According to some well known marketing rules a message need to be sent out at least 3 times before the audience recognise it.

    Please don’t expect that I will change my opinion when it comes to this part of the UI discussion ;)

    Kind regards,
    Dennis
    (A boring and semi colour blind developer located somewhere in the nothern part of Europe)

  6. I think you are spot on there Dick – I am a little focused on colour. I am getting better, but I still love to change the palette of my userforms 4 or 5 times before they get released to the world. :-) I accept that is probably not a good thing, and I am trying to change!

    Part of the reason I set up the site really – there are no resources out there that I could find which would allow me to compare my work against the “very best”. I don’t know whether people find my “Minty Green” annoying until I put it up there for comment, so this has proved to be a very valuable exercise.

    BTW – I will be re-designing the “Minty Green” again this weekend, and might even do a “battleship grey” version just for Dennis… :-)

    Thanks for the link.

    Cheers,
    Scott.

  7. XL-Dennis might find this thread on Excel.Programming useful: Excel add-in that may help the color blind.

    My own contribution is a bit rambling, but this is the relevant bit to the current ‘Userform Gallery’ thread:

    For dichromats, the theoretical solution is to use the Workbook.Colors()
    property to shift the entire palette, colour by colour, up or down into the
    frequency range that these users can discriminate, leaving larger ‘band gaps’
    around mission-critical colour replacements for red and green if they are
    used for common warnings or data verification cues. Be warned, the
    calculations are not trivial!

    I look forward to the deprecation, demise, and burial at low water mark of the loathsome Excel Workbook Palette. However, I can foresee some interesting artistic effects when you test this feature for backwards-compatibility.

  8. Having just looked at the site and the proposed rework …

    … I think I preferred the grey.

    The worst “improvement” for me is in reducing the usable size of the text-boxes.
    From a functional point of view I want to see information on screen not wasted coloured background (did I mention the new RIBBON in Excel 12?)

    Grey works: it is just there, it does not insult the eyes
    it does not change month to month with the latrst designer’s whim.
    Colour blindness is an issue for some people.
    Colour glare (distraction) is an issue for me.

    As Alex says: I use colours / patterns to highlight alarms / error conditions. They are much easier to spot on a white/grey background. Actually, on a pale grey one they are perfect.

    It’s very sad …

    M

  9. There’s a fair amount of literature on this subject. Sometime ago I got a review copy of “Designing Interfaces” by Jenifer Tidwell. Of course, I imagine there are many other choices at amazon.com and the local bookstore and library.

    Tidwell’s book addresses a range of issues with interface design, not just color. {grin} While it has its flaws, it is definitely worth having in one’s library. However, it is not light reading especially for someone not familiar with the subject and the terminlogy. For more on what others think of it check the reviews at amazon.com.

  10. My favourite site concerning UI topics is former “Interface Hall of Shame”

    http://www.iarchitect.com/mshame.htm

    – today very comprehensive site full of infos like UI design, UI theory, Poor User Interface, Principles of user interface desigh etc. But I am realy very interested in reading topics and best practices aimed just for Excel – definitely I will visit on regularly basis.

    Jiri Cihar

  11. >Mpemba – the form has been overhauled again,
    >and there is now a grey variety.
    >Better or worse?

    Much Better for sure.
    The flow (buttons at bottom right for instance) is much better.

    Without being a user of the form I don’t know if your decision to equalise the size of the three large text boxes is consitent with the amount of text typically entered in them?
    Yes, having them equal makes the empty form LOOK better but …

    If one typically receives 2 lines whilst another normally gets a paragraph …

    The coloured version is awful: not aesthetically but:

    Conventions happen in life: traffic lights are red, green and amber. Get over it. Now many (almost said most) kewl UI designers would start wanting them to be in all sorts of colours (even black) just for interest sake. [OK, think of the blue (hyperlink) vs maroon (visited) convention on web sites so many kiddies mess about with – making navigation.]

    Grey is boring – but it does it’s job perfectly (to let colours which have purpose shine through). I guess I go to work to work and don’t find that endless tinkering with UI layouts, colour schemes, icon designs ets {grr, MicroSoft) does ANYTHING to increase productivity. Give me the same design with more functionality. Sort out the functional weaknesses (going back to Excel 97 and even Excel 4 before forcing me to learn yet another layout of where the controls are.

    If it ain’t broke don’t fix it.
    If it’s just boring, fix something that’s broke first.

    M

  12. Looks can do miracles to productivity. People will use your application far more and far better if they LIKE IT.

    Now what makes people like a gizmo, that is a mystery and the key to almost every success and wealth in history of commerce. But look and feel is a huge part of it. Like, Creative made the first really good handheld harddisk music players. Apple created a navigation wheel, a white surface and a cool name for such a a thing. How is that for tinkering with UI layouts and colour schemes.

    Just for the fun of discussion: You and your wife go out to buy new curtains for your home. She likes vivid colors in simple strong patterns, sort of minimalistic design kind of things. You like rose patterns, baroque motifs, ornaments. You can not find anything you agree on, until an experienced computer geek, accidentially left behind in a curtain store while feeling helpful, says: You should really go for the light grey curtains; RGB(192, 192, 192)! And you say wow, and your wife says why didn’t I think of that, they’re just beautiful, and you go home to enjoy the excitement in exciting ways.

    Best wishes Harald

  13. Hi Harald,

    Not ever having been married I cannot be sure but I was under the impression that when one’s wife likes vivid colors in strong patterns in contrast to rose patterns and ornaments, the last thing one should do is listen to the unmarried computer geek. The *only* proper thing to do is, “Yes, honey, the vivid colors in strong patterns look just perfect.”

  14. Tushar –

    Very astute. When my brother-in-law was planning his wedding, his brother and I spent hours trying to teach him the most important two words in the English language: “Yes, dear.” Five plus years later, he has still not learned his lesson.

    – Jon

  15. Mpemba –

    “If it ain’t broke don’t fix it.
    If it’s just boring, fix something that’s broke first.”

    Good point.

    – Jon

  16. OK, so at work people would like my userforms much better if I gave them embedded streaming media content, movies, music etc. Heck, they could watch the latest blockbuster in between entering data.

    That will have to wait: for now once they’ve been shown where the search box and submit buttons are that’s where they will stay.

    The trouble with fashions (fads) is that they change all to soon. Once everyone has pastel green it will be the new grey. Once colours become mere decoration they lose all value for conveying context.

    Enhance the functionality to the point where it’s useful and I’ll buy into it like a shot.

    M

  17. I’m not trying to sell you anything, M. If you think UI design is unproductive non-work disconnected to functionality, then don’t do it. The result would not be too good with that attitude anyway.

    Best wishes Harald

  18. Jon –

    After +20 years of marriage You should (try to) learn Your brother-in-law to (based on Harald metaphor)

    – First buy the curtains he really likes, bring them home and set them up then
    – when his wife comes home and *before* she start to –– just say ‘Sorry dear!” ;)

    In general I believe that the UI is the most important aspect of any solution. The UI is what the clients see and therefore pay for. It’s also important to recognise and follow what should be considered as ‘standards and best practices’no matter what our own preferences are.

    All in all, it does not mean that we have a freedom to play around like Picasso or Van Gogh ;)

    Kind regards,
    Dennis

  19. “I’m not trying to sell you anything, M. If you think UI design is unproductive non-work disconnected to functionality, then don’t do it. The result would not be too good with that attitude anyway.”

    That’s a bit of a non-sequiteur.

    There’s a huge jump from me saying that using the “latest” colour schemes for the sake of it is a bit of a waste of effort to you suggesting that I might think “UI design is unproductive non-work”.

    UI design – in the sense of a logical, or maybe just familar, arrangement of form elements – is very much real work linked to productivity. But when someone sizes 3 text boxes the same size “because it makes the form look neater” when one needs to receive a single word entry and another a long paragraph is definitely not.

    Perhaps I’d suggest that people should stick to grey until such time as they have ALL the purely functional elements of the UserForm nailed (Buttons doing what they are supposed to, logical flow top left to bottom right, etc etc.

    Mind you, new colour schemes, UI layouts and button designs are a great way of giving the illusion of progress without actually changing very much under the hood.

    M


Posting code? Use <pre> tags for VBA and <code> tags for inline.

Leave a Reply

Your email address will not be published.