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.
Get Wireframing: The All-In-One Guide Wireframing is a great tool to incorporate into your projects as it allows for rapid prototyping and helps to pinpoint any potential problems. I personally find it invaluable on projects to have a visual representation of content, hierarchy and layout. Overall it’s an excellent step to incorporate into your project before the design process begins for both you and your clients. I am continually intrigued about how other firms and individuals incorporate the wireframing stage into their process. I know i’m not the only one, so this list aims to group together some of the best techniques, tools and resources to help you create effective wireframes. Techniques Building a Wireframe in Illustrator – From AiBurn – a step by step tutorial. Tools Omnigraffle – Create diagrams, process charts, quick page layouts and website mockups Visio – Visualize, explore, and communicate complex information. Wireframe Examples Wireframing Articles of Interest Paper Prototyping Useful Wireframing Resources
Reader - Eirik shared items for Web Developers - Développeurs Facebook All Docs Web SDKs Docs/Web SDKs/JavaScript SDK/ On This Page Facebook SDK for JavaScript A rich set of client-side functionality for adding Social Plugins, Facebook Login and Graph API calls. Guides Frameworks Termination of SHA-1 Support UI Design Patterns and Library Builder 30 concepts-clés de l'utilisabilité Dans un article intitulé "30 Usability Issues To Be Aware Of", Smashing Magazine recense 30 concepts et définitions que toute personne s'intéressant à l'ergonomie et à l'utilisabilité devrait connaître. Ce billet en est une adaptation en français : Le principe des 7±2 éléments Le cerveau humain étant limité dans sa capacité à traiter l'information, celui-ci aborde la complexité en traitant l'information par blocs. La règle des 2 secondes En vertu de ce principe, un utilisateur ne devrait pas avoir à attendre plus de 2 secondes certaines réponses du système, comme le passage d'une application à une autre, ou le lancement d'un programme. La règle des 3 clics Selon cette régle, les utilisateurs tendent à abandonner un site lorsqu'ils ne sont pas capables d'accéder à l'information ou au service en l'espace de 3 clics. Le chiffre de 3 clics n'est cependant pas critique : le plus important est que l'utilisateur sache où il en est, et qu'il n'ait pas l'impression de perdre le contrôle.
The Logos of Web 2.0 The Logos of Web 2.0 There is no official standard for what makes something “Web 2.0”, but there certainly are a few tell-tale signs. These new sites usually feature modern web technologies like Ajax and often have something to do with building online communities. But even more characteristic among these brands is their appearance. You can see some of these striking commonalities in Ludwig Gatzke’s compilation of nearly 400 Web 2.0 logos. The Softies A clear trend in new identities is the use of soft, rounded sans serifs dominated by VAG Rounded (AKA Rundschrift), but also including Helvetica Rounded, Arial Rounded, Bryant, and FF Cocon. Oct. 2008 Update — New and underused fonts in this category: Foco, Tondo, FF Netto, Estilo Text, and FF Unit Rounded. The Futurists Some sites are reflecting the technological breakthroughs of Web 2.0 with a look that says “tomorrow’s techno”. The Classics Oct. 2008 Update — Using uncommon alternatives to classic typefaces can ensure a logo is unique.
Real-Time Analytics For Social Plugins Over the past year, social plugins have become an important and growing source of traffic for millions of websites. Today we're releasing a new version of Insights for Websites to give you better analytics on how people interact with your content and to help you optimize your website in real-time. Like button analytics For the first time, you can now access real-time analytics to optimize Like buttons across both your site and on Facebook. We use anonymized data to show you the number of times people saw Like buttons, clicked Like buttons, saw Like stories on Facebook, and clicked Like stories to visit your website. You can use this real-time data to test the impact of button placement on Like Button CTR or identify the Open Graph image that generates the highest Like Story CTR. Comments box analytics Last week we launched an updated Comments Box that improves the quality of conversations and drives traffic to the websites that use it.
The Disciplines of User Experience UPDATE: I updated this diagram in 2009 for the second edition of Designing for Interaction that addresses some of the shortcomings I note below. The diagram now looks like this (click for larger image): Like almost nothing I’ve done, a model that I put in my first book Designing for Interaction showing the overlapping disciplines of user experience/experience design has been referenced repeatedly in various places. The problem is I was never very happy with the diagram. For one thing, it’s missing architecture in there, which is becoming increasing important. So I redrew it: Click for a larger image or download the pdf. It’s still not perfect: it’s missing Sound Design and Ergonomics/Human Factors, and the way the circles had to overlap downplays Visual Design. This diagram also begs the question: what is user experience design by itself, those areas that aren’t filled up with other bubbles?
What Bruce Sterling Actually Said About Web 2.0 at Webstock 09 | *By the garbled reportage, I’d be guessing some of those kiwis were having trouble with my accent. Here are the verbatim remarks. Bruce Sterling, Wellington, Feb 2009 So, thanks for having me cross half the planet to be here. So, just before I left Italy, I was reading an art book. Walter Pater was a critic and an artist of Art Nouveau. I know that sounds ironic or even sarcastic, but it isn’t. So Walter Pater was a critic, like me, so of course he’s complaining. And that’s your problem, too, here in New Zealand. And that’s absolutely the way of the world… nothing any critic can do about it. Creative people don’t want to “do it right.” I want you to know that I respect Web 2.0. It also had things in it that pretended to be ideas, but were not ideas at all: they were attitudes. It’s Web 1.0 that is dead. Web 2.0 is Wikipedia, while web 1.0 is Britannica Online. Web 2.0 is FlickR, while web 1.0 is Ofoto. Web 2.0 is search engines and Web 1.0 is portals. Web 2.0 theory is a web.