The art of Rob Loukotka
Cart 0 items
8 Ways to Get Shitty Clients

8 Ways to Get Shitty Clients

1. Use Craigslist

When looking for shitty clients, Craigslist is a great place to start.  The ‘gigs’ section is a virtual goldmine for the bad work you’re looking for.  Be sure to look for posts that say: “Student Needed” or “This will be great for your portfolio!” ALL CAPS posts are exceptional resources.

2. Show Old Work

As a creative individual you may have years and years worth of work in your portfolio, dating back to before you were even a student.  When searching for shitty clients, it’s very important to include all of this work.  If you’ve designed 47 logos in your lifetime, be sure to include them all on your website (including copies in different colors).  A potential shitty client might find your student branding project set in Arial to be “Super Cute!” and want their new business cards to “Look just like it! Maybe you can copy it?”

3. Lower Your Rates

Shitty clients will often have a different opinion regarding the value of your work.  It’s important not scare them off with budgets you would normally think are appropriate.  If you charge $100 an hour, try charging $7.  You’d be surprised how many bad opportunities present themselves.

4. Offer Discounts

Sometimes lowering your rates isn’t enough to land the deal, so try offering discounts. The shitty client may offer: “If you give us 30% off, we’ll e-mail all our friends about you!” This is a great offer, and should help you land the deal.

5. Be Shy

It’s important to be somewhat of a pushover if your goal is to attract more shitty clients. Confidence in your abilities, as well as any opinions regarding the proposal should be kept to a minimum.

6. Do Spec Work

Speculative design sites make it easy for you reach thousands of shitty clients effortlessly. The anonymous nature of these sites allows you not only do lots of work for little pay, but often no pay at all! If you’re new to working with shitty clients, and would like to learn more about their ideas or proposals, try browsing some spec websites or design contests.

7. Work for Family

Doing work for family members is an easy first step into working with shitty clients. The close relationship or love you may have for your family member allow you to easily get taken advantage of both creatively and financially. You often know each other’s addresses (or may even live in the same house), so details like proposals or contracts aren’t even necessary!  Be careful not to work for a successful entrepreneur in the family (they may end up being a good client).  Ideally you should only work on projects involving their recent idea to launch an ‘e-book’, or something with ‘candle making’.

8. Say Yes to Everything

Last but not least, always say ‘Yes’. Every client, every budget, every revision. Being confident enough to say ‘Yes’ to a bad proposal is a good first step, but don’t stop there!  When confronted with low budgets and endless revisions, always say ‘Yes’ to keep your shitty client happy. This will ensure you an endless network of shitty clients that you can work with in the future!

If for some reason you prefer ‘Good Clients’, check out these links…

Freelance Folder - Ten Characteristics of a Good Client

Clients From Hell - Clients From Hell

Freelance Switch - 12 Breeds of Client and How to Work with Them

Greyscale Gorilla - Seven Rules for Building Online Portfolios

Just Creative Design - Why logo design does not cost $5.00

What do you think?  Leave a comment!

Less Janky — How to Stop Banding in Your Images

Remove Banding - Title

Banding is one of the universal annoyances that every designer has to deal with.  Although it’s certainly more common among web designers, banding has also given plenty of headaches to print designers and photographers. Banding is a newer problem; unique to the digital realm, as old-school methods of photography and publishing weren’t limited to the digital color space. As the problem and its causes have only been recently defined, many designers may lack the techniques necessary to combat this subtle and tricky problem. If you’re not familiar with the term or are sick of reading this sentence, let’s cut to an image.

Some Banding in Action due to Compression:

Remove Banding - Slide 1

This is an overly exaggerated example of banding effects on a photo I took.  In the compressed version on the right, the sky doesn’t contain enough blues to portray a smooth transition. This is because the compressed version is trying to save space by limiting the number of colors used.  This actually works really well in the building section of the photograph because our eyes don’t pick up on subtle brightness changes when looking at busy or high-contrast areas. It’s only when the color jumps from “Slightly Light Blue” to “Slightly Less Light Blue” that we really notice.

It’s as if the compression algorithm thought “Hey man, that looks like solid blue. Six colors ought to cover it–done!” Idiot.

While compression is a common cause of banding, it’s important to remember that all digital images share this property of stepping harshly from one color to the next.  Indeed, each pixel is its own little square, not blending with any pixels around it. Fortunately pixels are much too small for our eyes to detect that stepping.  It’s only when compressors force similar areas of color into much larger groups that we pick up on the changes.

Banding with the Gradient Tool:

Remove Banding - Slide 2

The gradient on the left side was created by picking two colors and fading them together with Photoshop’s gradient tool. The gradient on the right side only used one color, and simply faded itself from 100% to 0% opacity.  Obviously they both achieve very similar results, and perhaps that’s why most designers may use the techniques interchangeably. If you look very closely, however, the gradient on the right actually shows some harsh stepping from one shade to the next.

