That was pretty much my mindset when I first found out about Brennan Dunn’s book. I was pretty sure whatever advice was in there didn’t apply to me.

Yet as time went back, I kept seeing Brennan’s name pop up again and again on Hacker News and in podcasts. So I decided to dig a little deeper to see what Brennan was all about. I don’t regret giving him a second chance. I soon realized that behind a slightly gimmicky tagline laid a foundation of very solid career advice for freelancers.

So I asked Brennan to share his advice with me, especially for freelance designers, and the result is this podcast. In part 1, we’ll cover:

• What Brennan’s book is about
• The difference between freelancers and pigs
• Value-based pricing, and how it applies to working with startups
• Why we’re secretly ashamed of charging more (and what to do about it)

By the way, if you want to get Brennan’s book, use coupon FOLYO for an extra 10% discount!

The transcript follows, and you can also discuss the podcast here in the comments or over at Hacker News.

Note: I left some of the startup names misspellings in the transcript, because I thought they were cute!

Introduction

Brennan: Why don’t we introduce ourselves first? So, do you want to start?

Sacha: Yeah, go ahead. Go ahead.

Brennan: OK. My name is Brennan Dunn. Done a lot of things. For the last five years, I’ve been either freelancing or running a consultancy. My consultancy’s name is We Are Titans. We’re based in Virginia. For the last almost year, I’ve had a product called Planscope out, which is a project-management tool for freelance developers and designers.

We Are Titans

And most recently, I launched a book called “Double Your Freelancing Rates.” I launched that, actually, I think, exactly a month ago. So far, it’s been great. The reception has been great, monetarily and in feedback. It just crossed over 300 sales, and I’ve received, actually, I think, about two dozen emails so far from people saying either it changed the way they think about their role as a freelancer, or they actually have raised their rates and already are making more money than they were before reading the book.

So I guess my goal now is to try to figure out how I can take the experience I’ve built up having consulted for so long and try to give back as much as I can to either freelancers who might just be starting out or are struggling and want to get to that next plane but don’t know how to get there.

Sacha: So, when you say you’re a freelancer, you are a Ruby developer?

Brennan: Yeah. So I do, actually, a few things. My core competency would be Ruby on Rails, although I do do a bit of design. Before I got into programming, I almost went to art school for graphic design.

I ended up realizing that I am technically good at mimicking other people and not a very great of coming up with new ideas. So I ended up more into development which is a nice being able to play for both sides because you know for since with my product and book I didn’t need to find a designer to work with it. I did it all myself.

Sacha: It’s funny because I am actually the opposite I started out as a developer and found out I like design more and I was better at design…

Brennan: I can understand that. I actually like design more, too. I just tend to do a lot more development recently. Although actually recently I have been doing more writing a lot of blog posts with the book and everything else which I think I actually like writing better than I do developing or designing.

Sacha: Well, it’s really funny because I started as a developer then became a designer for freelancing and then once I started launching my own products. I also ended up doing lot of coding and now I am also mostly writing on my blog and on Folyo’s blog. So it’s very similar.

Brennan: It’s the inevitable path we all take I think.

Sacha: Right, Everybody ends up as a writer.

Brennan: Exactly exactly.

Planscope

Sacha: So let me just introduce myself real quick. I’m Sacha Greif and I am mostly a designer, and I have been a freelance designer for the past four years. My specialty is UI design, so I’m worked with companies like Hipmunk, RubyMotion and Sharypic, mostly doing web apps, mobile apps, that kind of stuff.

Now I’m also transitioning into focusing more on my own products, the main one being Folyo, which is a site that helps startups find freelance designers. You’re going to think I’m copying you, but I also have an e-book about design which I’m also selling.

Brennan: Yeah, it’s actually funny. I’m friends with Jarrod Drysdale, who I know you and him had a bit of a spat online about pricing. I think you both released on the same day, right?

Sacha: Yeah, we did.

Brennan: Yeah. I’ve read actually both your books.

Sacha: Oh, cool.

Brennan: They’re both fantastic books, so kudos on your book. I know Jared lists on your book too.

Sacha: They’re very different books. He spent much longer writing his book and it’s much more complex and denser. Mine is really a quick, quick read, that you can read and process in 20 minutes, so I think they’re two different books for different targets.

Brennan: I think yours had a different aim, too. If I remember correctly, you wanted it really to be a way to propel your personal brand, to get more exposure and everything else. It’s funny how when you produce information, that tends to be the side effect, right?

Sacha: Right.

Brennan: If you are prolifically producing other blog material or e-books or downloadable content, whatever, that’s probably… we all look to people like Jason Fried or someone and we’re like, “How did you get so popular?” Really if you look back, with Signal vs. Noise and everything else, he’s produced so much stuff.

Sacha: Oh, yeah, definitely.

Brennan: Output is key.

Sacha: Let’s try to keep the focus on freelancing for now.

Brennan: Absolutely.

Sacha: Maybe we can come back to e-books and products later on.

Brennan: OK.

Sacha: Maybe you should just introduce your book real quick, like what’s the main topic.

Double Your Freelancing Rates

Brennan: Sure. My book has a very marketing friendly title. It’s called “Double Your Freelancing Rates”, which you inevitably read that and you want to do that. Really at the core of it though is, it’s a book that helps freelancers.

Most of us when we started out were, lets say, maybe, designers who worked for somebody so we were probably salaried employees at some point until we went out on our own.

What I found is that the majority of us when determining how much we price ourselves, we tended to look backwards, thinking, “OK, I made x amount of dollars on my day job so in order to maintain the standard of living that I had before, I need to charge this,” or they’ll go to some sort of calculator or they’ll go to AIGA.

Any of these different kinds of outlets and try to come up with a market rate or something like that and really what that is, is commodity pricing.

You can go to the stock market and they’re trading corn, oil, pigs and all of these different commodities and there is a market rate for oil and there’s a market rate for corn. The majority of us take that same approach when pricing our services, what I’m arguing is that it doesn’t need to be that way.

Don’t be corn

You can tangibly convince and deliver to a business owner who hires you, a product that produces a positive return on investment for the purchaser. In service when a client hires us, if we can convince them and also deliver work that ends up benefiting their bottom lines then we can charge a lot more than we are charging now, especially if the work we’re doing boosts their profit exponentially.

My goal is to help people understand that, you don’t need to look around at market rates. What you can is, you can look at yourself and your client and think, “what can I do for this client that will make them a lot more money and therefore, how can I price accordingly based on the surpluses of success that I’m now bringing this client.”

There’s a lot of actual material things like, ‘How to redo your personal sales website’ a lot of people talk about how much they love snowboarding and all of these different things. A lot of this clicked for me when I started a consultancy and I was kind of a bridge between developers and designers that I hired and clients.

If I’m a client and I want to hire a designer, do I want to read things about them? Or, do I want to read things that they’re telling me that they can do for me?

The fact is, when you’re going to hire somebody, there is a selfish motivation; you want to hire Sacha because you believe that Sacha will end up bringing you in more money than you’re going to spend on him. The core of the book is really, how to bake that into your freelancing business.

Sacha: Just to clarify, when you’re talking about freelancing it could be a developer, a designer, it’s not specific to one kind of work, right?

Brennan: No, we’re all doing the same thing in the end, we are all being hired to produce some sort of business value for the client. It’s kind of like, if you think of a company building a house.

You have carpenters, masons, all the different people that go into building that house but it all has one angle. I don’t care if you’re a copywriter, a designer, a developer, an SEO specialist, at the end of the day we’re all being hired for the same reasons.

Valuing Design

Sacha: Folyo focuses on design and one thing I’ve always wondered about value based pricing and that kind of philosophy is, how do you quantify the value that the designer will bring to a project or company?

Brennan: That can be tricky because design in subjective, right?

Sacha: Yeah.

Brennan: I mean it’s either, you like the blue or you don’t like the blue. Though I think that you can quantitatively kind of report on the work that you’ve done. The way you would do that is, let’s say you’ve been hired by a restaurant and the restaurant previously had a website that was flash based.

It really wasn’t effective from the perspective of the customer, the restaurant owner. The way you would quantify that is you would determine, how many new customers does your website bring that business in the door?

