Find out how we can help you succeed in your business

Designing: Creating a perfect balance

May , 2008
18th

Designing the UI is fundamentally an exercise in compromise—not compromise between designers and other project stakeholders (usability should never be sacrificed as a result of office politics)—but compromise between the drawbacks and benefits of design decisions. Every UI decision, from a pixel’s precise placement to the entire site’s information architecture, should be made judiciously. Careful consideration of the benefits each design decision affords and costs its users is essential. It’s the sometimes-subtle expense that many people often overlook, and every UI decision does have expense. Educated compromise across all UI decisions is essential to creating the best interface possible, and is, ironically, required if you are to avoid designing a compromised interface.

You can’t have your cake and eat it too

In creating the UI, you must cope with two primary interrelated limitations: the finite amount of information that can be conveyed via a single screen, and the finite amount of information that a user can process at one time. Show too much information on a single screen and users have to wade through the ensuing clutter; show too little and users have to guess their way to their destinations. A good design uses the screen real estate effectively to leverage the user’s understanding to effectively communicate between application and user.

Your canvas, the monitor screen, is constrained—X pixels wide by Y pixels high. As such, it’s important to conserve resources; every pixel you use comes at a price. Keeping information density balanced is a challenge when you’re trying to create a UI that communicates efficiently. Every design decision has an expense because each additional piece of information on the screen increases the information density, competes for the user’s limited attention and cognitive processing, and makes recognition more difficult.

Take the good with the bad

Whenever cost accompanies benefit, compromise is required. Ideally, you can maximize the good and minimize the bad. The fundamental question is, does the benefit that the design affords outweigh the cost? Not only does it outweigh it, but also does it outweigh it by the highest margin in comparison to all alternative design solutions? Only if it does so should it be prescribed as the best design solution.

The cost/benefit compromise cuts across all levels of UI development, from navigation design to font size. The bigger the design decision, the larger the potential impact on the UI. Small design decisions may seem insignificant by themselves, but in aggregate they too can have a large impact on the UI. Whether big or small, each design decision should be made judiciously after evaluating usability and the net UI benefit.

Print Media: Magazine advertisements, Business cards, Logos

April , 2008
18th

Designing for print media versus designing for the web can be a completely different experience. To better understand these differences, the two can be compared in major topic areas: types of media, audience, layout, color, technology and careers. Remember we’re looking at the graphic design side of web design, not the technical side. For more about the programming end of web design visit the web design section of About.com.

Types of Media

Before looking at the actual differences in design, it is important to know what type of work you may find yourself doing in each field.

As a print designer, you may work on:

  • Magazine advertisements
  • Product design and packaging
  • Business cards
  • Logos

As a web designer, you may work on:

  • Standard HTML websites
  • Flash websites
  • Email newsletters
  • Banner advertising

Of course the list for can go on for both, but the basic difference is that when designing for print you will end up with a finished product that someone can hold in their hand, and when designing for the web you will generally work on an ever-evolving piece viewed on a computer display.

Audience

When beginning a project, it is important to think about the experience of your audience, which differs greatly between print and web design.

At the most basic level, the web is interactive and print pieces are usually not.In print, you are trying to get your audience to stay on a page long enough to get a marketing message across. You are often faced with a limited area in which to achieve this, such as a one-page magazine ad. In some cases, you are trying to catch their attention and have them dive deeper into your product, as with a book cover or the first page of a brochure. One of the benefits of print design is that you are dealing with a physical product, so physical properties such as texture and shape can help you achieve your design goals. As an example, paper companies will take out magazine ads printed on their own paper, allowing the audience to feel the weight and texture of their product.

On the web, you are generally trying to keep your audience on a specific website for as long as possible. The amount of pages to work with can be unlimited, so you ‘tease’ the audience with snippets of content to entice them into clicking further into your site. Clear navigation (buttons that users click to get to the sections of your site), animation, sound and interactivity all come into play.

Layout

Both print and web design require clear and effective layout. In both, the overall goal is the same…use elements of design (shapes, lines, colors, type, etc) to present content to your audience.

The differences start in the available space to create your design:

In print:

  • Your space is generally measured in inches.
  • You can be dealing with anything from a business card to a highway billboard.
  • You know the space allowed from the start and that your finished product will look the same to everyone who sees it.
  • You must have bleed and safety areas to guarantee print results (learn more about this in the “printing process” section of this site).

On the web:

  • You are measuring your space in pixels.
  • You are faced with a challenge…designing your sites to look the best on all size monitors and at all monitor resolutions.
  • A consistent design, with consistent navigation (always in the same place) is key to keeping people on your site.

Another major difference is how you actually achieve your layout. As a print designer, you know the final piece will be delivered as-is to the printer, though you must make the final print job appears as intended. As a web designer, you must keep in mind that you will deliver your design to a programmer (if not doing it yourself) who will prepare it for the web.

Color

Dealing with color can be very tricky in both print and web design. It is important to understand each of the color models and spaces, such as RGB, CMYK and HSV. Below are some of the choices, issues and concerns when dealing with color in print versus web design.

In Print Design:

  • Consider the difference between your colors on screen and on paper.
  • Again, a “proof” can help ensure you are getting the desired results.
  • You often choose “spot” or “process” colors for your printer to use. These are colors you choose from a palette and identify with a code that you provide to your printer.

In Web Design:

  • Consider the difference in colors from monitor to monitor.
  • How color will be affected by brightness and contrast changes.
  • Colors are represented by “hexadecimal values” (6 digit numbers). Again, this responsibility may fall on a programmer, but you may be providing these values to them.

Technology

Keeping up with the latest technology is necessary in both print and web design. For both, it is important to work in graphic programs such as Adobe Photoshop, Illustrator, and InDesign. For print designers, knowing the latest advances in the printing process will help you to achieve the best results in your work. For web designers, knowing what your programmer (if not yourself!) can and cannot do will help you to provide the most effective designs.

Careers

A career in graphic design can mean many things. Below are just a few examples of specific jobs in print and web design.

Print:

  • Art Director at a magazine
  • Ad designer at an ad firm
  • Package designer for a cosmetics company
  • Designer for a t-shirt company

Web:

  • Web designer for a social networking site
  • Flash designer for movie websites
  • Banner ad designer for a marketing firm

Which to Choose?

Ideally, deciding which type of design to pursue will be based on experience. Even if you create your own personal projects, try creating some print pieces (such as your own business card) and websites (create a mockup of your online portfolio). See what you enjoy, and learn more about it! Think about the differences in this article and what you’d like to focus on.

Learning both print and web design will make you even more marketable. In today’s job market, listings often ask for a focus on one, but knowledge of both. As a freelancer, being able to offer a client a full marketing package, with print materials and a website to match, will only help to grow a business and build an impressive portfolio.

Calendar
September 2008
M T W T F S S
« May    
1234567
891011121314
15161718192021
22232425262728
2930