background preloader


Facebook Twitter

43 Essential Controls for Web Applications. Designing a web application?

43 Essential Controls for Web Applications

Familiarize yourself with Rich Internet Application technologies and the best UI controls for creating your application. Rich Internet Application technology has empowered us to create really amazing user experiences. The best RIAs on the web today rely on a discreet set of UI controls to provide a lively and timely experience. If you are moving from website design to web application design, the best information you can have at your disposal is an understanding of these essential controls. Most of these libraries, toolkits, and/or frameworks have an online gallery of controls (also called components, widgets, UI controls) you should explore. Many products are siloed by the RIA framework they are using, and designers create novel controls when the framework doesn’t have what they need.

BreakDOM - A remix of the classic Breakout game. So You Wanna Build a Library, Eh? The following article is an abridged version of Chapter 7 of Nathan Curtis’s 2009 book, Modular Web Design published by New Riders.

So You Wanna Build a Library, Eh?

The book’s first half addresses how to modularly break down your design, build it back up, and communicate in new and interesting ways. With those design techniques in hand, the book then drills into how to organize and build a library, teach it to others, and establish a process for maintaining it for an organization. Design patterns and modular components are effective techniques for designing and building long-lasting, consistent experiences.

You may reach the point where you ask yourself “Is it time to build a library for our team?” Many teams have realized incredible efficiencies, savings, and better design through design libraries and related standards. Therefore, precede any kind of library build out with a period of discernment. 1. What is your primary rationale for building a library? Portability: Designers come and go. 2. 3. 4. 5. 6. Home. Collection: Search Patterns. Patterns from IDEO. User Interface Design Pattern Library. UI Design Pattern Library. Design Patterns. 509 Bandwidth Limit Exceeded. Android Interaction Design Patterns. Main Page - Social Patterns.

Design Pattern Library. View the most recent patterns added to the library.

Design Pattern Library

Accordion There are too many items to fit into a limited space without overwhelming the user. Availability Provide a way for a user to display to other people (either the public, or their contacts, depending on the rules of the system) when they are available for contact and when not. Display Collection The user has created a collection and wants to display it to other people. Find with Tags A user wants to find objects associated with a specific concept or term. Left Navigation The user needs to locate content and features necessary to accomplish a task.

Progress Bar User needs to know at where they are in a multi-screen process (such as purchase or set-up). Tag an Object A user wants to attach their own keyword or set of keywords to an object for organization and later retrieval. Tag Cloud With sufficient tags in a system it becomes possible to present the most popular tags as a browsing aid. Top Navigation Updates User Card Your vs. What Makes Them Click » Blog Archive » 100 Things You Should Know About People: #49 — The Brain Looks For Simple Patterns - Applying Psychology to Understand How People Think, Work, and Relate. What do you see when you look at the x’s below?

What Makes Them Click » Blog Archive » 100 Things You Should Know About People: #49 — The Brain Looks For Simple Patterns - Applying Psychology to Understand How People Think, Work, and Relate

Xx xx xx xx Chances are you will say you see four sets of 2 x’s each. You won’t see them as 8 separate x’s. You interpret the white space, or lack of it, as a pattern. People are great at recognizing patterns – Recognizing patterns helps you make quick sense of all the sensory input that comes to you every second. Individual cells respond to certain shapes – In 1959, two researchers, Hubel and Wiesel showed that there are individual cells in the visual cortex of your brain that respond only to horizontal lines, other cells that respond only to vertical lines, other cells that respond to edges, and cells that respond only to certain angles.

You recognize objects by simple shapes – But research now points to the idea that we recognize certain basic shapes in what we are looking at, and we use these basic shapes, called geons, to recognize objects. Take-Aways: