Headspace Design

To Firm or Not to Firm? How to Choose Between Going Solo or Going Big

Posted On July 25th, 2008 Author Kyle Racki Filed Under Headspace News, Business, Comments 4

A post I wrote has been accepted to Freelance Switch.

The article has been copied down below (but you should still check out the site!):

Before going out on their own, many freelancers struggle with the idea of how to position themselves in their market of expertise. Considering many freelancers have at one time worked in an agency setting, it’s tempting to have the agency mind-set when crafting your promotional materials.

For example, the decision of whether to use ‘I’ or ‘We’ can dramatically affect the way you’re perceived by prospective clients; “We can deliver excellent results” sounds much larger than “I can deliver excellent results”. The big question, then, is this: do you want to be an agency or a freelancer?

The truth is, most big agencies started as one or two people. For those who knew they didn’t want their business to stay small, they had to position themselves as something greater than what they were, and grow slowly over time. Therefore, any freelancer starting out has to consider the question of whether he/she wants to stay a freelancer, or grow into a firm. There are definite pros and cons to either approach. Here are just 5 factors to consider:

1. Overhead
2. Competition
3. Client caliber
4. Hourly rate
5. Busyness

Freelance

1. Little overhead. When you work from home, as most freelancers do, you have little to pay for, other than the cost of keeping a roof over your head, food in the fridge and the internet connection plugged in. Most of the money you make can go directly into your pocket, whether that be a savings account, investments, or a new Apple cinema display. The lower your overhead, the higher your profit margins.

2. Competitors are colleagues. Competition is fierce in any business, and the same goes with freelance design/programming/writing. That being said; many of our freelance competitors tend to be colleagues or even friends. People we can have a beer while sharing client horror stories. Sure, we may lose projects to them on occasion, but for the most part, there’s enough work to go around, and clients make their hiring decisions based on our portfolio, price, experience and professionalism—and nothing else.

3. Worth less in the client’s eyes. While reputable freelancers can certainly gather big client work, many large companies tend to favor established firms for their $50K projects. It can be hard to convince a prospective client that you can do the same quality of work as a 10 person company with a downtown office, a team of designers and coders, and an attractive front-desk person who offers to hang up the clients’ jacket and make them a cup of coffee. Meanwhile, the lowly freelancer is sitting with the prospect in a Starbucks. The truth is, many prospects worry a one-man band is unreliable since, as they often put it, we could ‘get hit by a bus tomorrow.’

4. Lower rate = no outsource potential. Let’s face it, freelancers generally can’t command the high rates that even small agencies do. Clients know we don’t have to pay employee salaries, or keep the phone system running, so the same caliber of work will often get sold at half the rate that the big boys charge. Because of this, freelancers generally can’t afford to outsource their work and turn a profit. As a result, they can only bill for the hours that they are physically able to work. This may mean they have to turn down work on occasion.

5. Octopus syndrome. Freelancers tend to suffer from this. They are required to be all things to all people; designer, writer, programmer, copywriter, strategist, accountant, cold-caller, dog walker, networking-event shmoozer—the list goes on. As previously stated, freelancers usually can’t afford to outsource their responsibilities, which means they have less time to be working on the stuff that actually pays the bills.

Firm/agency

1. Major overhead. Office rent, furniture, computer hardware and software (times the number of employees), file servers, phone systems, not to mention salaries—firms and agencies have overhead to spare. It’s usually the ol’ bricks and mortar that destroys the cool little design firm that used to churn-out award winning work… before they went under.

2. Competitors: they’re out to get you. Unlike freelancers, competing agencies are usually not the best of friends. Because of the aforementioned overhead problem, every agency needs all the work they can get. That means they’re usually savagely competing with other firms on proposals, and often bad-talking their competitors when they can. That can be a little unnerving when your monthly break-even rate is 50K.

3. More credible to large clients. One of the benefits of being considered an agency is that big clients with big projects have no problem handing you big wads of cash. You’ve got an office and a fancy phone system, so the client has less concern about liability. In this case, perception is everything.

4. Higher rates mean outsourcing potential. Because agency rates tend to be in the triple-digit-per-hour range, you as a business owner can leverage the talents of other people, whether that be salaried employees or contracted freelancers. This means you can take on more projects, and, if well managed, can turn a good profit.

Think about this in simple terms; imagine you could take on 10 projects a month, at $10,000 per project, each one requiring 50 hours of development time. You have 10 good contractors to outsource to who charge $50/hour, one contractor on each project. If you paid each contractor $2,500 for a job, and took the time to manage each client and each contractor, directing the quality of the work and the expectations of the client—you’ve just made $75,000 that month, you’ve got 10 happy clients, and 10 happy contractors who can be used in future projects. This is something you would have never been able to achieve as a solo freelancer.

5. More time to focus. In theory, if you have a team of either employees or freelancers at your disposal, you should have more time to do what you do best. If you find you’re better at developing business than designing, then you can hire a great designer and have fun watching her work some magic while you profit off of it. If you love being creative, but have trouble managing the business end (paying bills, invoicing, networking etc.), then you can hire someone else to fill that role. That means you’re spending your time doing what you love and what you’re good at, and avoiding the octopus syndrome freelancers often contend with.

Do what feels right

So what do you choose? There is no right or wrong answer because it all depends on what you value most. If you’re positioning yourself as a business, you can hope for more money in the long term, but more initial stress and start-up risks to go with it, and greater complexity overall.

Freelancing tends to offer a simpler way of life: working on what you want, when you want, but it may not bring the prestige of working on million dollar projects for international brands, or making the top CEO list in the local business mag.

Every company starts as one or two people, but it is your positioning that will dictate your growth potential. If you’re content to stay as an independent freelancer without any ball-and-chain overhead, then position yourself honestly as such.

Do you have any other factors that can help you decide whether or not to grow your freelance business bigger?

A good process can work wonders for your design

Posted On July 7th, 2008 Author Kyle Racki Filed Under Design, Business, Comments 7

In my experience, I’ve noticed that with traditional design studios, there seems to be more care put into the design process. Sometimes this process can be lacking when a firm specializes in the web. Perhaps this is because web firms have more to think about, there’s SEO, analytics, and the big focus; development. Poor old design can get relagated to the back seat it would seem.

But if you’re a designer, you need to fight for your craft! In many ways, this can be done by having a tighter process, which, instead of impeding creativity, will maximize client satisfaction and design quality.

Typical Design Process

1) Call/email/meet with client, go over design questionnaire
2) Begin design
3) Present design, and receive feedback
4) Make any necessary revisions
5) Once approved, send templates to development team
6) Review and test before launch

Okay, so this is a pretty standard process. I’ve found time and again though, that a few extra steps in the beginning and a few extra steps at the end go along way to minimizing needless client-revisions, and maximizing the quality of the final product. As you see, there’s only one extra number in the steps:

Suggested Design Process

1) Meet with client
2) Design Brief
3) Information Architecture/Wireframe/Sitemap
4) Design
5) Present
6) Translate to code
7) Refine and test

1) Meet with client

I can’t stress enough the importance of meeting with a client face-to-face. In many ways it can completely affect the final outcome of the website as well as the working relationship with the client. It is where you get a chance to present yourself as a consultant to the client, not merely an order taker.

The problem with sending an email questionnaire is that the client simply fills out an order for the designer, and then expects the order to be carried out the way a cook in a restaurant prepares a meal based off of written instructions, without ever meeting the patron. This is not the way to go about a design project. We want to develop real trust between ourselves and the client, trusting they know their business, and they need to trust we know design, and have their business interests at heart.

Also, you’ll notice that clients will often say completely different things when they fill out a questionnaire as opposed to a discussion, where they will naturally be more candid and less ‘official’. It’s this reading between the lines that will give you as the designer tremendous insight into the mind of the client.

If a personal kick-off meeting cannot be arranged (in the case that the client is out of the local area), a phone conference call can be arranged, but again, email exchanges are greatly discouraged, at least at this stage (once you know the client, email exchanges are fine).

Another note, it’s incredibly helpful to discuss content at this point. Getting a client thinking about their content early will reduce the likelihood of a site being put on hold for weeks while the client struggles to provide content. Having content, even if only rough, will also improve the design. Instead of designing a template with lorum ipsum, you will be designing with real content in mind. Content in this case can mean photos/video as well as copy. The more is planned from the beginning, the better. Never allow the client to treat content as an afterthought—it is perhaps the most important element of any website.

