All posts about
Visual design

White space isn’t just a UX fad

White space, silence and other ‘moments-in-between’.

“All good visual artists understand the importance of negative space, the empty area that draws attention to, and accentuates, the actual subject. Negative space (the artistic equivalent of a designer’s white space) is like the supporting cast whose duty is to make the star of the show stand out more by not standing out so much themselves.”

Jerry Cao, Kamil Zieba, and Matt Ellis ~ AIGA

On meta-design and algorithmic design systems

Abstraction, the next compentency for visual designers after empathy.

“This post is about something I see as a continuing trend in the design world: the rise of the meta-designer and algorithmic design systems.”

Rune Skjoldborg Madsen a.k.a. @runemadsen ~ RuneMadsen

How important is art direction to the success of a website?

Part of what’s called production values in cinematography.

“Today I want to offer more thoughts about art direction. Despite its benefits, is art direction something we need to do for the sites we create? How important is it to the success of the site? I want to address both questions today. I’m not sure I have great answers or even any answers, but I want to share some thoughts to help both of us answer the questions for ourselves.”

(Steven Bradley a.k.a. @vangogh ~ Vanseo Design)

People don’t read, they scan

Scanning also involves reading, but at a general level. Unless, the texts are relevant, interesting or remarkable.

“The emergence of highly content-based websites now means one thing: how to fit the content within a very well-functioned website while not sacrificing the aesthetics? In addition to that, the development of web nowadays mean viewers will be able to view these content across multiple sizes of screens. Such are the challenges of designing in these interesting times.”

(Zana Fauzi and Dahlia Ahad ~ Stampede)

Meta-design: The intersection of art, design, and computation

The only thing that is missing is connectivity as a unique trait of digital.

“In a traditional design practice, the designer works directly on a design product. Be it a logo, website, or a set of posters, the designer is the instrument to produce the final artifact. A meta-designer works to distill this instrumentation into a design system, often written in software, that can create the final artifact. Instead of drawing it manually, the designer programs the system to draw it. These systems can then be used within different contexts to generate a range of design products without much effort.”

(Rune Madsen a.k.a. @runemadsen ~ O’Reilly Radar)

Icon classification: Resemblance, reference, and arbitrary icons

It’s all about understanding by design.

“The tighter the mapping between icons and the thing they represent, the easier they are to understand, but standardization can also make an icon easy.”

(Jakob Nielsen a.k.a. @NNgroup)

Creating style guides

Documenting design decisions is a honorable piece of work.

“(…) a style guide is a living document of code, which details all the various elements and coded modules of your site or application. Beyond its use in consolidating the front-end code, it also documents the visual language, such as header styles and color palettes, used to create the site. This way, it’s a one-stop place for the entire team—from product owners and producers to designers and developers—to reference when discussing site changes and iterations. Several companies have even put their guides online; Starbucks is the most well known of the bunch, but others exist.”

(Susan Robertson a.k.a. @susanjrobertson ~ A List Apart)

The woman behind Apple’s first icons

Honoring our historical roots is what makes us more mature as a relevant domain in world history. Even though is still three decades old, sort of.

“Thirty years ago, as tech titans battled for real estate in the personal computer market, an inconspicuous young artist gave the Macintosh a smile. Susan Kare was the type of kid who always loved art. As a child, she lost herself in drawings, paintings, and crafts; as a young woman, she dove into art history and had grandeur dreams of being a world-renowned fine artist.”

(Zachary Crockett a.k.a. @zzcrockett ~ Priceonomics)

Content-out layout

Old typographical systems get a second life.

“Grids serve well to divide up a predefined canvas and guide how content fits onto a page, but when designing for the web’s fluid nature, we need something more… well, responsive. Enter ratios, which architects, sculptors, and book designers have all used in their work to help set the tone for their compositions, and to scale their material from sketch to final build. We can apply a similar process on the web by focusing on the tone and shape of our content first, then working outward to design fluid, ratio-based grid systems that invite harmony between content, layout, and screen.”

