Logo

Out of the three, the term logo is the easiest to understand. A logo is a symbol or font based design, also known as a logotype, that represents a company or service. The logo works much like a signature. It can be a mark like the Nike tick or a purely type driven logo like FedEx.

Logo Examples

• 
• 
• 
• 
• 
• 
• 
• 
• 
• 

Identity

The identity is more global. It influences how an individual feels about a company through visual consistency across various mediums. For example, color schemes, stationery, photo styles, font styles, logo guidelines (i.e. spacing, sizing, reproduction) and grid systems all take part in defining the company's identity.

Identity Examples

• Business cards, stationary and print collateral
• Style guides, including approved colors, typography and logo usage
• Product packaging

Brand

Think of the brand as something less tangible. A brand can't be designed or created. It's the collective perception one builds about a company based on the logo, identity, goods or services provided and also their experiences with the company. Brand value is built over time in the minds of your customers.

Brand Examples

• Zappos: synonymous with great customer service
• Crate & Barrel: modern furniture and clean design
• BP: big oil company that prioritizes profits over safety and the environment
• Starbucks: good coffee that's always around the corner

My first article as an author for Smashing Magazine published today and I'm extremely pleased with it. It's called "Web Development for the iPhone and iPad: Getting Started".

Vitally and the team at Smashing are first class in every way. I'm looking forward to writing more for them if they let me. If you don't already, subscribe to their feed. It's one of the very best for web designers and developers.

Most people can appreciate the time and energy that goes into crafting a unique, effective website design. Companies and organizations spend good money for quality design that says a lot about their brand and what they stand for.

On the other hand, words and copy that bring a website to life are often an afterthought. Web copy has become a tool to manipulate search engines rather than speak to people in an authentic, persuasive tone.

Making design your first priority is putting the cart before the horse in my opinion. Hours should be spent crafting the right copy for your site before starting on the first mockup. This ensures the best possible chance at success when the designs are created because if it's well done, it makes the copy really pop. When copy pops, so does your ROI.

I spend a good portion of my time working on copy for some of our sites and have come up with a guideline. At least 50% of the time you spend designing the website should be spent creating and refining copy. On average we spend at least 40 hours designing a website, so that means the minimum amount of time spent on copy should be 20 hours. If the site has more than 15 or so pages of static content, the percentage should be even higher.

Just like a quality website design takes time and multiple iterations to get perfect, so does your copy. Your first or second draft should never make it anywhere close to a finished web page. By using the 50% rule you will be a great deal closer to a final design you are thrilled with, and results that you are even MORE thrilled with.

First Impressions are everything. In business, the first impression usually starts with a logo. Companies go to great lengths in designing their logo so that their first impression is a memorable one for you. Here is some general information that is important in crafting the right logo for your company.

1. Functionality/Versatility

• Great logos work well across many different mediums, whether it's on a business card or a billboard display
• How does it scale? Great logos maintain their integrity and quality at any size.

• 
• 
• 
• 
• 
• 

2. Uniqueness

Since people spend less than five seconds on average looking at a logo, it's important to stick out!

• 
• 
• 
• 

3. Works in black and white

• Work with a designer that starts the logo design process in black and white
• Color is important, but it should not be an integral component of the logo
• The logo should communicate the same message in black and white as it does in color

• 
• 
• 
• 
• 
• 

4. Relevance

Your logo should accurately reflect the company's personality and communicate an appropriate message. A dance club's logo wouldn't work for a financial company. A fast food restaurant's logo would not work for a children's clothing store. It's important to get to know your client's business and personality before diving in to the project.

• 
• 
• 
• 
• 
• 

5. Symbol or Logotype, Make it Memorable

Symbol – An identifier/mark next to or above the company name.

• More common than a logotype
• Easy to recognize

• 
• 
• 
• 
• 
• 

Logotype – A text-based logo with no symbol

• Most effective with a short company name
• More difficult to make unique and memorable
• Heavily relies on shape and color

• 
• 
• 
• 
• 
• 

I hope these tips will come in handy when it comes time to love on your company logo. Be sure to check out works of some of the greats, like Saul Bass, Ivan Chermayeff and Paul Rand and many more.

Over the last couple of weeks we launched two projects of note that turned out exceptionally well. Our thanks to Xgaming and EACEF for letting us be a part of their new website projects. Both clients are fantastic to work with.

Xgaming

• Project details
• Visit website

EACEF

• Project details
• Visit website

An extremely important part of the web design process is wireframing. It involves taking all of the specs, notes, creative briefs, content and so on, and finally putting them into one complete picture. Over the years we've tried all kinds of different tools and techniques, but have more recently settled on a process that works great.

Every project I work on starts with a Sharpie and a piece of paper. It's cheap, low-tech and fast. In a couple of minutes I have some ideas on paper to work with. Once it's full, I start over and try to make a better one. Sometimes we'll go into the design process with 2-3 home page wireframe designs just to see what sticks.

Why a Sharpie (Fine Tip) and not a pen or pencil? They are less specific and they fill the page faster. Sharpie's force you to get creative with space and make room for only what is most important. It's not possible to get too wordy or carried away with a Sharpie.