The business benefit of taking this approach is the up-sell factor. Unless you bring it to their attention, clients rarely think about the content. By reminding them that they need to provide it, you can often sell a client on allowing us to bring in a professional copy-writer for the written text, and a professional photographer for the images. This gives us better quality content to work with, and also brings in additional revenue for the company.

2) Present a design brief

Before even beginning the design, it is helpful to present a design-brief to the client. This is a common practice in traditional agencies, however it sometimes gets overlooked in a web design company, where other services such as site marketing and development can overshadow one of the key components to a site’s success—the design.

A design brief simply states back to the client in writing everything that was taken out of the kick-off meeting. It shows what your design strategy is based off of the clients’ goals. It defines for a client how to judge the success of the project, giving them a measuring stick, and eliminates the “wait and see” attitude of the client (ie: “I’ll know when I see it whether I like it”).

Once the design brief is signed off, it will serve as your guiding point for the rest of the project. If you stray from the brief, your client will let you know, and most likely question the design choices. If the client feedback is excessive and strays from the brief, you can always go back to it and state how your design fulfills all the mandates of the brief.

A good design brief is a crucial part of the design process.

3) Wireframe and site-map

Although its tempting to begin the design at this point, it can be helpful present a wireframe and sitemap to the client. This need not be in person, but a phone call to discuss is ideal.

Essentially, this is information architecture. You’re trying to get the client to understand and provide feedback on the information hierarchy without being ‘distracted’ by the branding aspect of the site design (ie: type, colors, photos). This will help the client comprehend your layout, which blocks of information go where, and it will help them understand the basic flow of the site—how users get from point A to point B.

This process can help you as the designer come up with ideas that improve the site usability, without being concerned (at this point) with the visual aesthetic.

4) Design

Now with all the necessary research and insight into the project, you can begin designing. Before starting the design on the computer, have a creative session with the design team. This is something done in most creative agencies, and again, gets overlooked in a web setting. It shouldn’t. A website deserves as much creative strategy as a print, radio or TV ad. Get together with the group, briefly discuss the clients goals, and then throw out concepts. Some of the greatest sites designs are based off of a concept, which help differentiate the client site from their competitors.

Remember that not just designers need to be involved here. It can be incredibly beneficial to brainstorm with a developer as well. Though we may not believe it at times, they are creative people in their own right, not just brains in jars plugging in function calls. Often, good developers will be able to offer insight into current development techniques being used that improve site usability, such as an interesting content feature, or a JavaScript method that still keeps the build within scope.

Before, during and after this, do thumbnail sketches of the site design so you can freely experiment with the design elements before being restricted by the computer. Remember, the software is only a tool to digitally translate your design. Once the team has brainstormed, leave them out. It doesn’t make business sense to have two designers working on the same site, nor does it improve the design by having multiple designs to choose from, which leads us to…

Don’t create more than one design. I highly discourage the act of mocking up multiple design options for a client. It devalues design, and wastes time and money for both the company and the client. Read more of my rant on the topic of multiple designs.

Although a common practice is to design a home page and a sub page layout, it is often beneficial to actually lay out the majority of the website using real (or close to real) content (which you received by now thanks to pestering the client at the beginning). Laying out standard pages such as ‘about us’ and ‘contact’ allows you to create sub page layout variations that depend on the content. This also gives the client a more concrete idea of how their site will look once coded and live. Of course, you need to actually enforce that these pages look like they were designed once they’ve gone to code land.

5) Present/revise design

With a finished design presented to the client, discuss with them how this design is based off of the wireframe, and more importantly the design brief. Show how all of the clients’ mandates for their target user are being met by the design. Don’t simply send it to the client and ask them if they like it—you have to sell it. NOTE: I usually refrain from referring to a design as a mock-up. I feel that subconsciously, this devalues what your offering by suggesting that it isn’t ‘designed’ until its in code form, reinforcing the notion that design is quick, cheap and easy. We are presenting their sites design, though not in a work-able format, therefore this is the time for the client to present feedback, not once it’s developed. Many clients try to speed through this ‘mock-up’ process to expedite the build. This will only cause problems down the line, and will slow down the developers.