Add some levels adjustments, and you can really see the difference:

Remove Banding - Slide 3

The good news is that Photoshop’s gradient tool handles gradients pretty well with multiple colors.  Photoshop does the math and immediately rasterizes the outcome.  Through a combination of dithering and subtle noise the fade is rendered pretty smoothly.  You can even hit the levels or curves adjustments later and it looks decent.  The gradient on the right, however, didn’t have two colors that Photoshop could do the math for, so no dithering or noise could be applied.  Without knowing what color it would be fading to, it simply renders the gradient in bands ranging from 100% opacity to 0% opacity.

Noise is the Solution! Sometimes…

The solution that is often thrown about is “Add a bunch of noise dude!”. While it’s true that adding noise to break up the bands is effective, you have to be careful that you aren’t bringing a bazooka to a knife fight. Adding too much noise unnecessarily will degrade your image and take clarity out of your highlights and shadows.

Fix #1 – Use Two Color Gradients

To prevent banding while using Photoshop’s gradient tool, always use at least two colors. Fading a single color to transparency will not yield pretty results.  If you absolutely must fade a color to transparency, make sure the gradient is small, or that the range of color difference in the gradient is high.  It’s the long and subtle gradients that cause problems.

Fix #2 – Use Noise in One Channel

If you’re experiencing banding when compressing or saving your images, you may want to add noise to prevent noticeable stepping.  If you want to do this without harming ALL of your color data try applying noise to only one channel–ideally, the channel where the most banding is occurring.

1. Select the ‘Channels’ tab next to your layers palette.

2. Click on a color channel.  Perhaps red if you have banding in a sunset photo, or blue if there’s banding in a bright blue sky.  Choose whichever channel works best in your situation.

3. Choose Filter > Noise > Add Noise. Check ‘Gaussian’ as the distribution format. Choose 1-2% as the amount, as you can always add more noise later if necessary.

Save your image out as you did before, and ideally this method should have decreased your level of banding.

Fix #3 – Use Noise in Another Layer

If you absolutely need to maintain a lot of integrity in your photo, but still need to remove banding in some area, try adding the noise to its own layer.

1. Create a new layer and fill it with 50% gray.  That’s about #808080 if you’re working in RGB.

2. Place this layer above the image you’re adding noise to. In the layers palette, choose ‘Overlay’ as the blending mode.

3. Add noise to this gray layer, 2-3% should suffice.

You’ll notice that the noise does not affect any very bright or dark areas of your image.  Because the noise is in ‘Overlay’ mode, you’re free to crank up the noise as high as needed, without destroying the quality of your highlights or shadows.

Another benefit to having the noise in its own layer is that you can use your eraser tool to remove noise from areas where it is not needed.  You could even take one step further, creating a complex mask and applying it to the noise layer, giving you full control over which areas are affected.

No More Banding!

Hopefully some of these ideas got rid of your nasty banding issues.  If you have any other tips or tricks to solve this problem, drop me a line in the comments.

Other Resources to Regarding Banding:

Wikipedia – Posterization

Greyscale Gorilla – How to Remove Banding Artifacts in After Effects


Watch a Design Fail Ten Times in a Row

Design Fail

Even though this website was launched only very recently, I’ve gotten a lot of positive feedback on its look. I’m relatively happy with it as well, but that was no easy task. If any of you have ever worked on a personal project, you’ve probably already learned that you are your own worst client. When you have no deadlines, no rules, and a huge imagination, it can be pretty tough to settle on your final look. You might start on one design in the morning only to immediately throw it away and start from scratch that afternoon. This post is dedicated to all of my wasted ideas and productivity, and hopefully some tips on how you can avoid a similar situation in the future.

Start With a Brief, Don’t Be an Idiot

One way to avoid an insane amount of redesigns is to treat yourself like your own client.  What are your goals, what is your target market, your intended ‘look & feel’ ? If you start with a vague idea like ‘Website about art something’, you may find yourself spending days and weeks on projects that will never see the light of day. I believe I started on the right track by thinking about my goals. Here are some key ideas/features I knew I wanted:

  • Full WordPress integration. I wanted to handle all of my content, including my portfolio, quickly and easily from any location.
  • A slick & memorable design that was still easy to read.
  • Black and yellow. Like Batman. Seriously.
  • Community features. This means a quick and easy way to comment on posts, because it’s fun to talk to my readers. It also helps me avoid sitting alone in my apartment and talking to my food.
  • Integrate my design portfolio.
  • Any name that’s better than ‘Loukotka’, yet felt design related.  You’d be surprised how many Google searches spell my name wrong, so this site is meant to be easy to remember and spell.