It’s hard because, unlike if you’re selling an eBook, it’s hard to quantify. But what you can do is you can do things like, you can talk to your customer and say, “Before, because you had a fully Flash-based website, if I’m driving around and I’m hungry for sushi and I pull up your website, I’m going to see a blank page on my iPhone because…”

Sacha: Yeah.

Brennan: “…the iPhone doesn’t support Flash. Therefore, you had a failure of design previously. What I’m going to do is, I’m going to understand that somebody on the road who’s hungry for sushi is going to care about two things probably. They’re going to care hours of operation, directions, and maybe their menu.”

What you can tell the business owner is, “I’m going to optimize for the business need.” The experience for somebody at home on a laptop or a desktop is going to be different than it would be for a mobile device. You explain why, and you explain… you go beyond, let’s figure out if we want blue or black or green or red. You start looking at, what can I deliver to this client that I can back up? Because it’s going to be all hypothetical before you’re hired.

Sacha: Yeah.

Brennan: You can’t say, “I’ve increased your sales by 182 percent,” because you haven’t done anything yet. But you can put together a roadmap that says, you can identify the business failures of their current website.

Truthfully, if a designer can study up on human psychology and read books like “Don’t Make Me Think“, you’re automatically going to be on a higher echelon than the majority of your peers.

Don’t Make Me Think

Because understanding the way that humans interact and use websites or software or whatever else, and applying that in a way that will be laser-focused at increasing the revenue of the client who hired us. If you can do that, and you can make a convincing case to a potential client, and speak language that they resonate with.

You speak in profit and costs and revenue and customers. That’s what people want to hear. They don’t want to hear about serif fonts or sans-serif. At the end of the day, the average customer is going to be more focused on wanting to know, and wanting to be certain of, that you’re going to deliver a product to them that is going to be more valuable than the amount of dollars that they’re going to spend on you.

Demonstrating Value to Startups

Sacha: Yeah. I think that makes a lot of sense. But also in my own experience, I’ve worked a lot with startups. One of the difficulties is that the problems startups are based on are not very well-defined yet. It makes estimating those things really hard sometimes.

Brennan: Especially a lot of start ups aren’t exactly profit driven too. That’s true. That can go into your positioning. What kind of client do you want? Granted if you have a venture backed start up their pockets tend to be pretty deep and with somebody else’s money.

It might even be easier sometimes to justify, especially if you can pull the whole, there’s more demand than supply type of situation with them. I think with any customer with any customer profile, you really just need to understand I think, what are they looking for? You’ve mentioned you’ve done work for Hipmunk right?

Sacha: Yeah.

Brennan: They’re competing against Campfire and Flowdock and other products like that.

Sacha: : They’re actually a travel website.

Hipmunk

Brennan: Oh no. I was thinking of Hipchat. I’m sorry. Hipmunk is competing against Kayak. I’m sorry. Start up mix up! By the way their product is beautiful so whatever you had to do with that kudos.

With the start ups, and I actually think I mentioned this in the book, I’m like a small business or a profitable business who wants to invest money to make a positive return.

With start ups it’s all about… really and I hate saying this, glitz and glam, right? They want to be what Techcrunch wants to cover. They want to be something that people want to show off to their friends. I’ve showed so many people I think the Aerobian Bee [Sacha's note: Brennan actually says "AirBnB" here but I'm leaving it as it was transcribed because I just find it so funny] iPhone app because of how well I think it is.

Sacha: I don’t think I agree with that though. I’ll let you finish but I want to get back to that.

Brennan: I used to do some work out of San Francisco but recently I’ve actually made the decision I only want to work with companies that are currently profitable and help them make more profit. I might be out of touch with some of the needs of the modern day start up.

Earning More And Working Less

Sacha: Right so I think what that points to is that who you are working with is very important too, right?

Brennan: Absolutely.

Sacha: Lets come back to the book title, “Double Your Freelancing Rate”. Increasing your own rate is one part but I think choosing who to work with and selecting the right kinds of clients for your own goals is very important too.

Brennan: Right. I mean if your goals are financial you can probably build a simple web form for a Fortune 500 and if you tell them, hey by using this we will be able to cut two positions because it saves that much manual processes therefore I’m going to charge you this. They might gladly pay that because to them it’s that return they’d be getting from that is huge.

If your goals are financial you might not want to always be looking at a start up as client. The people that I’m attracting for the book I think are… I don’t want to say lifestyle designers and developers but people who would rather not work as much or focus on other things

Sacha: I think that that’s a lot of people.

Brennan: Oh, that’s me. I couldn’t have written a book and built Planscope if I was doing full-time freelancing. I really had to be my own investor by charging more, working less and then maintaining the same… really what the end result was, my income didn’t change, but I had more time that I could dedicate to other things.

Sacha: I think that’s an important point to make, is that you’re not just earning more but also maybe earning the same and working less.

Brennan: Exactly, exactly. That’s something that… we all have the same amount of time, and the more time that you can spend. Especially, I have two kids and I want to spend a lot of time with them, and that’s where it becomes a lifestyle issue.

One of the perks of charging more for your time is you can… let’s say you’re making $100 an hour and you’re working full-time. If you charge $200 an hour, you can now work 20 hours a week and get the same. Nothing changes in your lifestyle.

Sacha: That’s actually what I’ve done. I’ve been increasing my rates for the past four years and I’ve also been working less and less for clients. I think I’m probably actually earning less now than I was before, overall I mean, but that gives me a lot of time to spend on my own projects and I’m much happier than before.

Being Ashamed of Charging More

Brennan: When you went about raising your rates, did you use your… you’ve got some pretty impressive things in your portfolio. Has that been the main driving force behind charging more?

Sacha: Yeah. I guess this and also the jobs, getting more experience. A little bit more about me, I don’t have a design background, I never went to design school, so I think I suffer from impostor syndrome, you know?

I think a lot of people, especially in our industry since a lot of us are self-taught, we’re like, “Oh, no, I can’t charge that much because I’m not a real designer or I’m not a real developer, I don’t have the plaque on my wall or the diploma.” I think that’s been a problem for me and it took me a couple of years to overcome that.