Revisions from the client should be handled delicately. The trick is to balance customer service with self-respect and professionalism. Often clients will make judgment calls based off of what they “like”. However designing according to a clients’ taste is like shooting at a moving target. There’s nothing to base your decisions from. This is why presenting yourself at the beginning of the process as a consultant, and having an informed design brief will minimize the chance a client will tell you he doesn’t like what you’ve done. If a site is well designed and based off of real business goals, it can be sold to a client, even if he wouldn’t choose to decorate his home in the same style. One of the best ways to sell a client on a design is to repeatedly point out that decision X has been made for the target user. Decision Y has been made for the target user. This way your taste and the clients taste are completely left out of the equation.

There are times when a clients negative feedback is right on the money. Because they intimately know their business, they may have a request for a revision on an element that you’ve completely overlooked. In these instances, it’s important to avoid the cliche designer attitude that our crap doesn’t stink. Coming off as dogmatic only frustrates clients and makes them question your professionalism. If a client is completely wrong, and you believe strongly in your decisions, kindly and helpfully explain why you did what you did, and the magic words, “I can do it the other way, but I highly recommend we go with this approach, as it will [restate benefit]”.

6) Translate to code

Once the client has approved the design—and signed off—create the XHTML/CSS templates for the developer if possible. I like to create my own XHTML/CSS from scratch for several reasons, the primary one being quality control. No one understands your design better than you, and you’ll be able to pay attention to the minute details that a highly caffeinated, overworked developer will likely ignore. Most developers appreciate having a well put together template of the “easy stuff” so they can plug in the dynamic data, and you’ll be happy that your left margin is set to 22px instead of 20px, and the headings letter-spacing is set to -1.5 instead of the default 0. Design is in the details. If we designed the content to start 38px down from the header, it needs to be that way. We didn’t make those design decisions arbitrarily, and we need to stand up for them, Of course, at this stage it is also wise to cross-browser test, which will diminish the chance of browser bugs once the templates are integrated with the CMS.

I feel it’s a good idea in a design/development team to have a CSS framework. Having a consistent repository of code, and naming conventions, browser bug fixes will speed up development, and allow team members to pass code around, not having to take time understanding what the previous developer has done.

An often missing step in the web design process is post code design. Too often designers hand off their precious designs like a mother bird throwing her babies off a high tree branch for the last time, never to see them again. As designers, we should be actively involved in the implementation of content. I highly discourage developers, project managers or *gasp* clients entering their own content. No one knows more about typography than designers, and just as in print design, web content needs to be pampered and massaged in order to be truly effective.

Of course, a client with a large site featuring hundreds of dynamic pages, in the case of a store, or online magazine, should enter this content himself, however it’s imperative to work with the developers to establish a set of rules that will give the client zero control over the design of the page. Remember, they’re paying to have a system to manage their content, not redesign their site. If I hire an interior designer to design my living room, and then once she leaves, I proceed to repaint the walls, and change around all of the furnishings, I’ve wasted my money.

7) Test and Launch

In the case of a small to medium sized website, I recommend training a client on the CMS only after their site is live. This will ensure the launch date isn’t postponed due to a client trying to learn their tool, and it will take a huge burden off their shoulders, while at the same time providing the aforementioned design quality control.

Conclusion

Though some of this stuff is a no-brainer, taking a little bit more time in the design process can, in a long-term way, save us from undue stress, reduce client revisions, make for a happier client who values our work, ensure that we are proud to show off our design after its launched, and even submit it to award sites.

See the trees for the forest

Posted On June 25th, 2008 Author Kyle Racki Filed Under Design, Comments 1

This post is for many of the designers who work on websites - whether exclusively (in the case of web designers) or occasionally (in the case of designers working in communications firms). Most of us are adept at creating good looking design templates. By that I mean a; header, footer, side bar, home page, sub page. These are usually the basics when we go about designing a new website.

However, it shouldn’t end there. More is involved in bringing a design from good, and passable—to the kind you see plastered all over design blogs and awards sites. And if you’re passionate about design, which I assume you are, you’ll notice that there’s something strangely mystic about the really good sites - the ones that are indelibly imprinted in your mind for months. What is it that accomplishes such a feat? It’s usually the amount of time and care that the designer took in polishing the content.

Keep in mind, I am not claiming to be a master at any of these practices. With every new project I’m constantly trying to attain to this higher level of web design. Sometimes I succeed, but not every time. It is, as it should be, an ongoing exercise—after all, there is no such thing as a perfect design.

