2

In communication with colleagues and clients, which authority (website, book, …) should one refer to for canonical names of GUI design patterns (for web pages, mobile apps, desktop applications etc.)?

The first Google result currently is UI-patterns.com, but that one doesn’t seem very exhaustive or kept up-to-date. There’s also the Yahoo library and I’m aware of influential books like the ones by Jenifer Tidwell and some others. Books, however, have the disadvantage over websites that not everyone has access to them (especially clients).

I think any answers to this question should be made into a community wiki entry for the [design-patterns] tag.

Improve this question

3 Answers 3

Reset to default
6
+100

This Might Not Exist

It may be the case that there isn't a canonical-enough reference to satisfy your particular needs. You'll likely end up with a list resources, each of which is strong in certain aspects, and weak in others. e.g. Microsoft's patterns are up-to-date and expansive, but are the delivered in the context of proprietary software. ui-patterns.com is more open, but less expansive and up-to-date (though I'm not sure how much I agree with you on this) Another problem you face is that new and emerging patterns often haven't acquired a name that's even generally agreed upon, let alone canonical.

Pick and Stick, Stay Consistent

The general advice that emerges from questions like this on ux.stackexchange is to pick those resources that most closely meet your requirements and declare those your own canonical references. Internally at least, it's more important that you remain consistent in your reference to a pattern, than that you're all using the absolute, universal, and "correct" name for it.

Do It Yourself

This might mean creating your own reference that fills in the gaps between the external sources you choose. You could even use ui-patterns.com to do this. The platform already exists. You could contribute to the the public library and increase its relevance and freshness, and at the same time create your own collection of patterns in an organized and open manner.

Improve this answer
4
  • 1
    I’ll reward you the bounty just because of the DIY suggestion, but I’m still hesitating to make it or @Esin’s (who provided links to actual pattern libraries) an accepted answer.
    – Crissov
    Nov 17, 2014 at 23:21
  • 1
    Nice one, thanks! I did think about listing some resources, but decided against it as that generally gets frowned upon here. I also thought about suggesting that if you decided to go alone and create the one resource to rule them all, give me a shout. I've refreshed my account on uipatterns since thinking about this, and would be keen to contribute to a similar resource if I felt it was going help.
    – dennislees
    Nov 17, 2014 at 23:28
  • 1
    Also: if you're going the DIY route, I just found patternry.com Looks pretty cool.
    – dennislees
    Nov 18, 2014 at 3:29
  • @Crissov Thought you might be interested in this. Just saw a post on my Facebook wall from ui-patterns.com - They've just relaunched the site with a new look and feel, an a thorough reorganization of the content.
    – dennislees
    Nov 27, 2014 at 0:18
2

I thought this was a pretty good list. I liked how they gave multiple names when appropriate. http://designingwebinterfaces.com/essential_controls

Improve this answer
2

I don't know if there is a web resource that actually classifies GUI design patterns. We always refer them with the company they are developed in.

You can use this site to see many of them at http://findguidelin.es/

Usability.gov's list http://www.usability.gov/how-to-and-tools/methods/user-interface-elements.html

  • Input Controls: checkboxes, radio buttons, dropdown lists, list boxes, buttons, toggles, text fields, date field
  • Navigational Components: breadcrumb, slider, search field, pagination, slider, tags, icons
  • Informational Components: tooltips, icons, progress bar, notifications, message boxes, modal windows
  • Containers: accordion

I also recently went through material design specs. That could be a good source http://www.google.com/design/spec/components/bottom-sheets.html

Improve this answer
2

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.