Right now my rate is REDACTED [Sacha's note: Patrick McKenzie has convinced me not to talk about my rates publicly anymore. If you really want to find out, listen to the audio version!] an hour if I took on any freelancing projects, which I haven’t for the past six months, but that’s my current rate. I think I could probably charge more, but I still have something holding me back. I can really relate to what you talk about in your book. What people talk about on Hacker News, too. All that about being afraid to charge more. Even sometimes a little bit ashamed to charge more.

Brennan: There’s definitely a distinction, right. There’s a distinction of what you just said about being ashamed. Where, really what you’re saying there is, how on Earth is what I’m doing worth that?

Sacha: Yeah.

Brennan: I think the answer to that is –I don’t mean this in a bad way– what that is, is that’s a selfish reflection of your rates. Really, what I mean by that is that you’re looking at yourself. You’re looking at your capacity.

What you’re taking out of that equation is how much –I don’t know Head monks’ [Sacha's note: Brennan says "Hipmunk" here but "Head monks" does sound much cooler] profit model– but how much benefit whether financial, or exposure wise have you delivered to them? I think we, as a whole, we need to look more at: what am I really doing for my clients?

Sacha: Yeah.

Brennan: How am I benefiting them? Then, I think that, of being ashamed of what you’re charging completely dissipates. Because let’s say I work for a week. I’m charging $100 an hour.

If I charge somebody $4,000, the value, the life time value of the project that I just worked on could end up netting this company $100,000. Should you feel bad that they spend $4,000 to make $100,000?

Sacha: Yeah, of course not.

Brennan: That’s where… I think, I think what we tend to do is that we miss really the most important part of the equation. Which is the result of the work we’re doing.

Sacha: Yeah. Yeah, I think it’s interesting because it’s not so much like charge more as change the way you think about charging. Change the way you think about valuing your work.

Brennan: That’s exactly it. I mean, I use Harvest for invoicing. I could go in Harvest right now, click on a textfield, and modify my rate. Anyone can do that.

Harvest

Sacha: Yeah.

Brennan: Anyone can do that. Will the client pay? I don’t know. But there needs to be, you’re exactly right, It’s a philosophy change. It’s a change in your world view. Your positioning. The way that you present yourself. That’s really what, what I’m trying to get at. Is it’s not about the number.

Being More Than A Freelancer

Brennan: It’s not how many dollars, or yen, or euros an hour we’re charging people, that’s not it. What we’re getting at is something that benefits both parties. Benefits you and benefits them.

Benefits you because you, probably going to have a better client first of all because you are going to be more in line with what they are looking for.

Me as a client, I’ve dealt with designers who have been so focused on things like, I don’t mean this in a bad way, but things that are academically right. We all like to make fun of, say, “make the logo bigger“.

While that’s justifiably valid, a lot of designers’ reaction would be more on the academic side, saying “you just can’t at all, it’s not the right thing to do”.

If you can go to your client after they say that and tell them “well the problem with that is it would push the other content lower down the page which could make it so people are now more likely to immediately click back because they are not going to see what you have offered them”.

Present to them a rational business-focused case about why you should or should not do something.

That is something that, considering I have worked with probably half a dozen designers now, it’s so rare for me to find somebody who understands that, I am paying them a lot of money and I am not paying money just to spend it. I don’t enjoy writing cheques.

I am hoping that something positive, and by positive I mean the investment I’m spending is going to bring back more than I am spending, so that is really kind of the gist of what I am trying to get at, is that we need those kind of repositionment. We don’t need to learn new skills, it’s not about that. It’s about reworking internally what we’re thinking in our heads and also what we are presenting to our potential clients and their clients.

Next Week: Part 2

Let’s stop here for now, but stay tuned for the conclusion of our podcast next week. Here’s a preview of the things we’ll cover:

• Why how much you charge influences how people percieve you
• Brennan’s message to freelancers in India, Pakistan, or China
• What I think of 99Designs
• How to avoid being commoditized (remember, you’re not corn!)
• If speculative redesigns are a good idea
• Brennan’s networking tips
• A comparison of our approaches to billing clients
• What to focus on when designing your portfolio

In the meantime let us know what you thought of part 1 here in the comments, or over at Hacker News.

But setting morals and ethics aside for a moment, you can’t ignore the appeal of 99Designs’ promise of cheap, good-enough design. So I thought it would be interesting to explore the different options out there when it comes to design that doesn’t break the bank.

Here’s a quick summary:

• $0: Use a free framework and UI freebies
• $0-$100: Get a pre-made theme and nice typeface
• $100-$500: Consider crowdsourcing
• $500-$1000: Crowdsourcing or freelancers?
• $1000-$10000: Get a good designer
• $10000+: Agencies

Read on to get a more detailed overview.

$0

First of all, when it comes to design you can get a lot done for free. Frameworks like Bootstrap and Foundation give you a good base to start off and will take care of basic typography and layout choices for you.

The Foundation framework by Zurb

Designers also often share UI elements as freebies, and if you know where to look you can even find some that are already coded. Of course, as usual with freebies you’ll have to pay attention to the license.

I suggest getting in touch with the creator before you use something commercially, but in my experience designers are generally happy to see their work put to use.

UICloud’s UI elements search

$0-$100

If you can invest even just a hundred bucks, a lot more options open up.

First of all, you now have access to sites like Themeforest or Woothemes, which are an amazing resources of pre-made templates for about $50.

Themeforest’s many themes and templates

And don’t think those sites are just for WordPress themes. Themeforest has a huge collection of admin templates that are perfect for skinning a web app.

What if you need a logo, too? You won’t be able to get somebody to create a logo for you for less than $100, but that doesn’t mean you’re out of options.

If you’re ok with a text-only logo, you can simply make it yourself. Path is a classic example of a startup whose logo is simply its name set in a nice font (in this case, Coquette).

Cost of that logo: $29

Sites like MyFonts are a great source of professional fonts, and they let you preview a collection of faces using your own custom text. And buying just one font variant usually costs less than $50.

And if you need a visual logo, sites like GraphicRiver and iStockPhoto are also good sources of potential logo material. Sure, those are stock art sites, meaning you won’t have the exclusive use of your logo. But for cases where you’re just looking to get a landing page out the door, does it really matter?

Note: It turns out using iStockPhoto art as a logo is explicitly forbidden by their terms of service. Although to me, it’s debatable what constitues a “logo” or not. For example, what about using artwork to accompany a wordmark on a single landing page?

$100-$500

If you’re ready to invest a little more (yet don’t want to break the bank), that’s where sites like 99Designs come in.

Now although as a designer I personally don’t like speculative work and the commoditization of design work, even I have to admit that if you only have $500, 99Designs might be your best bet.

99Designs give you multiple options

For that budget it’s going to be hard to get a good designer to work on your project anyway. So at least with 99Designs, you’ll have multiple options out of which you can pick the least bad.

And if you’re not sure what you want, the sheer number of different submissions you’ll receive can also be an asset. In fact, a common strategy is using 99Designs as a kind of crowdsourced moodboard to help you narrow down a concept, before hiring a more experienced designer to create the final version.

BrandCrowd: part crowdsourcing, part stock art

Then again, 99Designs is not the only option in that range. For example, BrandCrowd lets you buy pre-made logos that are generally of a much higher quality than what 99Designs can offer.

Note: speaking of 99Designs and cheap logos, watch out for designers who use stock artwork and pass it as their own. Here’s a great example straight from the Hacker News comment thread for this very article.

$500-$1000

This is the tricky gray area. Should you still use crowdsourcing services, or make the jump to hiring a freelancer?

Of course it all depends on what kind of job you need done: branding, web design, interaction design…?

While you can get a good logo for under $1000 (and Folyo can help you with that), that budget is probably a little short for a full site. So you can go with a hybrid approach, using Bootstrap or a pre-made template for your site but with a custom-made logo.

That being said, my personal philosophy is to either go with something really cheap, or really expensive, but avoid the mediocre middle ground that’s neither cheap nor great. So you might also want to simply wait until you can afford to spend a little more to reach that next level of design talent.

$1000-$10000

You can hire good designers on a freelance basis for anywhere between $1000 and $10000 depending on the amount of work, and that’s the budget range where Folyo excels.

Folyo is great at finding good freelance designers

Compared to 99Designs, there are many benefits to hiring a designer on a one-on-one basis. Not only will you (usually) get better quality work, but the designer will also care about your product.

One of the most valuable thing you can get out of a designer is a fresh point of view and new insights into your product and business, and that can only happen with long-term relationships.

$10000+

This is the domain of big-budget agencies. If you’re reading this, you probably don’t want to go there, at least not until you’ve got a couple rounds of funding safely in the bank.

Compared to hiring a single freelancer, the main difference is that agencies can throw more people at the problem, leading to more point of views and (maybe) better solutions.

But I personally don’t have enough experience dealing with agencies to say if their services are really worth the expense. In any case, most of the startups I know prefer dealing directly with individual designers rather than going through agencies.

Conclusion

As we’ve seen, there’s a lot that can be done for very, very cheap, or even free. There’s also a lot of options available when you have a sizeable budget.

Where startups often struggle is in that ambiguous middle ground. Crowdsourcing services might seem like an attractive option, but remember that they’re not without risks, and sometimes the best choice is just saving up a little more.

Now I want to hear back from you. What is your design budget like? Have you used any of the options mentioned here? Let me know in the comments or over at Hacker News.

And by the way, if you’d like to learn more about average budgets for various jobs, check out these freelance design pricing survey results.

On the other hand, if you’re looking for higher quality work, Scoutzie is targeting the same market as Folyo and seems to be doing well too.

But keep climbing up and increasing project scopes and budgets, and you’ll find GroupTalent.

As it names indicates, GroupTalent is all about assembling teams of highly qualified designers and developers to take on challenges that would be too much for a single person.

I recently got together with GroupTalent co-founder Andrew Kinzer to compare our approaches and get a few tips for startups looking to hire designers.

In this great interview, Andrew shares his perspective on:

• What makes GroupTalent so special
• How they decide which designers to accept
• Why companies pick one designer over another
• Why you should stop looking for “unicorns”
• Why there’s a designer shortage, and what to do about it

Note: it might seem weird to you that I’m highlighting a direct competitor on Folyo’s blog. But even though we might compete for the same market, the real “competitor” is simply the fact that most people are not aware that sites like Folyo or GroupTalent even exist.

So rather than fight among ourselves, I would rather try to make the pie bigger for everybody.

Introduction

Can you introduce GroupTalent?

Absolutely! GroupTalent is a service we’ve been building for the last year that makes it really easy to find and work with developers and designers to build software (applications). That really means anything from Web applications, to Android and iPhone, and even desktop software.

Like Folyo or GitHub, we have a gigantic pool of designers and developers to pull from – but the service we provide is significantly different because we’ve focused well beyond that initial piece onto the next series of critical steps.

All of the normal work a client would have to do just to get started – sifting through talent for folks relevant to their app, trying to figure out who’s available when, managing proposals, coordinating legal documents and structuring payments – is streamlined by our service.

I wish Folyo had a cool intro video too…

We’ve deliberately focused on making it easy for clients to gain perspective on their options, and make good decisions with a small amount of effort.

Part of achieving this about being exceptional at keeping track of who is good at what, which we do through our profiles, our admission process, and a little behind the scenes magic.

The other part is about bringing transparency to the process so it’s a lot easier for clients to feel confident that their app is going to be built by somebody who really knows what they are doing.

The budgets we deal with are typically in the range of $5,000 to $80,000 (some much higher), and our customers understand how critical it is to make the right decision is when you’re spending significant time and money to produce an important piece of software.

Picking the Right Talent

What criteria would you look for to evaluate if a designer is a good match for being part of GroupTalent? And how do you match them up with the right projects?

Ah, yeah I’m glad you asked those together because they are intimately linked.

We realized early on that just because somebody is amazing at something like web application design, doesn’t mean they know their way around mobile design just yet. Or, just because they know mobile design doesn’t mean they are efficient or skilled at creating marketing pages.

Our clients depend on us making good suggestions, so a good deal of our platform is the stuff behind the scenes that allows us to evaluate and categorize developers and designers for different types of work.

GroupTalent profiles

The central piece that lets us do that is actually directly in the designer or developer’s control: their profile. We’ve designed these to contain specific information that helps us (and clients) understand what they have done in the past as evidence of what they’re good at.

The second piece is something we call “marketplaces” which lets anybody apply to receive a category of software projects. If you want to have access to a particular marketplace, you need to make sure you show examples of work you did there on your profile.

We’ve got a great back-end tool that lets us manually review each profile to determine whether or not a designer or developer has tackled the challenges inherent in the projects you’d receive from a specific marketplace.

We know conclusively that if we can’t see the evidence they can perform on a type of project, the client won’t be able to see it either, and isn’t going to risk their time or project budget to find out. That’s how we think about whether or not to let somebody in.

The Client’s Choice

How do clients make decisions on who to hire?

Clients have tons of criteria, and the key points are the usual suspects: location (if that’s important), price vs quality trade-off, when the project needs to start and finish by and many others. By far the biggest piece is whether or not the person they’re looking at already knows how to do the thing they need.

That sounds simple, but I’m not talking about somebody who is broadly skilled in UX, or in UI. Nobody is looking for something as broad as that.

Clients (both technical and nontechnical) come forward saying things like, “I need somebody who has designed the interface for a consumer marketplace with a female demographic” or “I need somebody who has done gesture controlled data visualization interfaces” or “I need somebody who can make me new marketing pages that have the same aesthetic as website X”.

[Sacha's note] This is interesting, because a recurring debate among designer is whether you should develop a specific style/focus or not. The argument against this is that truly good designers should be able to adapt to any situation.

But although that sounds nice in theory, Andrew’s comment show that clients feel it’s safer to hire someone who’s already done the type of work they need, and I have to say I tend to agree.

At that point, clients are looking for something extremely specific and unless they can see the work, no amount of talking on a phone will convince them. The reason we have such high conversion, even when being pitted against larger agencies, is because we’re really good at showing them the best options based on what they need.

Hunting Unicorns

A lot of companies are looking for designers than can do it all: interaction design, visual design, and even front-end coding. Is this a good idea, or does it restrict the field too much?

Ah yes, the so called “unicorns”. I think that from a talent perspective, as well as an employer’s perspective, more versatility is always a good thing.

The question is whether or not as a company you can actually get it. I have this feeling that a lot of people are chasing something they don’t actually need rather than making headway with what they can get and focusing on what’s important.

The “talent” part of GroupTalent really is appropriate

Typically what I see is that everybody says at the outset that this is the person they need, and within a few months realize they’re having a hard enough time finding designers who are even decent at one out of the three – and that’s when they realize how dang special it is just to find a person who is exceptional at one or two things.

At that point, they think a little harder about what their team is already good at, and what they really need help with, and then they start a more realistic journey finding that person.

Don’t forget that your team will make or break you, so you better find folks who are more than just average at whatever you’re paying them to do. They had better be awesome at it, even if it means their range isn’t as broad.

The Great Designer Shortage of 2012

Something you hear a lot (at least in Silicon Valley) is that good designers are very hard to find (even harder than good engineers, it would seem). Have you noticed this too, or do you think people are just not looking in the right places?

I totally agree they are harder to find than engineers. I think it has a lot to do with how long it took schools to stop focusing on print design with posters and logos, and start focusing on teaching what the industry really needed.

If you’re trying to hire full time, you’re going to have to steal somebody from another company by being the brightest bird in the forest, or you’re going to have to find somebody young with aptitude, and teach them how to be great.

I don’t think there’s a magic source of designers that hasn’t been discovered yet. Dribbble is certainly a popular fishing hole, but it’s also suboptimal as a resource because the form factor has attracted far more visual designers and illustrators than skilled interaction designers. In my experience, it’s the latter who is in the greatest demand.

[Sacha's note] Again, I have to agree. The single most common demand I get is for designers who get the big picture of how a product works, and are more than just pixel-pushers.

Of course, there’s value in crafting beautiful icons too, but interaction and product design skills are just much more in demand lately. 

At the end of the day, if you’re asking somebody to quit their job and work for you, you’re asking them to choose between what they’re doing now and making a significant change.

I think the new source of talent we’ll be seeing more of is what’s called “fractional use” of somebody’s time. That’s just a fancy way of saying that somebody can have their full time job at Airbnb but mix things up on the weekend by designing a simple iPhone app for a nonprofit in the midwest.

Or they can freelance for 3 or 4 days a week, and travel the rest. That can only happen with efficiency in the market, and that’s what we’re working hard to bring to bear right now.

[Sacha's note] I’ve noticed the exact same thing with Folyo designers. A lot of them keep on freelancing even though they hold day jobs, just for the fun of it (and the extra income doesn’t hurt either!). 

Maybe this means companies should start hiring designers part-time, to leave them more time for their own side projects?

Conclusion

Startups keep asking me where to find designers, and how to pick them. I usually point people to Folyo, but GroupTalent is another great option for larger scale projects, especially if you need a whole team and not just a designer.

And if you’re a designer, you should definitely check them out…

…as long as you stay on Folyo as well, of course!

Note: you can also upvote/comment over at Hacker News

And what do you know, this week we take a look at another stellar redesign by Paddy, the FamilyLeaf homepage. We’ll be joined by Ajay Mehta of FamilyLeaf.

Introduction

First of all, can you briefly introduce what FamilyLeaf does?

FamilyLeaf is a private network for your spread-out family to keep photos, conversations, and information in one secure place. We started working on this idea at YCombinator back in March, and our mission is to help families around the world stay in touch.

Although the internet has helped many of us connect better with friends, acquaintances, and work colleagues — it has done surprisingly little to bring us closer to some of the most important people in our lives: our family.

Preparatory sketches

Finding The Right Time For Design

For a startup, the question is not so much if design matters, but when it matters. A startup’s resources and time are limited, so finding the right priorities at any given time is vital.

You’ve launched a couple months ago, if I’m not mistaken. What made you decide it was time for a redesign? Launching a startup involves many moving pieces, so where does branding and design fit in in your company’s priorities?

You’re right — we launched our very early beta on TechCrunch right before Demo Day at the end of March. But in the months since then, we’ve really focused on improving the FamilyLeaf experience for our early users, and a big part of that was a visual and UI/UX upgrade.

Design is hugely important to a company like ours that has a wide audience (maybe unsurprisingly, many of our users don’t fit the typical young male techie stereotype). We constantly need to make FamilyLeaf as clear, easy-to-use, and delightful as we possibly can. It’s the highest priority.

The Elements of a Good Homepage

Paddy, once again (see the Perch redesign) you’ve created a richly illustrated homepage with dynamic typography and fresh colors. Do you think that this is becoming your “style”? Is there a point where having a personal style takes away from your ability to adapt to the job at hand?

Illustration is certainly something I’ve been incorporating into my web designs more and more, however I start each project from scratch with thorough wireframing and moodboarding sessions in order to create a design that’s right for my client and the end user.

A style is important to have, but it’s just as important to try out new things and push yourself out of your comfort zone.

Speaking of typography, how did you choose to use Cubano? Any other fonts you’d recommend or that you enjoy using right now?

We actually didn’t choose Cubano until later in the design process. Initially, we were experimenting with more scripty type, but readability was an issue and I wanted something with a lot more strength as we had kept the copy on the website pretty short.

It was important that the type still retained a friendly edge for the FamilyLeaf message, and Cubano had all these qualities. There are some fantastic type choices over at the Lost Type Co-op and I’m particularly keen to try out their Abraham Lincoln on a project.

Illustration detail

Another thing that struck me about the homepage is how clear and concise its message is. I counted, and there are less than 80 words on the page altogether (as a comparison, competitor Everyme has 140 words on their much shorter homepage).

How did this happen? Did you start out to keep it short from the start, or did it take many iterations to reach this point?

I can only speak for myself here, but I’ve never personally been a fan of overdone copy. You don’t need to write too much to convey the general message and emotions that we want our users to feel before clicking the “sign up” button.

We tried to convey our product’s story visually, and the words are few but hopefully high in impact.

Oftentimes copy can become a crutch to lean on when you have trouble crafting a clear message. Through the illustrations and design we wanted to create the atmosphere for FamilyLeaf, while reserving the copy to communicate the finer details of the product.

We made sure to keep it short, while still  getting the key messages across to the potential users.

Finding The Right Match

Folyo will put you in touch with about a dozen great designers, but the question remains of knowing which one to pick. Making it even harder in this particular case was the fact that Ajay’s posting received an unprecedented 27 replies!

Picking a designer is always tricky, especially for people who do not have a design background themselves. How did you decide to work with Paddy? What made you pick him rather than one of the other designers who applied for the job?

I learned something very early on in my search for designers: all designers worth picking have a certain, distinctive style. Design is a creative thing – if you enter with a preconceived notion of exactly what you want a page to look like, the process is likely to be exhausting, expensive, and frustrating.

We picked Paddy because the style of his previous projects – the “cute,” accesible nature of his illustrations – was exactly in line with what we wanted for FamilyLeaf.

Homepage detail

Conversely Paddy, what did you find interesting about this project? What did Ajay do right to make you want to work with him?

It was pleasing to see that FamilyLeaf was not just ‘another social network’. Aiming to unite families and make it easier to share updates was certainly something that sparked my interest, with the Tidbit weekly digest emails feature being something I could see myself using with my family.

After my first Skype chat with Ajay, I could clearly see his passion for his product and that’s an extremely encouraging factor when deciding to work with a client.

Closing Thoughts

Did you see an increase in the sign-up rate after the homepage? Did the redesign live up to your expectations and goals?

It’s too early to talk about sign-up rates! But I can certainly say that we’re very proud of the homepage we have now, and it’s a massive step up from what we had before. A beautiful, nice homepage can impact your company’s brand immeasurably.

What were your impressions of using Folyo? Would you recommend the service to other startups? Anything we could improve?

I was very pleasantly surprised by Folyo’s usefulness! It was recommended to me by one of the guys here, Henry Liu (he mentions that you had spoken to him very early on about the Folyo idea).

I posted a job not necessarily expecting much, but I ended up contacting 10+ solid-to-great designers (and definitely plan to stay in touch with some of them for the future). I would highly recommend Folyo to any startup looking for a designer.

Thanks to both Paddy and Ajay for answering my questions, and congratulations for building such a beautiful site!

Now don’t let the title fool you. The book is not about miracle remedies, and all about rethinking the way you envision your freelancing career and yourself. Anyway, you’ll learn more about all this when the interview is published.

That being said, one thing we talked about seems so important to me that I didn’t want to wait any longer to tell you about it.

In fact, if you’re a freelancer I think it might just be the single most important factor in deciding whether you get projects or not. And that factor is:

Trust.

When a client is hiring you, they want to know that you can be trusted. Trusted to deliver high-quality work, trusted to meet deadlines, and above all trusted not to take their money and run.

Once trust is there, the rest naturally falls into place. The first version of the project isn’t good enough? The client will trust that you’ll do better for the next one. Want to try a new, edgy look? The client will trust that you know what you’re doing. Missed a deadline? The client will trust that you had your reasons and did your best.

But when I look at designer portfolios (including my own), very few of them are optimized to show trustworthiness.

It’s even funny in a way: every single designer I know will obsess over what font, color scheme, and layout to use for his personal portfolio site, often scrapping multiple versions before pushing out something.

Yet if even one tenth of that time was spent thinking about showing clients can trust you, you’d probably get a lot more people contacting you.

So how do you communicate trust? Let’s take a look at a couple key elements.

Your Portfolio

Your portfolio itself is the first step, since it shows that other companies have trusted you in the past (and hopefully, that they were right to do so). Just don’t forget to put the company name forward.

Put the name of the client forward, not the type of work

Taking a look at Folyo designer Joanne Marie Panalingan‘s portfolio, you can see the work she did for various clients. Yet the slideshow is simply titled “Marketing Campaigns”, and the name of the clients doesn’t figure anywhere except in the screenshot itself.

This is a missed opportunity. By grouping your work by project type instead of by client, you’re making your site look more like a restaurant menu (“I’ll have the website with a side order of brand identity, please”) and less like a showcase of your skills and trustworthiness.

Fantasy Interactive features their client logos prominently

Testimonials

If your past clients were happy with your work, let them say so on your site.

I’ll tell you a secret right now: no client is going to say you made them a crappy logo, because that would be admitting their logo is crappy. So unless you were a complete jerk to work with, most clients will be happy to provide a glowing testimonial.

While browsing through designer portfolios, I found very few of them who featured client quotes prominently, and I think that’s a mistake.

On Mark Hendriks’ portfolio, a client quote is the first thing you see

Instead of using a vague generic tagline such as “I design beautiful and usable sites that blah blah blah”, wouldn’t it be much more powerful to display an actual quote from a satisfied customer?

Other Elements

What else would make somebody who doesn’t know you trust you? How about links to profiles on Twitter or Dribbble, to show that you’re a respectable member of the online design community?

Including your photo and a short bio can also make people feel like you can be trusted. And if you work primarily with local businesses, maybe a phone number and address would be a good idea too.

Rather than navigation links, Dev Gupta offers social networks

And if you want to go further, you can even display your rates right on your site so clients know they’ll pay the same price as everybody else.

Client Fears

Think back to the last time you had to pick between two pairs of shoes, order at the restaurant, or any similar situation when you had to make a choice. In those situations, we do our best to persuade ourselves we’re picking the right option, and we look to any clues we can to help us feel good about our decision.

Similarly, when a client is looking to hire a designer, they want to know that they made the right decision, and you need to help them see that.

Clients are afraid they’ll pick an incompetent designer, that you’ll be the wrong person for the job, or even that you’ll try to scam them. Make these fears go away, and you’ll probably get the job.

But Designer XYZ Doesn’t Do That!

Lastly, I want to warn you against taking inspiration from the sites of established designers. These designers have built a huge network over the years, and have job proposals dropping in their inboxes like clockwork. They couldn’t care less what their portfolio sites look like.

In fact, I’m willing to bet that more than a few well-known designers intentionally hide away their work in hopes of stemming the tide of unwanted client inquiries.

So realize that you and Jason Santa Maria or Frank Chimero probably have very different goals (unless you actually are Jason or Frank, in which case, wow… umm, would you like to join Folyo by any chance?).

In Conclusion

Designers are first and foremost problem solvers. So let me put it this way: if you want to land projects, the first problem you should be solving is not “how do I make my portfolio look beautiful”, but “how do I make myself look trustworthy”.

Note: you can also discuss this article over at Hacker News

Someone will typically point out that while most companies think of a “designer” as someone that makes things pretty (i.e. graphic design), the real value of design lies in improving how things work and creating a better user experience.

And that’s a fair point. But it might leave you wondering what kind of designer you actually need: a graphic designer, a user experience designer, or both?

This article is a little long, so let me first give you the “tl;dr”. I’m going to talk about:

• Why visual design is still important.
• Why you shouldn’t hire a one-trick pony.
• How to find out which designer your product needs.
• How your company’s lifecycle will impact your design requirements.

(Note: this article was inspired by this thread on Hacker News, related to this post on how to hire a designer)

The Value of “Eye Candy”

First of all, let’s get one thing out of the way: whether you call it graphic design, visual design, or eye candy, the way something looks is extremely important and has a huge impact on how people use it and react to it.

Custom Candy UI by Charlie (via Dribbble)

Sure, some companies manage to do just fine without giving it too much thought (a famous example being Craigslist). But you can also find companies that thrive despite poor customer service or bad security choices. It doesn’t mean it’s a good idea for you to copy their worst practices.

So yes, visual design is valuable. Of course, just how valuable it will be to you depends on the specifics of your company (read on to learn how). But don’t make the mistake of dismissing it out of hand.

Watch Out for One-Trick Ponies

The second point to keep in mind is that design is not rocket science. Not everybody can be Jony Ive, but it’s not impossible to become reasonably competent in both UX and visual design.

In fact, I even know quite a few technical people who became good at design by iterating and experimenting. One such example is Steve Huffman and Adam Goldstein, who came up with a lot of Hipmunk‘s original UI concepts despite not being designers themselves.

Hipmunk circa 2010: not designed by designers

What I’m driving at is that whether you hire a UX or graphic designer, the person you hire should have at least basic skills in the other field.

Not to say that all designers follow this precept. It’s sadly still common to come across UX designers whose portfolios are filled with sites straight out of the 90s, or visual designers who never consider what will happen to their creations once they leave Photoshop.

But I would advise against hiring someone like this. Not because they won’t be good at their job (they might still be experts in their own domain after all), but because to me, it shows a lack of curiosity and willingness to push yourself.

(Note: of course, this applies mostly to web and user interface design, not things like logo design, illustration, etc.)

Choosing the Right Person

Now let’s say that you’re considering two applicants:

• Alice is a great visual designer who also has a good grasp of interaction design and how her work will affect the user’s experience.
• Brian specializes in user experience and interaction design, but is more than capable of producing simple visually pleasing designs.

So who should you hire? Well, it all depends on a couple factors.

Your Product

Different products have different needs and will require different profiles.

Let’s picture two different scenarios. Product A is a new iPad app that helps pharmaceutical companies organize trials and keep track of their results.

Product B is a new social photo-sharing iPhone app similar to Instagram, but for people who want to share photos of their pets.

Product A seems very complex and specialized, yet its end users will not always be that tech-savvy, and they might also not be used to touchscreen interactions. On the other hand since this is for the enterprise market, branding is less important and people will have much lower expectations when it comes to visual design.

Product B is “yet another photo-sharing app”, so it will require great branding and graphic design to make it stand apart from the competition. On the other hand, since it will follow interaction patterns established by other apps (and by Apple itself in its iOS guidelines) it probably doesn’t need to reinvent the wheel when it comes to user experience design.

Photo Album UI crafted by Cuberto on Dribbble

I hope it’s clear from these examples which company should hire a UX designer and which one should hire a graphic designer.

Of course, these examples are not absolutes (for example, maybe you need great visual design to impress the manager in charge of buying Product A), but they show how a product’s goals and market will influence who to hire.

The Right Person at the Right Time

The current phase of your product development is also something to take into consideration.

The goal of the first version of your product should be verifying that people actually want it. Unless you’re targeting very specific audiences (such as the tech or design crowds) you probably don’t need to focus too much on visual design at that point.

On the other hand, bad interaction design at that stage can hurt your conversion rate, or even prevent people from ever finding out how to use your product. So bringing in a UX designer at this point might save you a lot of headaches in the long run.

Once you’ve established that your product is solving an actual need, it’s time to give it a voice, a personality, and a brand. That’s where the visual designer comes in.

FamilyLeaf just redesigned their site 6 months after first launching

By that point, you should also have a good picture yourself of what works (and what doesn’t) in terms of your product’s user experience, and you should be able to guide the designer in the right direction.

Once your product redesign is done and launched, it might be a good idea to get a UX designer’s feedback from time to time, especially before launching new features.

So to grossly simplify, a hypothetical startup’s design timeline might look something like this:

• Months 0-6: come up with a prototype and hire a UX designer to refine its interactions.
• Months 6-12: work with a visual designer to refine the look and feel of the app in preparation for its “real” launch.
• Months 12-18: keep iterating on the UX while hiring a UX designer for short consulting missions from time to time.
• Months 18-24: hire a visual designer to redesign the app for version 2, while applying all the things you learned from the past 18 months.

Conclusion

As you can see, there is no single good answer to the question of which type of designer to hire. It depends on many factors, most of which will generally be specific to your company and product.

But if you’re considering hiring a designer, one simple thing you can do is simply ask them if they think your product needs their skills at this specific time. Contrarily to what you might think, they won’t automatically answer “yes”.

After all, there is nothing wrong for a designer than to pour his heart out in a project, only to see his work scrapped when it turns out the underlying concept is flawed. So a good designer will tell you if it’s too early to focus on visual design, or on the other hand if your interactions are just fine and it’s now time to think about your brand.

And by the way, if you happen to find the magical unicorn who’s great at both interaction and visual design, hire them right away!

Just don’t ask them to code. That’s a whole other debate…

Note: you can join the discussion over at Hacker News

In this week’s case study we take a look at the design of Awessome with Founder Akshay Arabolu and designer Chris Gillis.

Introduction

Can you briefly introduce the site and what it does?

Imagine an app where all the recommendations your network has ever made (or ever will make) are stored. That’s what Awessome is.

We all make recommendations all the time. We do this over email, text, twitter, fb etc. All this valuable information is lost to cyberspace. Awessome was built to save all this valuable information in one place. This way, the next time you want a recommendation all you would do is check the app. No more spending time searching on Google and sifting through a ton of sites or reaching out to your network.

The Color Palette

The first thing you notice with the site is the color scheme: it combines a very striking orangered with very muted greys. How did you come up with these colors? Did you try other variations as well?

Yes. I knew that there was going to be a ton of information that needed to be organized with color, so the grey & white backdrop with an accent color to highlight important areas was the focus.

I originally tried more of a muted teal color to bring some life into the app but what we settled on was a much cleaner color scheme which I think works well.

For color inspiration I will use other sites, posters, ads, paintings and other graphic design materials to come up with different color schemes, these are usually coming through on my moodboards.

The Awessome homepage

I wanted the content (recommendations) to be the focus of the app and nothing else, hence the muted greys and pale background.

But since our product is completely dependent on user contribution, I wanted to pick a color that would be good for calls to actions. I left the choice of this accent color to Chris… and the orange he suggested looked great, so I went with it. We didn’t try other variations.

As a side-note, we’re in the process of launching a mobile app and actually focusing on that as our main platform. The orange didn’t really translate well to mobile, we tried a bunch of different variations on there and we finally settled on a bluish-sea-green and will be updating the web version you currently see to that color as well.

Chris, looking at your Dribbble profile, it seems like you like using this kind of orange in your work. Any specific reason? Is it “your” color?

Haha – ya I guess I’ve really been using alot of oranges in my web applications now that I look at my Dribbble profile.  Like I said above I really like that you can use such a strong color like orange to draw the eye to important areas on a website or screen.

My favorite color really is cerulean blue, but as you know alot of the blues have been exploited in design by real large corporations – not that’s a bad thing, it’s just really overdone.  I do like that orange works well with a whole myriad of warm and cool greys & browns.

One of the unused concepts

The “Flat” Trend

Web design trend come and go, and are usually in opposition with one another. So after the artificial and candy-coated colors of Web 2.0, we got the hyper-realistic wave of iOS-inspired skeuomorphic design, which is itself giving way to the superclean, minimalist aesthetic championed by Microsoft’s new user interfaces.

Awessome seemed to be riding this wave of flatter, simpler design, so I asked them for their thoughts on the matter.

The design uses a very “flat” style, recently popularized by Google and the Metro UI. Did you have other inspirations? Do you think this is just a trend, or something that’s here to stay?

Early on in my design career (and still today) I was heavily influence by Swiss graphic design. I worked for a Swedish company that sourced their logos from Paul Rand and the art directors really stressed the “clean” aspect of design – lots of whitespace, great typography and grids to help lay it out.

It always stuck with me and I hope people see it in my work.  Using color, good typography and some texture to bring across a clean user experience is what I strive to do.  The first design we created for Awessome was much bolder in typography (League Gothic) and iconography but still had the flatness you mentioned, working with color and shape to guide the user.

At the time we started the second version Akshay had sent over an article in which a designer had redesigned the microsoft OS and did an amazing job with typography, icons and subtle color – I can’t think of the site at the moment but it was really well done.

Both Akshay and I agreed that this was something that we wanted to bring to Awessome and that what we had was a little too bold and clean enough.

I think the “flat” style is here to stay and it will hopefully gain more popularity.  3D and gradients have their place in web applications but if it doesn’t help the user experience than I think it is overdone.  I’m not totally convinced that making a design look 3D on a flat screen really helps the user do a task or creates a better user expereince than flat color.

We actually didn’t really look at Google / Metro for our inspiration (we did play with the Metro layout for the mobile app which we ended up ditching).

So the way we did our designs was, I provided Chris with a document with what elements need to be on a page and ranked them by importance (an approach I picked up from Amir Khella whom you may be familiar with). I didn’t providing him with any wire-frames so I didn’t poison the well, so to speak. Chris provided some iterations based on these guidelines and this was the one that best fit our product so that’s how we chose it.

I think the Metro UI is here to stay… in different variations of course. It’s a great UI for particular design needs (ironically, I don’t think it’s good for the Windows 8 desktop).

Tiles and Layouts

Ever since Pinterest popularized David DeSandro’s Masonry layout, it seems designers everywhere have realized that you’re not constrained to displaying things in a list or grid.

But just because you can use a fancy technique doesn’t always mean you should. So I wanted to know more about the process  behind Awessome’s layout.

The homepage evokes the famous Pinterest layout, except based around rows instead of columns. Did you choose a horizontal layout on purpose to mark your difference, or were there other reasons?

Pinterest has done a really great job in laying out the rows of photos within a boxed grid and then displaying content within that box, I don’t think anyone would disagree with that.  We looked at that concept and tried to come up with a better way to show the recommendation that the user is making which is the gist of the app.

We also wanted the site to be responsive so there’s really only a few different ways of accomplishing that.  Now one thing that I wanted to do to break away from this “Pinterest-style” layout was to break up the box size but still keep it in the grid. I think it gives the page a little more life and it also serves the purpose of showing some new content in a larger fashion at the top of the page.

As you scroll down the page, you get a little variety so that it doesn’t all look like the same size polaroid looking image.  I also think it helps on the responsive side of things, if Pinterest was responsive than you would have these huge long scrolling boxes for just one piece of content.

One of Chris’ preliminary sketches

Our product isn’t about pictures but about personal recommendations, and this is most importantly conveyed by the “text” that you see on the images on the recommendations.

So since the text (i.e. the recommendation) was the most important piece of our product we designed the grid layout around that.

On Pinterest the images are the product so the vertical works. For us the images only exist to support a recommendation.

Mobile First

There’s a lot of talk about “mobile first” these days (i.e. starting the design process with the mobile version of the site). Is that something you considered? Or are you focusing more on a native mobile app instead?

I’m a big fan of mobile first approach. Mainly because of it makes you focus only on what is absolutely crucial. Also it makes total sense in our case, since for an app like ours where local recommendations are a big part of our content, a mobile app is crucial.

So we strongly discussed going with mobile-first approach and would have ended up doing that but things didn’t work out with our mobile developer. We didn’t want to be in the situation of not have a developer ready to go once the app was designed so we decided to forgo that strategy and just build the web version first and do a native app later on.

We’re actually launching our native mobile app next month with a new design and so we’ll actually be updating the web app to reflect this. As such, in a month or so you’ll see an updated site as well!

Thoughts on Folyo

Lastly, can you share your thoughts on the experience of using Folyo? 

Had a very good experience with Folyo. It was super easy to use. The biggest value proposition for me is the fact that it is a curated list of designers.

Dribbble or Behance or any of the other tons of great design sites can get overwhelming if you’re looking for a designer. The fact that Folyo is a “short-list” of good designers (so to speak) makes it immensely easy to find a good designer!

Thanks to both Akshay and Chris for taking part in this case study. I think Awessome is a very promising company, and I’m personally very curious to try out the mobile app as soon as it comes out!

So take this quick survey and see what you’re doing right, what mistakes you’re making, and find out how your portfolio stacks up!

Photo credits:

• Gallery Photo by 1$WEAR
• Dribbble Cupcake by Roman Jusdado
• Sketch by Striatic
• Notes by Jurveston
• Magnifying Glass by Nathanmac87
• Screen by Plindberg
• Envelope by Pasukaru76
• Mobile phone by Johanl
• Frame by Seyed Mostafa Zamani

Folyo helps startups find great freelance designers, and one such startup is ReelSurfer.

Out of the YCombinator startup incubator, ReelSurfer recently launched after working on their design with Jonathan Patterson. I asked both Jonathan and Neil Joglekar from ReelSurfer a couple questions to find out more about the design process.

Introduction

First of all, can you introduce Reelsurfer?

ReelSurfer lets anyone clip and share any video from any website. As opposed to sharing a long video, ReelSurfer lets you cut and send the seconds you actually care about. To clip a video visit http://www.reelsurfer.com and enter the video url or use our bookmarklet.

From there you can combine and organize clips into reels (collections of clips) and share with friends. Afterwards, sit back, relax, and watch the best short clips from the web created by our community.

Visual Design: Coming up with a Theme

What you immediately notice about ReelSurfer’s design is its very strong movie theme. While this makes a ton of sense for a movie-related service, in my experience maintaining a global theme over a whole site can sometimes also be tricky.

The site obviously has a strong movie theme. Did having such a strong theme help come up with visual ideas? Or were there occasions where you felt constrained by having to stick to this domain?

The cinema or video theme was a natural choice given the name and type of service/tools ReelSurfer provides. I’ve found that sometimes the best solution is the most obvious one. It can be easy to over think, and subsequently overcomplicate, a design solution.

Once the overall theme is conceived the more difficult part of working within that context is to weave in the rest of the website and application. For example, the clip interface itself is presented on a cutting matte background that has cut marks on top of it. These are synonymous with cutting something, a video in this case, and adds a nice visual to this area of the application. Another example would be the login modal, where I used a film slate.

The ReelSurfer clipping interface

Typography plays a big role in web design. Can you introduce the fonts you selected, and explain why you picked them?

Fonts go a long way in helping establish the look and feel of a brand. The corproate font for ReelSurfer is called Asap. It strikes a good balance of readability and playfulness. It goes without saying that in any modern web or application design it’s important to use fonts that are suitable to use with a font replacement technique or service such as Google Fonts or Typekit.

One of my primary factors for choosing a font, aside from what it looks like, is how many weights it comes in. It’s never good to only have one option… “regular”, for example. When you have a lot of content to style you’ll need thin, regular, bold, extra bold etc. The more options the better! Using CSS to style fonts bolder or in italic doesn’t look the same as a font that has been specifically designed with those looks. That’s a detail many people overlook but one that I feel is pretty important in a high-end website or application design.

The style guide showcases various fonts and elements

There’s a lot of talks about “mobile first” design these days. Is that something you thought about? Is the fact that the site uses a bookmarklet a problem for mobile versions?

Both ReelSurfer and I are taking a very pragmatic approach to the project. We’re certainly mindful of the variety of ways that users will access the site, however, our first focus was to create the basic functionality and look then continue to iterate and enhance the site and application as time goes on.

A movie-themed log-in dialog

What are your thoughts on the “Minimum Valuable Product” philosophy? Do you think good design and a strong identity should be part of your product’s first version, or is it something you can add at later stages?

We definitely subscribe to the minimum valuable product theory. As Paul Graham puts it, a startup should launch when they have a “quantum of utility.” That’s why we launched our private beta about a month ago – mostly to learn about our core user scenarios. Clipping for non-video editors is relatively new so we wanted to be able to iterate on the UX first.

For the larger launch, however, we thought a bit differently. We feel the bar is getting higher and higher for design. Services like Instagram and Pinterest really took their time to get the design right and that made the user experience that much richer. Design and product development are both iterative processes so I don’t think we will ever really stop doing either. We have worked hard to create a strong identity and hopefully are off to a good start.

Thoughts

Despite being around for quite some time now, design has recently become something of a trendy buzzword in the startup community.

But a lot of startup make the mistake of only focusing on the “how it works” part of design. I won’t dispute that this is the most important part, but the visual aspect of your product (a.k.a “how it looks”) also plays a huge role in how people will apprehend it.

So I thought featuring ReelSurfer here was interesting, because they’re a rare case of a startup focusing on both great product design and visual design, while also adhering to the minimum valuable product philosophy.

Ordinarily, design case studies are written by designers. But since Folyo’s mission is to help connect startups with great designers, this creates an opportunity to look at the design process from both sides of the table.

So for this first case study, I picked the recent Perch redesign. Rachel & Drew from Perch posted their project description on Folyo last April, and they quickly got 21 replies from interested designers.

They ended up picking Paddy Donnelly, a great illustrator and designer who’s famous for (among other things) his Life Below 600px article.

I asked both Paddy and Rachel about their collaboration, the new site, and the overall design process.

Redesign Goals

One of the biggest mistakes you can make when designing something is starting without having well-defined goals.

“Make it prettier” is not good enough, you need to know what message you want to communicate, as well as how your current site is coming up short.

Rachel, can you give us a very short intro of what Perch is? What were your goals for this redesign?

Perch is a content management system designed to make it really easy for designers to add a CMS to their site. It essentially lets you add the CMS to the site rather than having to build your entire site around the system. Unlike many similar systems it is self-hosted so people purchase Perch and install it on their own server rather than it being software as a service.

We launched Perch 3 years ago and initially we assumed people would be using it for very tiny sites. As it turned out people started using it for large sites with loads of content. It scaled fine other than the fact that the admin UI had been designed for tiny sites and so larger sites ran into usability issues.

So it was these issues we wanted to solve with Perch 2, to keep it as a really simple, easy to use CMS, but one that would allow your site to grow.

So the redesign of the site was part of this, we felt that Perch was growing up and we wanted a slicker, more up to date – and responsive website, to go with our more mature product. However we also wanted to maintain our fun and friendly feel.

Preliminary Work & Art Direction

Every design project needs some kind of preliminary research phase. Sometimes this all takes place inside the designers (or the client’s) mind, and sometimes tools like wireframes or mood boards can be helpful.

Paddy’s preliminary sketches

How did you approach this project? Did you have some specific ideas in mind, or did you explore different possibilities?

We started off with some Skype chats to go over what exactly the guys wanted to get out of the site redesign. As the Perch CMS had grown over the past three years, Rachel and Drew felt the site could use an upgrade. There were a few branding aspects of the site that the guys wanted to keep, but they were very open to new ideas from me and willing to take a few chances.

After our initial conversations, I began sketching out some first ideas and we went through some moodboarding exercises to establish a look and feel that both the guys and myself were excited about. After this we created extensive wireframes before diving into the design.

Mapping out the site’s architecture with post-its

The design uses a lot of illustration. How did that happen? Was it something you knew you wanted from the start?

The Perch brand has always been very playful, incorporating sketchy illustration elements throughout the site. I wanted to push this up a level and draw people in with an engrossing experience on the homepage, while still retaining the much loved Perch bird character of course.

The original design already used illustration and we aim to give Perch a friendly, non-technical feel. We try to be accessible to people who have never worked with a CMS before so we wanted to avoid a heavy serious technology look.

Similarly, the site features a bright yellow bird mascot. Did you already have this mascot before? Does it have a name? What part does it play in your overall identity?

The bird mascot was designed by Kev Adamson very early on in the life of Perch and so we knew we wanted to keep the birds as they are really popular.

We see search requests coming in from Google for “the CMS with the bird”. They don’t have names (we refer to them as Bird 1 and Bird 2 a lot of the time) and have been very important in terms of establishing Perch as a bit different.

Content & Story-telling

Coming up with good content for a site can be tricky. One one hand, the designer is capable of creating beautiful layouts, but often doesn’t know enough about the business to write the content themselves.

And on the other hand, the client knows about their business, but might not have the design skills necessary to harmonize content and form.

I asked Paddy and Rachel how they dealt with this particular problem.

It seems a lot of work went into the About page, both for the copy and the design. Did Paddy also work on the content? How did you decided on the general layout of the page?

Story-telling was a device we were keen to use throughout the site. All too often in websites, pages like the about page can be afterthoughts which are dumping grounds for text. We wanted to use these pages to draw user in and introduce them into the Perch experience in a more effective way.

The content came from Rachel and Drew and then together we decided on the ordering while I provided suggestions for visuals. The fact that the guys wanted to dedicate so much time to crafting something original for sections like the about page, just shows how much care they put into their product.

The About page

Paddy has been great at forcing us to think about our content, across the site but especially on that about page. Both Drew and I are established writers and we can churn out lots of words! As we are not designers, when we need to get a point across what we tend to do is write more words. Paddy really helped us to cut down the wordiness of the site and give us ways to get the same ideas across visually, something that I think really works for our audience.

What has been the feedback on the new design? Did it meet your goals?

Feedback from our customers has been really positive, the site is still recognisable as Perch, which we wanted. It is a lot less “wordy” and demonstrates the benefits of using Perch.

We were a little worried when we started this process that people who already liked Perch would think we were making a big departure from the original product, however the site seems like a progression from where we were – still keeping the fun and staying away from looking like something technical and scary. In that way it mirrors the way the product itself has developed.

The site has definitely added to the feeling that Perch has “grown up” and I’m hearing that kind of sentiment from our customers, which is brilliant as I feel we hit the mark.

We wanted to find a designer who wasn’t afraid to challenge us or suggest we make changes or try new things with the site. We definitely found that person in Paddy, and the whole experience has been really enjoyable.

The finished product

Rachel and Drew were an absolute pleasure to work with on this project. Perch is their baby, but they weren’t afraid to take some chances with the design, trying new things and making bold decisions with the site. From the start, our goal was to make something great for the Perch products that we were all proud of, and that’s exactly what we got. For me, it was such a treat to work on an established brand that I already admired before the project started.

Feedback on Folyo

I also asked Rachel and Paddy what they thought of the whole Folyo experience:

One of the hardest things about finding designers is finding designers who have availability. We know lots of designers however they tend to be booked up for months, so finding someone to work on a project can involve a lot of emailing around to see if someone is interested.

I really liked the fact with Folyo that we could describe the project, the budget and the timeframe and designers were then able to respond who were able to work with that. So there wasn’t the awkwardness of realising our budget wouldn’t stretch to using a certain designer, or the issues of really wanting to use someone but finding they were too busy. The job posting form also helped me to post an accurate description of our project, which I found really helpful.

As designers are pre-screened, we didn’t get responses from people who were entirely unsuitable. As a tip for any designers reading this – a little personal note about why you want to work on a particular project is really important.

We had some responses with either no note at all or an obvious cut and paste one that they send with every response. To be honest I immediately put those to the bottom of the pile when looking through the list.

What sets Folyo apart from other job board services is the high level of quality in the projects listed. It’s not flooded with $10 logo designs like a lot of other online services. These are real, exciting projects with real budgets.

As the list of designers who appear on Folyo are vetted, I imagine from a client’s point of view, it’s great to have be able to browse through quality designers with confidence. I’ve gotten a few projects through Folyo now and the whole experience is great.

The one thing I would change is to increase the number of Dribbble shots you can import into your profile page. I’d love to show off a variety of my work directly on Folyo rather than just one piece

Conclusion

Tutorials are great, but I firmly believe that real-world case studies are the best tool to learn about design.

They confront you with real problems, and you can see how these problems were solved with just a few clicks.

So if you’ve used Folyo before (either as a designer or a company), I will be very grateful if you’re willing share your design process with the community. Just get in touch and let me know!

By the way, you can comment/upvote over at Hacker News, too.