Another benefit of paper wireframes is that there is no learning curve. Anyone can read or create a wireframe without having to learn anything new. When working with people of all different technical abilities, paper puts everyone on the same level and forces focus on the important stuff.

Here are a few examples from projects we have done:

Response TV Wireframe

Response TV Design

Rolling Hills Media Wireframe

Rolling Hills Media Design

Linkpatch Account Wireframe

Linkpatch Account Design

The Dot Grid Book

I've done a lot of research trying to find the perfect wireframing sketchbook. Without a doubt it is the Dot Grid Book. This notebook is super-functional, well designed and great quality, making it an ideal geek tool. It's a pleasure to use.

This notebook is double spiral-bound with 80lb, perforated paper. It's easy to scan everything in when finished and keep it on my computer for further reference. It also handles the Sharpie marker bleed through to the other side of the paper pretty well.

Getting More Specific

Although we believe it's best to wait as long as possible to worry about specifics of a design, eventually it comes time to take wireframes further. I recommend a couple of tools for making pretty digital wireframes:

• Mockingbird (Web app based on Cappuccino) - http://gomockingbird.com/
• OmniGraffle (OSX Software) - http://www.omnigroup.com/applications/omnigraffle/

Further Reading

• Wireframes Magazine - http://wireframes.linowski.ca/
• 37signals: Sketching with a Sharpie - http://37signals.com/svn/posts/466-sketching-with-a-sharpie

In a recent post, I boldly proclaimed that people not doing multi-variate testing on their websites are lazy. To prove that we drink our own kool-aid, I wanted to share the results of some tests we have been running on Linkpatch.com, a web application we built.

Through the use of Google analytics and website optimizer (both are free tools to use), we were able to increase account signups by 74% over a four-month period. Here are the three tests we ran:

1. Re-design the Tour Page

I learned pretty early on that the tour page was not helping us like it should. Early feedback from customers and friends that tested the software proved that the copy was wrong. We needed to explain exactly why we did not create a website crawler or link checker, and clearly outline the unique benefits of Linkpatch over every other available solution.

Some key metrics I was watching in analytics when testing the old tour page versus the new one were "Time on Site", "Bounce Rate" and "Exit Percentage". Here are the results:

Time on Site went up 35% as a result of this change, which is a great improvement in my opinion. Bounces went down 14%, and the Exit Percentage stayed about the same. There is still more to improve on there, but most importantly, the conversion rate for people that viewed this page went from 3.3% to 4.5%.

2. Test Headlines

Next was the main home page headline. A great headline is everything in my opinion, because an effective one will qualify our target audience and explain exactly how the app makes their life easier. Here are the three variations we tried:

Original- "Linkpatch reports broken links and images on your site, and provides all the information you need to fix them quickly."

Alt 1- "Linkpatch monitors your website for 404 errors, and provides all the information you need to fix them quickly."

Alt 2- "Linkpatch monitors your website for errors, so that you can be the first to know when users run into a problem."

As you can see, the differences in copy are subtle. Here's how they did over about a month of testing:

Alt 2 was the variation that proved to be the best headline for us to use. It resulted in a conversion rate of 5.28%, which was 11.6% better than the original we launched with.

3. Test Call to Action Button

The final test we worked on proved to be the most important, because it had the widest margin of difference between variations. Many people have debated the "right" language to use in a CTA button for a web app, and "Plans and Pricing" somehow became the de facto standard for most. However, the reason testing is important is because EVERY site is different. The same rules don't apply 99% of the time, so we decided to test the buttons for ourselves to see what converted best. Here are the buttons we used:

Of the four combinations, the "See our plans and pricing (free trial included)" button won:

As you can see, the winning button had a slight edge over the original one after testing for about a month. What is most important to note though, is the estimated conversion rate by the time the second test was over, compared to the estimated conversion rate in the first test. From beginning to end over those 4 months of testing, that's where we saw a 75% increase in conversions according to analytics:

How Long?

Although these 3 tests spanned about 4 months, it was all in my spare time. All in all it only took about 10-15 hours of work and study.

What's Next?

Keep at it! Re-work and re-test some other variations to see what works. As the site evolves and things change, there will always be plenty of things you can test on the site in search of a higher conversion rate.

Takeaway

The biggest takeaway for me is to quit fretting about small design and copy decisions prior to launching the site. Give it your best, then create multi-variate tests for anything you feel may impact conversions. There is no way to be right 100% of the time about this stuff, so take the pressure off and your users will tell you what works best.

One final note to keep in mind is that you can't test your website or get great quality feedback until it's launched. We see projects get delayed all the time while internal decision-makers contemplate what they think is best for the website. It should never be up to them if you are in the business of maximizing conversions. Just make an educated guess so you can launch and start testing! That's the only way you can find the most accurate answer.

Imagine for a moment that you are engaged to be married. One very important decision you have to make is choosing a photographer for the wedding and reception. Photographers can easily cost $2,000 and up, so you want to be sure about your choice.

You are having a tough time making a decision, so you invite five photographers to participate in your wedding. There is only one caveat: once the wedding is over, you will review the all photographs, and choose the one photographer you like best and only pay that person. The other four get a friendly handshake and nothing more for their hard work.

