Quince / Home

Web Application Form Design "Input elements should be organized in logical groups so that your brain can process the form layout in chunks of related fields." –HTML: the Definitive Guide Quite rare is the Web application that doesn’t make extensive use of forms for data input and configuration. But not all Web applications use forms consistently.

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. 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?”

40 Helpful Resources On User Interface Design Patterns - Smashing Magazine 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.

The Messy Art Of UX Sketching - Smashing UX Design Advertisement I hear a lot of people talking about the importance of sketching when designing or problem-solving, yet it seems that very few people actually sketch. As a UX professional, I sketch every day. 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? 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. Guidelines, Tools and Resources For Web Wireframing Today “Web” is very different from what it was few years ago. It is better, but far more challenging – you can no longer ignore things like usability, information architecture and design. That’s why wireframing has received so much attention lately. Wireframing allows you to visually illustrate layout of fundamental elements in the user interface. It also acts as a way to communicate with clients and other stakeholders (content creators, designers, developers, etc). Furthermore, wireframing enables you to consider changes, user paths, and new requirements.

Displaying Icons with Fonts and Data- Attributes Traditionally, bitmap formats such as PNG have been the standard way of delivering iconography on websites. They’re quick and easy, and it also ensures they’re as pixel crisp as possible. Bitmaps have two drawbacks, however: multiple HTTP requests, affecting the page’s loading performance; and a lack of scalability, noticeable when the page is zoomed or viewed on a screen with a high pixel density, such as the iPhone 4 and 4S. The requests problem is normally solved by using CSS sprites, combining the icon set into one (physically) large image file and showing the relevant portion via background-position. While this works well, it can get a bit fiddly to specify all the positions. In particular, scalability is still an issue.

43 Essential Controls for Web Applications Designing a web application? 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.