blog

Take a look around, there are examples of good design all over. The icons on your computer screen, the street signs outside your window, the vitamin water on your desk, each are pulling for your attention so that you might notice them, interact with them, or even buy them. Have you ever really taken a step back, and thought about how the choices you make each and every day are influenced by design?

No matter the situation, the way something looks is the first thing that anyone has to form an opinion, liking or perception about. The first time you meet someone, before you know anything about them, you judge on appearance. When you are shopping for shoes, before you slip them on to test for comfort, you judge them by the way they look. Or even a web application, before you dive into it’s functionality and how it works, you judge it based on the design. The fact of the matter is, good design is valuable, because it influences these perceptions, and ultimately your choices.

Recently I was having a conversation with the newest member of the dynamIt team, Andy Hutter, who had just purchased a new TV for his place. So I asked him which television he chose. He said that his decision came down to an LG or Panasonic, and he ended up choosing the LG because of how slick it looked. Two televisions comparable in price, picture, size and specs, but Andy chose the LG because of it’s design.

Design on the web is no different. People will form lasting opinions about a company or organization based on the way their site looks, and make choices based on that. Users make nearly instantaneous judgments of a web site’s visual appeal. These impressions impact perceived credibility, usability, and ultimately influence purchasing decisions. Web users form first impressions of web pages in as little as 50 milliseconds (1/20th of a second), according to Canadian researchers. Check out this article that highlights a study on the “halo effect” and “cognitive bias“, supporting the theory of first impressions in web design.

Sometimes it can be hard for designers to make clients understand the value of good design. A lot of companies/organizations settle with a free template, a site done in Frontpage, or having their secretary’s son do it because he is a computer science major. There is a ton of value in investing in a good web presence, because it’s a lot more than just making a pretty page on the interwebs.

It Will Improve Your Company Image

Visual communication is an integral part of a customer’s experience of a company or product, and it plays a key role in building a brand image.

It Helps Reach Company Goals

Good design is backed with a strategy. Our process at dynamIt allows us to discover a client’s objectives with thorough strategy, and this leads to design solutions that push to accomplish company goals for the future.

It Establishes Trust

Many studies have shown that the design of an unfamiliar ecommerce site will greatly impact the decision making process when a user goes to buy a product. I know that when I go to buy something online, if the site design sucks, I’m leaving.

You Will Stand Out Among Competitors

There is a lot crap on the web. I think this is pretty straight forward.

Even though your site may have superior products and services, an initial negative impression from a poor design can steer customers towards your competition. You only get one chance to create a good first impression, make it count.

Are there other scenarios where design has influenced you?

yes, we made the internet. yes the internet is "remaking" us… to a degree… but the core understanding by those who "make internet" must still be adaptive to the human condition, consumption habits and expectations, no matter their status.

Internet from Jordan Clarke on Vimeo.

Recently, we’ve had multiple requests for “print” links and printable versions of web sites. So, I started wondering, with widespread access including mobile, does anyone still print from web?

I posed the following question over twitter the other day: Does anyone actually print websites? If so, what types of sites and how often?

Some of the responses:

@Selicker: I print maps, instructions, and recipes

@noahwesley: I’ll rarely print a blog post/article to read later if I’m going to be bored and w/o laptop.

@fricto: My wife @owlpoo prints blog posts about cooking and knitting for the recipes/patterns quite a bit.

@beccarkt: yes! For competitive audits for clients and for articles, etc. Probably a couple times a week

So, YES. People still do print from web. They print stuff like, recipes, instructions, maps, long articles, and reports. Frequency seemed to vary-some as often as every few days, others very rarely-but the fact remains, web users still hit Control+P.

But even if not many users are printing from web anymore (which I have concluded is NOT the case), it is still really important to define a stylesheet for print.

It’s not that difficult to do, CSS makes it so easy for us to implement a print-only stylesheet. Sure it takes some more dev time to define layout styles that hide the fluff, ensure high contrast, and size things appropriately. But, that extra time makes your content and site much more accessible and usable.

Here are some dynamIt tips to writing that print stylsheet:

• If you do not already know this here is how to specify the media type for a style sheet:
  <link type=”text/css” rel=”stylesheet” href=”print.css” media=”print” />
• Remove things that don’t need to be seen when printed: navigation, features that do not pertain to the page’s primary content, ads (maybe?). The easiest way to do this is use display: none;
• Make sure that your text-to-background contrast is high. This is essential for readability.
• Do not bother making background images or colors print. People do not print from web for the design, they want content. (See above).
• If you are building from a fixed-pixel width design, keep your printable content around 700 pixels wide or less.
• Don’t forget to test it out by printing (and yes this means printing from IE6, IE7, FF2, FF3, Opera, Safari).

Designing for the web versus designing for print can be a completely different experience for a graphic designer. Embracing the medium as something different from print, and understanding how design works in digital media is the first step that most designers need to take. Specifically, come to grips with the fact that, on the Web, design is not a method for implementing narrative, as it is in print, but rather it’s a method for making behaviors possible.

I had to take this step when I got the opportunity to work at dynamIt after undergrad. I ventured out into the design world gripping a degree that was based in print, with little knowledge of design on the web, but eager to get my feet wet. I’ll admit it, I wasn’t very good at what I do now a couple of years ago, but I can say that now because I have learned and embraced the intricacies of designing for web. Given this experience in the web industry, and specializing in user interface design, I have grown to appreciate the differences between print design and web design. The reality is that the web is not print, it’s not a great big graphic, and trying to force it to be that is just a bad idea.

If you’ve designed more than a couple sites for people, you’ve almost certainly heard a comment or two that sounds something like this: “That would look better if you moved the graphic down about 5cm or so.” or “I’d really like that blue to be as rich as it is on paper, can you do that?” The problem with this attitude is that it is based on a fallacy. That fallacy is that you can design a web page that will look identical and pixel perfect no matter where you view it. With most print projects this theory would most certainly be true, but that’s not the case with web design. What most fail to realize is that there is going to have to be compromise from the PSD (or whatever program you, as the designer, choose to use) to the final product. These compromises are inevitable and are most apparent in categories like audience, layout, color, fonts, and graphics.

Audience

Whether the web designer is working on an interface design, email newsletter, or banner ad, he or she is going to have to consider the audience and how they are going to interact with the design. 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, the designer is focused on getting the marketing message across, and these usually turn into forced tangibles like business cards, magazine ads, or product packaging. 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.

On the web the designer has to think about the overall experience, putting themselves into the user’s shoes. The overall goal is typically to keep the user on a page/site for as long as possible, while also making the experience easy, user-friendly, and visually appealing all at the same time. While I classify print design as being somewhat of a ‘forced tangible’, I see web as being even more difficult as a ‘voluntary intangible’.

Layout

Both print and web design require clear and effective layout. In both, the overall goal is the same, use elements of design (shape, line, color, type, etc) to present content to your audience. The differences start in the available space to create your design. I have always said that print design is designing with boundaries, and web design is designing to infinity.

In print, the designer knows what space, measured in inches, that they have to work with. This could be as small as a business card or as large as a roadside billboard, but the designer knows the space allowed from the start, and that the finished product will look the same to everyone who sees it. There is a lot more to consider than just the bleed line and safety areas when designing for the web.

First off, web designers live and die by the pixel, inches are erroneous. Second, a web designer is faced with the challenge of designing a site that looks good on all monitor sizes and monitor resolutions. Since the space with which a web designer has to work with is an estimate, you have to cater to the statistics, while keeping in mind the people who haven’t embraced newer technology. Over 50% of people who own computers have their web experience at 1024px by 768px or higher, and a mere 9% are at a lower resolution (800×600 pixels or lower).

Color

Dealing with color can be tricky for both web and print designers. It’s first important to understand the color models such as CMYK and RGB. The RGB color model is used when designing for the web, while the CMYK color mode is designated for print design.

In print the designer must consider how the colors look from the monitor to paper, but print proofs can ensure the desired result. When preparing the file for print, the designer will often choose ’spot’ or ‘process’ colors for the printer to use. These are colors you choose from a palette and identify with a pantone code that you provide to your printer.

