All posts about
Visual design

Web 2.0 How-To Design Style Guide

“In this tutorial, I describe various common graphic design elements in modern web (“2.0″) design style. I then attempt to explain why they work (i.e. why they have become common), as well as how, when and where you might use each element in your designs. It follows on from my Current Style article, and analyses in greater depth the design features of the current Web 2.0 design style.” (Web Design From Scratch)

How Do Users Really Feel About Your Design?

“In this column, I’ll introduce you to a promising method that just might solve this problem. While this method has not yet been subjected to rigorous peer review or experimental testing, it offers an intriguing solution and is endlessly fascinating to me. And it just might prove to be the kind of powerful technique we’ve been looking for to illuminate users’ emotional reactions to our designs.” (Paul J. ShermanUXmatters)

Using research to end visual design debates

“Have you ever presented visual design choices to a product team only to have the proceedings disintegrate into an argument about the color orange? Visual designer Nick Myers shows how conducting user research with an eye towards visual design can get your audience to objectively evaluate your decisions and keep their subjective opinions out of the discussion.” (Nick Myers – Cooper Journal of Design)

Refining Data Tables

“Many articles have been written on what is probably the single most ubiquitous interface element within Web applications today: the form. Forms justifiably get a lot of attention because their design is critical to successfully gathering input from users. Registration forms are the gatekeepers to community membership. Checkout forms are how eCommerce vendors close deals. But what goes in must eventually come out, and the information users provide to Web applications often makes its way back to users in the form of tabular data” (Luke WroblewskiUXmatters)

Where Visual Design Meets Usability: An Interview with Luke Wroblewski (Part II)

“Visual designers with experience in or an understanding of business, engineering, usability, or information architecture can better account for those considerations within a product design. This point is especially important when you consider the visual design of a product is the voice of the interaction design, information architecture, and the business.” (Joshua Porter – User Interface Engineering)

Developing the Invisible

“During my years as an interface designer, I’ve worked with lots of different development teams. From big companies to small startups, the interactions between me—the product designer—and developers have been pretty consistent. We work through what interactions and features are possible given our timeframe and resources. We discuss edge cases and clarify how specific interactions should work. We debate product strategy, information architecture, target audience, front-end technologies, and more. We also frequently encounter the same issue: the need to consider what’s not there.” (Luke WroblewskiUXmatters)

Color Theory for Digital Displays: A Quick Reference

Part I and II – “Computer monitors display information using the RGB (Red-Green-Blue) color model. An RGB monitor synthesizes colors additively by selectively illuminating each of its pixel’s red, green, and blue phosphor dots at varying levels of intensity. The light from a pixel’s three phosphor dots blends together to synthesize a single color. In additive color synthesis, all hues of the visible spectrum of light are mixtures of various proportions of one, two, or three of the primary colors of light: red, green, and blue. (…) Our perception of hues, values, and chroma levels depends upon their interaction with adjacent hues, values, and chromas, which can result in color-contrast, value-contrast, and chroma-contrast effects, respectively.” (Pabini Gabriel-PetitUXmatters)

The Effects of Contrast and Density on Visual Web Search

“This study evaluated the effects of white space on visual search time. Participants were required to search for a target word on a web page with different levels of white space, measured by level of text density. Screens were formatted with one of four types of graphical manipulation, including: no graphics, contrast, borders and contrast with borders under two levels of overall density and three levels of local density. Results show that search times were longer with increased overall density but significant differences were not found between levels of local density. Only the use of contrast was found to be significant, resulting in an increase in search time.” (Software Usability Research Lab Usability News 6.2)

Reading Online Text: A Comparison of Four White Space Layouts

“In this study, reading performance with four white space layouts was compared. Margins surrounding the text and leading (space between lines) were manipulated to generate the four white space conditions. Results show that the use of margins affected both reading speed and comprehension in that participants read the Margin text slower, but comprehended more than the No Margin text. Participants were also generally more satisfied with the text with margins. Leading was not shown to impact reading performance but did influence overall user preference.” (Software Usability Research Lab Usability News 6.2)

Universal Principals of Design

“(…) a must read book by all kind of designers. The principles of design provided in this book are extremely valuable. This is by far one of the best design books I have ever read. It is organized, well written, concise and a great resource for design references. Not only the book explains each principle carefully, it also provides real world example to help readers visually understand the principle presented.” (VisualGUI.com)