(Nathan Ford ~ A List Apart)

The Dribbblisation of design

How the logical, mental and virtual structures come together in an app.

“A product architecture is not an information architecture. It is not a set of pages that link to one another, or something that shows modals and describes what buttons do. A prototype will always serve this purpose better. It is a level deeper than that. It is the structure. The building blocks. It shows the objects in the system, and the relationships between them.”

(Paul Adams a.k.a. @Padday ~ Inside Intercom)

The tricky science of color perception

Color is still not well understood in digital design.

“Color is infinitely shifty. It’s unstable in the presence of nearby colors. It’s vulnerable to tricks of the light. It acts like it’s moving when it’s not. It can act like it’s there when it’s not. Put another way, color is subject to a thousand kinds of distortion as it travels from an object, through light, through your eye to your (acculturated) brain. Yet the tricky, interwined science and art of color perception still goes under-appreciated.”

(Jude Stewart a.k.a. @joodstew ~ Design Observer)

Great design always means great style

Style is no easy concept.

“Many people confuse style with fashion, with the surface features of an object. No, good style runs deep. I work in interaction and product design, and the designers I work with think hard about what lies beneath the skin; about the way a product or service interacts with those who engage it; about the value, functions and utility of the design. We go deeply into the essence of the product. This sense of style is one of the fundamentals of great design.”

(Donald A. Norman ~ Misc Magazine)

Designing the perfect hyperlink: It’s not as simple as you think

On one thing we all agree, Jakob Nielsen made the hyperlink blue.

“Hyperlinks are the glue that holds the Web together. Without links, the Web would be a very different place, that’s if it would exist at all.”

(John MacPherson a.k.a. @johneemac ~ Six Revisions)

Color and user experience

Great how resolution can drive design decisions.

“Proper use of color can enhance the user experience of any design as color affects humans psychologically, physiologically, and emotionally. (…) Remember that user experience is overarchingly affective. Both objective and subjective evidence supports the concept that color affects humans psychologically, physiologically, and emotionally. Importantly, these effects come wrapped in cultural contexts. This means that the reactions that color evokes in us can change depending on the culture or cultures in which we were raised, currently reside, or are currently acting as a user. Selecting and using color with thought, purpose, and care can enhance the user experience. We would love to hear your experiences with color use and choice in your designs. Please write your comments below. Until next time, please enjoy the experience.”

(Ashley Karr ~ SIGCHI Interactions)

Designing for the reading experience

But the thing is not to fall into the screen is paper parallel.

“With the rise of Web fonts as well as affordable hosted Web font services and ready-made kits, typography is reclaiming its title as design queen, ruler of all graphic and Web design.”

(Marko Dugonjić a.k.a. @markodugonjic ~ Smashing Magazine)

Reusable divisions of space: Grids and modular design

If it has structure, it can be modular.

“Grids follow the same principle of modularity we’ve been considering the last few weeks. In some ways that seems obvious given the terminology modular grids. In other ways though it isn’t quite as obvious that they’re the same thing. However, when you think about how grids divide space and make it easier for us to make layout decisions, I think the modularity of grids falls right in line with the reusable modularity of components and design patterns. They separate concerns, by dividing the space into modular units. The characteristics of these modular units are reusable and through reuse help us more efficiently place information. Finally, the structure of these units in the grid leads to greater consistency in how content is organized.”

(Steven Bradley a.k.a. @vangogh ~ VanSeoDesign)

Information Surfacing: Communicating through Design

Manipulate user engagement? Direct user behavior would be better.

“Information surfacing is to interaction designers what information hierarchy is to graphic designers. (…) Conceptual models are nothing new, but often become unintentionally obfuscated during the design processes. The design team, often dazed and confused, struggles to figure out why the product is now cluttered and unintuitive. A design thinking method I call ‘information surfacing’ helps to remedy this problem. Information surfacing involves the prioritization of UI elements with an intent to manipulate user engagement.”

(Ernest Volnyansky a.k.a. @ernestvo ~ UX Booth)