Here I’ve identified some of the elements of a design that—if given attention—can truly elevate it above most others.

Forms

There are some usability and web design experts that argue passionately that forms should not be styled. They say that it is important for web forms to look consistent regardless of the aesthetic of the overall page.

While I agree that, as one of the most fundamental elements that separate a website from a non-interactive medium like print, a forms’ purpose should be placed over its’ aesthetic, and should never be disguised. However, it makes sense to style a form to the extent that it fits in with the websites’ overall appearance, - even if it’s a simple matter of applying a border color and background to it.

More importantly, thought should be given to an elements’ width, height, and placement among other form elements. Input boxes, text areas, radio buttons and drop down lists should be carefully positioned and labeled in such a way that a user flows from one to the other with ease. This is particularly important in long forms, such as on a registration page.

To take this concept even further, some of the really thoughtful designers have added a sprinkling of Javascript to achieve a highlight effect when the user clicks inside an input box or a text element. This greatly enhances the usability and flow of a form. Just look at this example from Gold Coast Web Design.

Typography

This seems like a given, but in reality, web designers as a whole have yet to match their print-brethren when it comes to typography. While most web designers pay attention to the “template” parts of a design, such as a header which appears on every page, many ignore typography on interior pages and content areas, which are perhaps the most important areas to consider for the user.

Look at the care that the designer(s) of one religious website took to ensure that articles where interesting, even inspiring to look at, and which complement the meaning of the words for their intended users. That, after all is what good typography is about—marrying letter forms to enhance the meaning of the copy.

image
image

By the way, if you’re wondering about how to technically implement some of the techniques used here, like drop caps and paragraph indentation, view this post for a web typography tutorial.

Lists

Like forms, lists are often ignored as an inherently ugly web element. And yet, when proper care is taken, a list, unordered or ordered, can break up a content-heavy page and ease the user.

Look at the lists on the Viget Inspire blog, and see how the designers patiently created icons, and background dividers in the footer to make the list of comment entries flow.
image
image

Layout variation in sub pages

As previously noted, most designers start with a home page and a sub page, usually consisting of a side bar and content pane, with long copy flowed in place. The downfall of ending it here is that depending on a websites’ content, a simple two column approach may not make sense, or even if it doesn’t, the content may need further styling.

Look at Trale and Poccuo. In each of these two example, the designer has taken care to lay out the content on a case-by-case basis, enhancing the presentation of it dramatically.

image
image
image
image
image

Animation

This is may seem like a dirty word to some when it comes to the web. Keep in mind, I’m not talking about Flash intros, or photos in a masthead that fade into each other. I mean animation that actually contributes to the usability and flow of a website, and yet can still function without it.

Two examples I have are Merix Studio and Alex Buga. Notice in the first example, clicking on “Sitemap” slides the menu and the rest of the site down with an eased animation. The same content could have been showed by simply loading a new page. But isn’t this way more fluid and interesting? In the Alex Buga site, you can drag the light, which makes for a nice easter egg.

Process

This is the main point—It can be a real challenge to get your site looking as good when it’s launched as it first did in your finished Photoshop comp.

Many times what happens in the life cycle of a web project is this: the designer creates comps (in Photoshop or Fireworks) and delivers screen-shots to clients for approval. For most straight-forward sites, this is a home page and a sub page option. Then once the client approves the overall template, the designer either hands off the files to a developer, or in some cases, hand-codes the HTML/CSS templates. From there the developer plugs in the back-end with the provided template files.

A crucial component which often gets left out is content implementation. The worst thing you can have happen is send the developer static site copy, and/or get the clients or an in-house editor to write content in the CMS, while the lazy or overworked (or both) designer dusts his hands off and moves on the next project. This is the death of your website. An entire phase should be allocated to having the designer go in and massage copy and images, and to really take the time to get everything outside the template shining. I’m going to go out on a limb and say this: Designing the interface and getting valid XHTML/CSS templates to the back-end developer is half of your design work. The other half should be spent implementing content and photos, massaging the layout, and adding in little touches to lists, paragraphs, forms and javascript touches.

I’m sure some will disagree with me, but I firmly believe is the secret to producing not just passable websites that clients and bosses are happy with, but truly magnificent interactive design.

Previous Page  Next Page