The problem was that my goals changed over time, and I should have stuck to these principles instead of designing away like a mad man. There’s plenty more ideas I could list, but let’s get to what’s important—images of all of the designs I didn’t use or show anybody, because I went insane and couldn’t settle on the right look.

Design Fail - Slide 1

A few months ago this was my first attempt at a design thought. I started blocking out areas of yellow or black, but immediately discarded everything because an all yellow website would be pretty tough to read.

Design Fail - Slide 2

This was an experiment with a minimalist look for my portfolio, but I quickly realized that dark and empty weren’t at all how I wanted my new site to feel.

Design Fail - Slide 3

Now we’re getting somewhere. This design borrows the background and name of my other website, Loukotka.com.t the time, my portfolio website was green and white, so I found this color change refreshing. Ultimately this felt too much like a showcase and less like a blog or valuable news source. This version was scrapped for the blog, but I used its ideas in the current version of Loukotka.com.

Design Fail - Slide 4

Another radical shift in thought. I was definitely digging the white with the yellow, but still felt the horizontal slide areas would only work for a portfolio, and not for an interactive blog. I even decided on the name “Neverlens”. I bought the domain, only to trash this name much later due to its similarities to “Neverland” and “Netherlands”. Oops.

Design Fail - Slide 5

I stuck with the name for a while and eventually continued down the “yellow brick road”. This version was grungy, and incredibly yellow. This certainly was memorable and open, so I explored it further. This is also the first design that actually contains some element of the current site (a small sliver of the textured header bar).

Design Fail - Slide 6

This design probably had more time put into it than any of my other trashed designs, and for good reason.  It’s strong, memorable, and edgy. My ‘home’ icon had a picture of the White House, and I had a really slick typewriter for my ‘need work done?’ link. For a while I was in love with this, but sometimes designs have to be scrapped because they don’t complete your goals.  This was visually interesting, but I felt like the strong colors and silly icons made the site feel like it was advertising itself.  This structure works great for a company, but if I added blog posts to the design, they’d have to compete with my own header for attention. I realized I had to give my written content a lot more focus.

Design Fail - Slide 7

I toned down the colors to a cool-gray. This certainly would help give focus to the written content, but I still didn’t want the structure of my site to be dictated by its textures. The background looks great, but it was quite large and would still compete with everything I was going to write.  I want to go to a blog to read articles, not to stare at a stone wall.  At least, that was my logic at the time.

Design Fail - Slide 8

I knew I was getting close here. This design gave a lot of weight to the logo, but still allowed the reader to easily jump over to reading the post.  You could navigate easily, read easily, and it still had some ‘batman’ feel with the logo.  That said, I was still mourning the loss of my previous designs, and knew I needed a little texture to bring it to life.

Design Fail - Slide 9

The name Fringe Focus is born. It’s easy to say, spell, and remember. But the site was feeling a bit too black and white—where’s my yellow?

Design Fail - Slide 10

Yeah, that’s it.

Have Hope, You’ll Finish it Some Decade.

Obviously seeing this many redesigns might not be the most inspiring moment, but I assure you there is an end in sight. If you’ve redesigned something a million times, take a moment to step back and look at those designs collectively (assuming you’re saving all of them, as you should be).  Identify the traits you like in all of them, and eliminate whatever seems to be bringing them all down.  In my case, it was that I hadn’t made my content the focus of the design.  In your case, it could be anything.  Your designs could be too bold, too timid, too warm, too cold, too crowded, too open, red fish, blue fish. Yes, that’s a Dr. Suess reference.

Even better, have your friends or other designers take a look at your past attempts.  Perhaps they will see the value in something you previously wanted to throw away.

In the End, It’s About Goals

If you spend all of your time randomly designing, hoping you’ll magically hit the right look, it may never happen.  Break out the paper, or the text editor, and write down what it is that you’re really after. Make your next design meet all of these goals (it is possible), and make yourself a drink with an umbrella in it.  You’re done.

Invisible Design – How to Optimize Your Transparent .PNGs

Fringe Focus Transparent Slide 5

If you’ve designed a website in the past decade (I know, there aren’t many decades to choose from), then you’ve probably run across a situation where you needed an image with transparency. Perhaps you need to see the background through the image, or the image has gaps that need to be transparent. Even more often, you’ll have a relatively solid image, but with complex edges that simply won’t work in a big rectangular JPEG. Logos and other design elements that might move when the browser window is resized, often need transparent edges to look right no matter where they are on the page. Fortunately all of these problems, as you may know, have already been solved with the development of the .PNG image format.

So we’re done! No tips, no tutorial, PNGs have saved the day! Not exactly.

The Pros of the PNG

  • Full range of opacity (0%-100%)
  • Full range of color (16.7 Million, anyway)

