background preloader

Design Pattern Library

Design Pattern Library
Related:  UX/UI repository(design patterns and templates)

UI Design Pattern Library Patterns in Interaction Design D-Lists - Web & Graphic Design Inspiration Interaction Design Pattern Library - Welie.com Suggest a pattern Have you seen new examples of patterns out there that have not been described on this site? Send me a link to an example and I'll add it to my to-do list. Suggest a pattern Latest comments Form (Lucas Gwadana) Sometimes the ERROR handling is not explicit enough because when a user makes an... Map Navigator (Marcus) For print pages etc static maps are still relevant. Accordion (dellmre) Ajax accordion samples with source code Autocomplete (Zorg) I believe the name of this pattern to be misleading. Slideshow (Joshua) Slideshows on Homepages can be very beneficial.

Main Page - Social Patterns Patternry | User Interface Design Patterns for Ideas and Inspiration SEO Tools for Google, MSN and Yahoo! - XML Sitemaps Generator XML Sitemap Validator A tool which will validate your xml sitemap and optionally ping Google to inform them of their location. Our xml sitemap validator will inform you straight away if there are any problems with your sitemaps allowing you to make changes prior to submitting it to Google. You can also optionally ping Search Engines with the whereabouts of your sitemap. Supported search engines are: GoogleBingYahooAsk.com Please note that we would recommend you inform Google of your sitemaps via the Google Webmaster Tools. Click here to validate xml sitemap Search Engine Bot Simulator Search Engine robot is a software application that is designed to visit websites to index their content. Check how your webpage looks for search engine bot HTTP Headers Viewer HTTP Header is a part of response sent by your server with a requested page. Check HTTP headers for any specific URL Competitor Analysis Find out how well your website performs comparing to your competitors. Keyword Density Calculator SEO Tools

UI Pattern Ideas: List with Functions Last week I asked people to participate in a group design project on a specific design pattern: a list with functions. The premise was: The design pattern we are going to tackle is a list with functions. Think of a list of five names. The primary function of this list is to click the names. The response was amazing. Not every single submitted idea is shown below. Hover Functionality I quoted a Zeldman tweet in the opening article that said that functionality that only reveals itself on hover fails. Example by Sean. Example by cancel bubble. Example by kil. Edit Mode I'm thinking having a toggle for turning the list into "Edit Mode" is the most successful base for this design pattern. Example by Jay Salvat. Kirk Strobeck created a PDF describing an interface which is essentially a list with three different modes. Mass Edit Mode Mass Edit Mode differs from Edit Mode in that when the Edit Mode is enabled, all list items immediately become editable. Drag Functionality Example by Bart. Other

amazon Guide to Website Navigation Design Patterns In web design, there are certain common design patterns that are used for interaction. Site navigation has a wide variety of common and familiar design patterns that can be used as a foundation for building effective information architecture for a website. This guide covers popular site navigation design patterns. For each site navigation design pattern, we will discuss its common characteristics, its drawbacks, and when best to use it. Top Horizontal Bar Navigation Top horizontal bar navigation is one of the two most popular kinds of site navigation menu design patterns out there. The top horizontal bar navigation design pattern is sometimes paired with drop-down menus whereby hovering on a navigation item reveals second-level child navigation items. Common Characteristics of Top Horizontal Bar Navigation Navigation items are text links, button-shaped, or tabbed-shapedHorizontal navigation is often placed directly adjacent to the site’s logoIt is often located above the fold Tabs Navigation

Related:  UXDesign PatternsUI Patterns LibrarysUXarticlesWeb Devmarketingreadingspatternvarious stuff 4UI PatternspatternsmodeleMonday WorkshopsDesign Pattern ResourcesyahooUX