Now when a web designer tackles a color palette and carries it throughout a design, there can’t be a guarantee that the end user will have the same experience. Colors on the web are not referred to by pantone codes, but by hexadecimal values (6-digit numbers), for example: black (000000) and white (ffffff). A web designer has to consider the difference in colors from monitor to monitor, and how color will be affected by brightness and contrast changes. If you use a CRT monitor the colors you see are much more washed out than others see on a newer laptop or LCD flat-panel displays.

Fonts

When a print designer adds the typography touches to a poster or package design, they can dig through their font libraries without any inhibition (unless the project has specific specs). When designing for print there are really no worries with what fonts the designer chooses to use, because in the end the final product will be seen the exact same by everyone who views it. Another small, yet overlooked difference between print and web design.

Choosing fonts for a web design is a much more delicate process, and unlike print design, there is no guarantee that the end user will see it the same way. Since there is absolutely no way one could predict what fonts the end user has installed, the web designer is forced to stick with ‘web safe’ fonts. These are fonts that are present on a wide range of systems, and are used to increase the chances that the content will be displayed in the original font. There is a work around, but it takes some programming from a developer, and it’s an open source Javascript and Adobe Flash based technology called sIFR. The reality of web design is that unless you’re planning to make every page of your site one large graphic, your page will have text on it.

By now, you’re probably thinking “but why not go the easy route and make the site all images?” After all, with a bunch of images, you can control the fonts and layout. There are several reasons why this route is a dumb idea.

Graphics

Sure using an entire page of images would be super easy to lay out, and you could use any font you desired, but there are things that most print designers fail to realize:

1. File size and download time. With a site that is 100% graphics, yes, the HTML file size would be small, but unless you create very tiny Web page graphics, it will take forever to load.
2. Accessibility. Images are fairly inaccessible without alt text, and unless you’re planning on reproducing your entire site contents in one giant alt tag, your site will be completely blank to the typical screen reader.
3. Search Engine Optimization. For much the same reasons as accessibility, if your site is a giant image, search engines will not read it, or won’t read it very well.
4. Links. Sure you could use image maps, but that’s just a pain.
5. Maintenance. If you find a typo, you have to find the original image, edit it, resave the image and then reupload. With text, you’d just edit the text directly and be done.

Web design is not print design. The styles are different, the way each are executed is different, and the way the end user interacts with each type of design is different. Not understanding, appreciating, or acknowledging the gap between web and print can cause a lot of headaches, especially for developers (I have seen it happen…a lot!). While it is possible, with CSS, to get very precise layouts, it will never be as precise as print. Take the time to educate yourself a little before diving into a web design, there are plenty of resources out there to get you up to speed on best practices and trends. Here are some of the sites I use daily to keep up on design and the web, check them out:

http://www.smashingmagazine.com/

http://www.abduzeedo.com/

http://www.webdesignerwall.com/

http://www.sixrevisions.com/

http://www.webdesignledger.com/

If that’s not enough and you want some more, check out these sites that showcase even more invaluable resources for design, inspiration, and productivity.

A Little Story

I was having lunch the other day with a principal at an interactive agency here in Columbus (Shift Global) and the waitress overheard part of our conversation (just some shop talk). I had been avoiding eye contact with her and my order was quick [more on this later]. As she set the check down she asked if we ‘did websites’, to which Bill answered yes, we both did.

She proceeded to tell us that she needed someone to ‘do her website’. She had engaged a firm months ago to get a site/app built, but they went out of business while under contract. They refunded her money in full and she was now looking for someone to dev it for her so she could ’start making money’.

She was really frustrated because the original firm had quoted and accepted a contract for $5,000 and she was now getting quotes for 3x, 10x, 15x this amount [will connect to this later too]. She knew that “these prices were ridiculous and that it could be done for the original quote” (perhaps there was a reason the original firm went out of business?) She asked if we had cards. I sheepishly said I didn’t have any on me.