The Dirty Secrets (Cons) of the PNG

  • Relatively large file size
  • Doesn’t support blending modes
  • Doesn’t work in IE6 (If you care about that ugly monster)

These points only apply to 24-bit PNGs, as 24-bit PNGs are the only common format to allow full alpha transparency. Its younger brother, the 8-bit PNG, doesn’t share the same problems (but only supports binary transparency).

Whoa, alpha binary what? Bit? Slow down Star Trek!

Alpha transparency, in short, is the kind of transparency you’re used to in Photoshop. There are varying degrees of opacity, that are all mapped in an alpha channel, those black and white images in your channels palette. PNGs include an alpha channel, so any given pixel in the image can be any given opacity (0%, 32%, 99%, etc.). This is great for shadows, glows, or anything translucent.

Binary transparency, is when robots are invisible. Actually, it’s what it sounds like. Binary means you have two options: 1 or 0, on or off. The same goes for the opacity in a binary transparent image. A pixel is either 100% visible, or totally off. 8-bit PNGs, and GIFs support this simple level of transparency.

Lastly, we won’t get into too much math here, but 24-bit ultimately means the image contains the full range of color data for all 3 color channels. 8 bits of red, 8 bits of blue, 8 bits of green. Add that up, and you can see why it’s 24-bit. 8-bit image formats only support 256 colors, while 24-bit image formats can support 16.7 million.

Problems with your 24-bit PNGs

Obviously full alpha-transparency has its benefits in web design. But with great awesomeness, comes great file sizes. Alpha transparent PNGs are often three or four times larger than their binary counterparts. If your logo, borders, backgrounds, and sprites are all huge 24-bit PNGs, loading times can get slow… fast. While internet speeds are increasing, and this may not seem like a problem, the speeds on mobile phones, netbooks, and 3G wireless networks aren’t quite there yet.

Additionally, it is rarely the case that alpha transparency on its own will solve our design problems. With all of the beautiful uses for the overlay, screen, or multiply blending modes (to name a few)… simply having an image at 50% opacity might seem a little boring.

Old School 8-bit to the rescue!

While alpha transparency is definitely helpful in some cases, let me show you my process for making 8-bit PNGs or GIFs look just as good, at smaller sizes.

Fringe Focus Transparent Slide 1

Let’s say you wanted a logo to appear on top of a grungy background like the above image. We have a logo with blurred edges, that needs to show strong detail behind it. A 24-bit PNG would certainly do the trick, but we can show all of that detail in an 8-bit PNG or GIF with a few simple steps.

Fringe Focus Transparent Slide 2

1. Turning off your background layer, your first assumption would be that this image couldn’t possibly work with binary, jagged edges.  Let’s try…

Fringe Focus Transparent Slide 3

2. Go to File > Save For Web & Devices.  Under presets, choose 8-bit PNG.  Make sure ‘Transparency” is checked.  Then choose a matte color, in this case, black.

Fringe Focus Transparent Slide 4

3. This is close, but pretty janky.  Even if that black was a little lighter, you’d still not be able to see all the texture in between the letters.  So let’s try something better.

Fringe Focus Transparent Slide 5

4. Select the logo layer’s alpha by Ctrl+Click-ing on that layer (that’s Cmd+Click on a Mac obviously).  Then copy the merged layers by hitting Shift+Ctrl+C (Shift+Cmd+C for Macs). Open a new file, and paste the merged logo there.

Fringe Focus Transparent Slide 6

5. Now that the merged file is pasted here, you can see that some of that background data was pulled.  But simply saving the image with no matte would still cause problems, so we first have to bring all of the opacity up to 100%.  Do this by Alt+Click-ing on your logo layer and dragging up or down.  This creates a duplicate of your layer.   Now that you have two copies, select both of the layers by Shift+Click-ing on each of them, and then merge them by hitting Ctrl+E (or Cmd+E).  You now have one slightly more opaque version of what you had before.  Repeat this process four or five times.  Duplicating, merging, duplicating, merging, duplicating, merging until you see that the image is 100% opaque.

Fringe Focus Transparent Slide 7

6. Your image should now have a janky, but detail rich fringe matte (no pun intended). Go ahead and save it out as a transparent 8-bit PNG, or even a GIF if that floats your boat.  Keep in mind 8-bit PNGs generally have smaller file sizes than GIFs.

Fringe Focus Slide 8

7. Voila! You now have a relatively tiny, 8-bit PNG looking just as sexy as its 24-bit counterpart.  Of course, this technique only works if your background stays stationary, but if your background was a horizontal or vertical gradient, then these steps would still work.

Go ahead and try this with your navigation menus, sprites, or borders.  It can save countless kilobytes!

If you have any additional tips, ideas, or thoughts about image transparency, drop me a line in the comments.