This is the concept behind what people in the design world refer to as "spec work". It's been quite a hot topic as of late. Entire websites (this one too) are now dedicated to helping companies find designers willing to do spec work, and basically compete for the right to work with a client on their project. We have gotten inquiries about doing spec work at least twice already this year, so I feel like it is important to explain why we don't participate.

The Process Gets Shorted

One of the criteria that must be met before we take on a project is answering YES to the following question: "Can we do really great work?" Our very best design work is the result of seamless collaboration with the client, extensive research and careful planning before ever getting started on the visual design. With spec work, this part of the process is often cut short or ignored all together.

By choosing a design created on spec, it gives too much weight to the visual side, instead of what will perform best with customers or help grow your business. The visual part of a site is only one piece of the puzzle, but with spec it is often the only piece of the puzzle considered by the client upfront.

We enjoy the process of creating a user-friendly, effective website; but that process takes a lot of time and effort. It's simply not feasible to do it all for free, with no guarantees of getting paid for it eventually.

When Spec Does Make Sense

Whether spec makes sense for you as a client is all about what you hope to achieve with the design. If one or more of the following characteristics describe you, it's possible that it will be a good fit:

• You can accept that the initial work will not be as polished or thorough
• You don't really have a good idea of what you want "until you see it", and need to see styles and variety that is all over the board
• Your budget is limited, and expectations are not incredibly high
• You have no problem working with someone that's less experienced, but eager to learn

Decide What Works for You

I personally think it's wrong to expect any professional to perform 10-25 hours of service free of charge without any guarantees. But plenty of creatives are totally okay with it! If you are a designer, and use spec work as an opportunity to prove yourself and get better, then make the most of it.

No matter what side of the fence you are on, it's important to respect those on the other side. Some of that has been lost in all of this banter across the web. We spend a ton of time on all our projects and really dedicate to the process, so spec does not make financial sense for us or the clients we work with. However, for those that can make it work and are proud of the results, more power to you!

We had the great pleasure of launching a number of projects over the course of April, and three of them recently landed in our portfolio.

Vigilant Investments

Visit this site in a new window
Read about the project

The Noticer Project

Visit this site in a new window
Read about the project

The Salon Professional Academy

Visit this site in a new window
Read about the project

A thrilled customer is the biggest WIN a company can have in my opinion. Happy customers can single-handedly keep you in business, and outlasting any challenges a recession or struggling industry may bring about. For Project83, our customers are everything, considering we have yet to spend our first dime on marketing (and don't plan to).

That said, providing an outstanding customer experience in our business (web design and development) takes work—a LOT of work. It's something I was severely under-prepared for in starting this company, and I definitely have room to get better; even after nearly four years of learning.

If you are considering a career in web design or already have one, I feel it's important to be aware of what it takes to WOW a client over the course of a project.

It's a Marathon

When you typically think about customer service, it's a sprint. Purchasing a product in a store, going to a restaurant, or calling a 1-800 number are all forms of customer service that begin and end in a short span of time, thus the reason I call them sprints.

A typical web design project is very different. It's a marathon. It can easily take 3-6 months of work to provide one single outstanding customer experience to a client. That also means you have six months to screw it up.

My advice? Be patient, communicate constantly, take responsibility for mistakes and meet the deadlines you set. Do those things and you've already surpassed most companies in our business.

The Work is Subjective

By providing a creative service, literally nothing we do is black and white. It's all up for debate until you have analytics to back up your theories. All of our work is subjective, and in the end the client has final say on which direction the project goes. If we believe a project is perfect, yet the client believes it's not close, then it's not close. Sometimes that can be a hard pill to swallow.

Consider creative differences as a challenge for you to get better, and to get out of your comfort zone. At times we simply have to trust that our clients understand their business better than we do, and just make what they want happen. At other times you should be honest and try to steer them in another direction. It's a delicate balance, but always make your points with respect, and be willing to move on if they don't agree with you.

Personal Relationships are Everything

Web development is still like any other business in that it revolves around people. Due to the long-term nature of a web project, you are expected to initiate and maintain a great working relationship with the people that hired you, or else things can go downhill. If you are an unbelievable designer with bad people skills, it's virtually impossible to make your customers happy, despite the work being good.

My advice is not to be a hermit (I can struggle with this). Seriously, don't lean solely on email communication with clients. Check-in with them on a regular basis over the phone or in person to keep your relationship on good positive terms. Email can be so easily misinterpreted and cold, that you simply must do more to keep your relationship with a client on solid footing.

It's Not About You

As a matter of personal pride, it is perfectly natural to want each project you work on to be your very best. But that won't always happen, and you have to be able to smile through it.

Web design work is about honoring the client, and providing a product for them that will generate a great return on investment. Most importantly, you want them to have a big smile and tell all their friends about the great experience they had working with you. Do that and everyone wins. Make the project about you or your ego and you will lose most of the time.

I am not writing this post because we have the customer service thing down; because we don't. However, I do think we're getting better at it every day. Being conscious of common pitfalls in our business is the first step in rocking them out and providing outstanding customer service.