This article contains any pattern libraries I have come across. The list is frequently updated.
I´ll start with introducing patterns for those who aren´t familiar with their purpose. If you already know what patterns are, scroll down to the big patterns libraries.
What are patterns?
Repository of conventions.
Collections of common UI elements, or a grouping thereof.
With discussion on why/when to use and visual examples.
Why use patterns?
The tricky thing about (interaction) design is that the answer is often ‘it depends’, as there is generally no reapplicable solution to a specific problem; the answer depends on the larger context, the flow of pages, the other elements in display, or the broader user experience.
Patterns try to get rid of this trickyness. In a way, they are ridding of interaction designers 😉 At times patterns are so abstractly defined (in text), so generic. The bottom line is, study and understand patterns, don’t just copy them.
Start here: design pattern search engines
Rollyo.com http://www.uxforthemasses.com/design-patterns-search/ TIP++
See also Visual Fox (?) (A-B test result search) in other post
@Google images search e.g. “account overview” ui OR design OR UX OR usability OR “interaction design” OR “information architecture” OR wireframe
@Google images search with competitors e.g.”my products” OR “My services” account detail [Verizon OR “AT&T” OR Foxcom OR comcast
@Pinterest: http://pinterest.com/search/boards/?q=dashboard%20web%20OR%20ui%20OR%20UX%20OR%20patterns (can help you think out-of-the-box)
@ UI design: Dribble / BeHance / https://sketchrepo.com/?s=sign+up
@ Google Custom Search GCS (see links below)
(in approximate order of popularity and personal preference;
tags desired: find related / see also patterns, e.g. alternatives to tabs)
http://patterntap.com/patterntap + (many more mobile/tablet) (Now Zurb)
http://patternry.com/patterns/ + (also build your own custom library)
http://uipatterns.io/ + (curated, mobile, interactive
http://uigarage.net/ web & mobile screenshots, some flows
http://www.useronboard.com/ (onboarding = turning potential customers into paid sign-up OR acquisition OR guiding new users / tutorials – more see InnovatingUX.ppt)
https://www.reallygoodux.io/ + onboarding , features, tooltips, screenshots
http://nicelydone.club/most-popular-products-patterns-categories/#lists WATCH (on-boarding, inspiration by site type)
http://quince.infragistics.com – shut-down (also private secure custom library; extensive use-when explanations)
build.me SAP (Splash) B2B and B2E (enterprise)
https://www.awwwards.com/websites/?award=sites_of_the_day&categories=responsive-design TIP Visual, tags, categories, technologies More reward sites @ other post
Futuristic interfaces https://www.noteloop.com/kit/fui/ and Pinterest on multitouch or NUI’s
http://uyi.io/ animations, gestures
http://www.webdesignpractices.com (2002, with page positioning usage data%)
http://ui-cloud.com/categories/ — (more for UI designers, not UX/interaction designers; some technology CSS/HTML5 snippets. Bit outdated. Some Sketch UI kits via source links)
Yahoo! patterns (down but to be replaced by other site soon)
http://discover.usabilla.com/ (Dutch startup?, TIP with bookmarklet to create your own pattern library from any webpage’s element)
http://developer.nokia.com/community/wiki/Category:Mobile_Design_Patterns (mobile design patterns)
http://www.designmeltdown.com/ – monster is paid. (some graphical, style/trends of 2010, ..)
http://www.smileycat.com/design_elements/ + (gallery of screenshots incl. mega dropdown menu’s, video players, mini shopping carts)
http://box.mepholio.com/ – mainly graphical, some patterns (404, calendars, pagination, …) –
http://bashooka.com/category/inspiration/ Dashboards +
Forms @ http://www.flickr.com/photos/squaredeye/sets/72157594526698707/
Sign-up Form conventions @ http://www.smashingmagazine.com/2008/07/04/web-form-design-patterns-sign-up-forms/
Dashboards, usage, graphs/charts, pie diagrams, monitor @ http://www.dashboardinsight.com/dashboards/gallery/gallery-article.aspx + Quince +
Data visualisations, charts @ http://sxywu.com/
Dashboard, user profile, my account @ http://patterntap.com/?terms=&sort_by=created&type=21718&style=28&platform=All + http://designingsocialinterfaces.com/patterns/Profile
Dashboards @ https://www.ibm.com/design/language/inspiration
http://www.jankoatwarpspeed.com/post/2010/02/26/table-ui-patterns.aspx – Tables
http://osdpl.fluidproject.org/ (open-source design pattern library)
http://dribbble.com/tags/ux (general inspiration – work of other designers with the tag “ux”) + (also try Behanced?)
http://patterns.endeca.com/content/library/en/home/patterns.html TIP – Faceted Nav, etc. Well structured with ´solution elements´
Inspiration pattern libraries
http://littlebigdetails.com/ + (micro-interactions, mini delights and interaction details) by Floris Dekker (Etsy)
http://www.crayon.co/ + (curated marketing designs ideas/screenshots on page-level: homepage)
hoverstat.es [hover alts @ http://www.creativebloq.com/design/hover-dead-long-live-hover-4132957
More @ http://freebie.supply/design-code/ (scroll down)
http://themeforest.net/search?category=ecommerce&site=themeforest.net&suggest=true&term=responsive (search for responsive, then select a Business category)
http://onepagelove.com/ – one page responsive (with tags)
See more above
uimovement.com – animated
More – Pattern link directories
Smashing Magazine interface patterns resources 2009 😦
http://www.sansfrancis.co/ #inspiration = pattern libs (added 2018)
How to select & use patterns – https://www.uxpin.com/studio/blog/use-right-ui-design-patterns/
Templates are kind of like patterns, but for whole pages and predesigned. Lots of inspiration for generic standard solution.
Top best website designs
There are ample blogs and sites dedicated to collecting, what is to their professional opinion, the most beautiful designs. Emphasis on graphical design or minimalism.
See other post
Books with patterns
Design of sites by …
Forms that work