Why had I avoided eye contact? Why didn’t I hand over a card? Well, dynamIt has a policy to give at least a half hour of time to nearly anyone who gets in contact with us. We may know, immediately, that they don’t have the budget or the expertise to make an idea work (or we may know that the idea has either a) been done before or b) is just a bad idea), but it’s our practice to hear them out, at least for a while.

The funny thing is - this waitress had been at our office 2 weeks before, had detailed the idea and situation to me. She didn’t have a revenue model (I asked how she was going to make money and she gave me one of those “oooohhh yaaaa…revenue” looks) but did want some rather complex inter-user interaction. I’d given her a ballpark which I knew she probably couldn’t and wouldn’t go with. She had responded to the ballpark in an annoyed way, and we left it at that. Thus, my lack of excitement to see her again.

My point - GOOD.WEB.COSTS.MONEY.

This doesn’t just happen with individuals who have ideas that “rival Facebook and Google”. This happens with clients big and small, startup and established. In general, we find there are few cases in which people have a concept for what good web costs.

Because people have a Hotmail (gag) account, have searched Google before and may be able to purchase something off of eBay, they assume they know what goes on in web development and how much it should cost. I’m not saying that everyone needs to have intimate knowledge of the industry (my colleagues and I would certainly be out of work), but, people, PLEASE!

Good web is strategic. Good web is architected, is planned, is built, tested and strengthened. And, one thing that good web most definitely is, it’s NEVER DONE. You get what you pay for. There aren’t many industries where this is more true than web. A holistic and anthropological solution requires dynamic minds, critical thinking, problem solving and execution. People should and do pay for this. 

Oh, and another thing - we’re not going to take shortcuts, hack things together and simply react to a problem. Not only our reputation, but good, sustainable and extensible web (the industry/platform) is dependent upon well-built applications and solutions. So, as I say, we aren’t going to simply react to a problem with budget and timeline in mind and risk compromising the product. Rather, we’re going to respond to a problem with a solution. Response and solutions cost money.

that is all.

one.

nick

After much deliberation in the dynamIt War Room, we decided who would be the next member of the team. We submitted our pick and stood calmly as the commissioner strode toward the podium, “With the first pick in the draft, dynamIt selects Michael Paull, Web Developer, The Ohio State University.” Flash bulbs twinkled from every direction and the crowd let out a triumphant roar as Michael quietly accepted their applause…

Ok, so that is not exactly how it happened. At any rate, I would like to introduce you to the newest member of the dynamIt team, Michael Paull.

Michael recently received his degree in Journalism from The Ohio State University, which means he brings yet another interesting perspective to the table. But his knowledge and experience do not stop there. He is, of course, well versed in web having worked as a both a web developer and project manager. He specializes in web standards compliant design and coding for accessibility, adaptability and backwards/forwards compatibility, so yeah, his code validates. He is no doubt very detailed oriented, he does hold a green belt in Six Sigma. All around, Michael is very resourceful and a welcome addition to the team. Plus, we certainly approve of his hobby of brewing his own beer. He shared an excellent batch with us last week. Learn more about Michael by visiting his blog at http://www.michaelpaull.com. Also, follow him on twitter: @fricto.

So, what do we look for when it comes time to up our development capacity?

Well, we look for developers who write graceful xhtml and css that works across the gamut of browsers, are well versed in PHP and mySQL, are comfortable setting up a relational database. We want our people to be efficient, spend their hours wisely, be self-managing. We expect a developer to be friendly and approachable, to be able to sit down in front of a client and confidently explain what we do.

Sure, those are the obvious ones, but one thing that we’ve learned even in the short time of having employees, is that there is more to it. What really counts, what really sets someone apart can be summed up as follows:

A dynamIt team member must be one who:

• is passionate about web, lives in web and enjoys doing so,
• has both the willingness and the ability to learn,
• fits into our culture well.

Luckily for us, Michael seems to have all of these things covered. But, we are always looking for new talent, we have filled our current needs with Michael, but we do not plan on slowing down anytime soon. So, if you think you can handle what I’ve laid out above, get in touch. We’d love to see what you’ve got.