background preloader

10 UI Design Patterns You Should Be Paying Attention To - Smashing Magazine

10 UI Design Patterns You Should Be Paying Attention To - Smashing Magazine
Advertisement Design patterns were first described in the 1960s by Christopher Alexander, an architect who noticed that many things in our lives happen according to patterns. He adapted his observations to his work and published many findings on the topic. In short, design patterns are solutions to recurring problems. You may be interested in the following related posts: 1. To fully appreciate the problem of registration, we should consider an annoyance that has led to the opinion that sign-up forms must die6. When would you actually use lazy registration? When users are allowed to try out your website product or service before making a decision (which not every website permits, though).When it is important to familiarize users with your system before they sign up, which can be a crucial step in their process of deciding whether to register. 7 Amazon lets you browse and add products to your shopping cart before signing up. 8 Picnik is another good example of lazy registration. 2. 3. 4. 5. Related:  Resource

ComboFix | freeware Design Elements, Trends & Problems in Web Social Network Design: Examples and Best Practices | How-To | Sm Advertisement According to Nielsen Online, social networks and blogs are now the 4th most popular kinds of online activities. 67% of the world online population are now visiting them and the time they’re spending on them is growing by three times the overall growth rate of the internet. Social networks are now visited more often than personal email is read. Some social networks have grown to such enormous proportions that they rival entire countries in terms of population—if Facebook, for example, was a country, it would be the fifth-most-populated in the world (right between Indonesia and Brazil). There’s a lot of variety out there in the realm of social network design. Some sites keep a very professional approach (like LinkedIn1) while others have a more organic, free-form look (like MySpace2). Also consider our previous articles: 1. Engagement is crucial for the success of any website. What’s It For? Give Visitors Something To Do Promote Interesting Content From Friends 2. 3. 4. 5. 6. 7.

The Daily vs. Flipboard: One of These is The Future of Newspapers... Last week Rupert Murdoch's iPad-only newspaper The Daily was launched. The Daily is a newspaper app available to U.S. users on the iPad for 99c per week (the first 2 weeks are free; non-U.S. people can download it for trial via this method). The Daily has been touted as the "future of the newspaper" by News Corp. Audrey Watters wrote our initial review of The Daily and she was underwhelmed. In an informal breakfast news test, this morning I sat in bed with my coffee and peanut butter toast and browsed both The Daily and Flipboard. At first glance, The Daily has a few nice interactive touches - like 360° photos, a short 2-3 minute video review of the day's big news, and other multimedia features. Where The Daily mostly fails to deliver is with the content. Much of The Daily's content this morning was of little interest to me. The main issue on the content side is that there is no real choice of what content is served up. Let's take the arts example.

35 Excellent Wireframing Resources - Smashing Magazine Advertisement Wireframing is one of the most valuable parts of any web design project. It can save a designer tons of time by hashing out the details of a site’s architecture, functionality, and content prior to actually starting a visual design. But if done inefficiently, it can end up costing more time and can even create bigger headaches for both the client and the designer. Below are more than 35 resources for creating better wireframes, including tutorials on different methods and a variety of tools available. 1. Here are more than twenty wireframing articles, guides, and tutorials to help you improve your wireframing process. Wireframes Magazine This site offers tons of resources and articles about wireframing. Wire Frame Your Site A great introduction to the benefits of wireframing from Sitepoint. Ajax Wireframing Approaches A post in a series from Particletree about prototyping Ajax, this covers wireframing techniques. Framing the Problem An article about wireframing from ClickZ.

Introduction to Design Patterns Using PHP Introduction to Design Patterns Using PHP(Page 1 of 2 ) What are Design Patterns Design Patterns are simply defined solutions to common problems. What Design Patterns Are NOT A design pattern is NOT a template rather a proposed solution that is not implementation specific. Why Use Design Patterns Most PHP developers may first ask why use Design Patterns or why design in the first place. Yes this is probably true if you work alone on small projects. Maintenance Documentation Readability Easy when developing in large development teams Developing Code to be used by other then yourself With PHP becoming more and more mature, especially with PHP5 it is said it will be ready for the Enterprise world, see the following article If this indeed is true then object-oriented development and design pattern skills are a definite asset to your resume. Using Design Patterns with PHP Here is the UML diagram: What to Look Out For Learning Process

40+ Helpful Resources On User Interface Design Patterns | Develo Advertisement If there is a commonly reoccurring need for a particular solution, there is a great probability that someone has – by now – solved that need and has finished the legwork involved in researching and constructing something that resolves it. At the very least, you will find documentation on general solutions to related problems that will enable you to gain insight on best practices, effective techniques, and real-world examples on the thing you are creating. A design pattern refers to a reusable and applicable solution to general real-world problems. There are many ways to tackle a specific requirement – and as a designer – the most important thing you can do is selecting the option that best reflects the needs of your users. In this article, we share with you the best of the best, cream of the crop sites, galleries, online publications, and libraries devoted to sharing information and exploring concepts pertaining to User Interface design patterns. Yahoo!

Adaptive CSS-Layouts: New Era In Fluid Layouts? | CSS | Smashing Advertisement Fluid web designs have many benefits, but only if implemented correctly. With proper technique, a design can be seen correctly on large screens, small screens and even tiny PDA screens. With bad coding structure, however, a fluid layout can be disastrous. Because of this, we need to find ways to work around most, if not all, of the cons of fluid design. If you as a designer are going to go through all the extra work of creating a functional fluid layout, why not go a bit further and make it compatible with all resolutions, instead of just most? In this article, we’ll discuss effective techniques to create 100%-functional adaptive CSS-layouts, and provide details on other tutorials and practices. Also consider our previous articles: Fixed vs. 1. Most of us have heard of the 960 Grid System for designing fixed-width Web pages. What Is a Fluid Grid? A fluid grid can be created through a smart use of DIV layers, percentages and very simple math. The Benefits A Note About Margins 2.

6 Surprising Bad Practices That Hurt Dyslexic Users by anthony on 01/23/11 at 11:04 pm Web accessibility doesn’t only extend to color blind users, but dyslexic users too. Dyslexia is a learning disability that impairs a person’s fluency or accuracy in being able to read, write, and spell [10]. When dyslexic users read text, sometimes they can experience visual distortion effects [5]. River effect Dyslexic users may sometimes see the river effect in the text they’re reading [1]. 1. When you use justified text, you’re not only making text difficult to read for non-dyslexic users, but even more so for dyslexic users. 2. Most of us were taught to double space after periods at the end of a sentence. Blur effect Another kind of visual distortion effect that can occur among dyslexic users is the blur effect [1]. 3. There’s a reason the text you’re reading now is not pure black (#000000), and the background that it’s on is not pure white (#FFFFFF). 4. Washout effect Sometimes dyslexic users can experience the washout effect. 5. 6. [Sources

Related:  navigation