Category: Design

This category features articles on general design principles, Web design, typography, user interface design and related topics. It also presents design showcases and practical pieces on the business side of design. Curated by Alma Hoffmann.

Popular tags in this category:

Web Design Typography Inspiration Downloads Freebies

Proximity in Design: Why I Can’t Use My Car’s A/C

I’m always fumbling with the A/C controls in my car. My daily commute is in hot, sunny Southern California, home of the courteous freeway driver. I can’t afford to take my eyes off the road for too long to find the control I’m looking for. Half of the time when I'm trying to adjust the temperature, I end up blowing my beard off because I’ve spun the wrong dial. If my wife’s in the car with me, I usually resort to asking her to do it for me.

My Car's A/C Controls

There’s a simple design principle that, had it been given greater attention, could have made this needlessly confusing interface much easier to use: proximity.

Read more...

Showcase of Creative Navigation Menus: Good and Bad Examples

Good navigation is the main cornerstone of an effective website. In practice, however, it's often a tough challenge to come up with a meaningful, unambiguous way to organize, arrange, and display content to users; and it's often not much easier to find a visually interesting solution either. The wide adaption of JavaScript libraries like jQuery is making it increasingly easy to add various kinds of sleek animations to navigation design.

Design Intellection

For instance, many recent promo websites are essentially single page websites with an array of animation effects used to make navigation a smoother and richer user experience. We need to be very careful and cautious when using these dynamic effects in our designs. A simple, calm navigation is usually much more user-friendly than an evolved, dynamic one. Users want to use the website, not be baffled by the weird and hardly usable navigation. But that's not to say that a creative navigation should be avoided at all costs.

Read more...

Make Your Content Make a Difference

Content, content, content. It’s an obvious part of any interactive experience. In fact, you’ve probably heard content is king, or queen, or some sort of royalty. Yet, content is elusive. Often, you don’t realize your content isn’t cutting it until it’s too late. Does any of this sound familiar? Delayer projects, broken designs, uneven voice or low-performing landing pages.

Screenshot

These problems and more are documented extensively, so I won’t dwell on them. What I will dwell on is the solution. But, first, let's discuss the false ones. Just because someone articulates a problem well does not mean someone knows the solution. That’s when we’re susceptible to a false solution. In my many years of experience, I’ve found these two fake solutions to be very common, very distracting — and very disappointing.

Read more...

Relationship Engineering: Designing Attraction

"Look at her: so beautiful, so friendly, so smart. And what a personality. She must be mine. Hooking up with her would make me the envy of all my friends. Sure, she's young and she's gorgeous. Besides, I can easily try something new if I get bored or something better comes along."

No, that’s not an excerpt from Lolita. As cruel and inappropriate as they might seem, these thoughts are fairly common in our society. In fact, in the past year, millions of people have entered into exactly that type of relationship. Don’t bother calling the Special Victims Unit; what we’re discussing here is not what you think it is. It’s the Apple iPad.

Read more...

Multivariate Testing 101: A Scientific Method Of Optimizing Design

In a previous article on Smashing Magazine, I described A/B testing and various resources related to it. I have also covered the basics of multivariate testing in the past, yet in this post I’ll go deeper in the technical details of multivariate testing which is similar to A/B testing but with crucial differences.

In a multivariate test, a Web page is treated as a combination of elements (including headlines, images, buttons and text) that affect the conversion rate. Essentially, you decompose a Web page into distinct units and create variations of those units. For example, if your page is composed of a headline, an image and accompanying text, then you would create variations for each of them. To illustrate the example, let’s assume you make the following variations.

Read more...

How to Choose a Typeface

Choosing a typeface can be tricky. The beauty and complexity of type, combined with an inexhaustible supply of options to evaluate, can make your head spin. But don't be baffled — and don't despair. While there are no easy-to-follow rules on how best to choose a typeface, there are many tried-and-true principles you can quickly learn and apply to make an appropriate typeface choice. If you work systematically through the options below, you'll have a winning typeface choice in no time. Let's get started.

Screenshot

The first thing you have to do in order to choose a typeface is form a strong impression in your mind about how you want your audience to react to the text. This is your goal, and it will guide the process. You might provide this impression, or it might be dictated to you by your client, or it may be determined by your audience.

Read more...

Dear Web Design Community, Where Have You Gone?

As Web craftsmen, we are living in exciting times today. The frenetic pace of evolution in our industry has created remarkable opportunities for our work. Our established set of design and coding practices is more comprehensive than it has ever been before. Our designs are becoming more usable, our code more scalable, our layouts more responsive. In fact, just by comparing our design processes to those from a decade ago, it's remarkable to observe how quickly we've developed and honed our craft over all these years.

HTML5 Boilerplate is a remarkable example of a cooperation of dozens of Web designers who share their thoughts to create something useful for all of us to use.

However, the maturity of our industry is far from being complete. While producing a myriad of technological advancements, we have outpaced other developments along the way. These developments aren't related to the lack of cross-browser standards support or technical downsides of the tools we are using. No, they have a different nature. They have emerged within our design community — a community which is now so fertile and diverse that it is becoming increasingly difficult to ensure its professional maturity.

Read more...

↑ Back to top