My Chat With The Creative Outfit

Thanks to the wonders of the internet, I discovered The Creative Outfit. They're a trio of talented young St. Louis creatives that have banded together to form a great design agency. They're an excellent example of how smart, fresh talent can succeed even in the midst of a recession. Patrick Keefe, the Creative Director, was kind enough to spend a few minutes talking to me about their company recently.

Disclaimer: I feel really bad about this, I conducted this interview a while ago, but a combination of a heavy work load and some personal issues with our unborn baby sidelined my blog. Patrick is a good guy, and I can only apologize for the delay.

But enough grovelling, on to the interview!


First question, can you tell me a little bit about who you are, and how you became a designer?

My route to the design world is a strange one and I'll try to convey the short version. I have a degree in Political Science from Saint Louis University and was enrolling in law school upon graduation. After I graduated, I realized that I didn't want to spend three years in a law library. While I was at SLU, I taught myself HTML and how to wrangle Photoshop as a hobby, which was a lot of fun. I decided to try my hand in the creative industry and got a job as an interactive designer. I worked for a year or so and realized how much I loved the work but also realized that I would benefit greatly from design school. I enrolled in Maryville University's Graphic Design program shortly after and got another bachelors degree in two years.

I took an internship at ProWolfe Partners after graduating and spent a few months soaking up everything I could, including as much of the business side as possible. Despite having limited experience, but being a born gambler, I decided to take a shot on my own.

I spent another year freelancing for a few agencies and picked up a couple of my own clients, gained some valuable experience, and met some great people who proved to be valuable resources.


How did you end up starting a design company?

When realized that I could design in all environments but couldn't program worth a damn. That's when I sought out my partner, Kent. The dude is a wizard and we compliment each other perfectly. Since we met and formed The Creative Outfit (TCO) we've gained a TON of momentum. I can speak confidently to prospective clients because I know I can give them great design and Kent can develop amazing user experiences.


Describe the other principals, Kent and Erin, and how they became part of The Creative Outfit.

The Creative Outfit is a triad of sorts. I do design, Kent does development, and Erin does strategy and copy writing. We came together more out of necessity than anything else. I never had a really profound vision about what TCO would be for me but I did respond to the needs of my immediate market. Specifically, I found that clients needed great strategic direction, effective copy, and awesome user experiences. I couldn't do all of that on my own.

Oh, and Erin is my little sister so I was throwing her a bone. Okay, that's not true. She has actually been helping me out of situations for a couple of years so it was only natural that she partner up with Kent and myself.


Do you have any other employees?

We don't have any full-time employees but work with a couple of contractors when the load gets too heavy, which is probably going to happen more and more this year.


You seem like a pretty young group. Does that give you any advantages or disadvantages when dealing with clients?

Definitely both. On one hand, I am still feeling out all the roles I have to play and trying to anticipate the needs and expectations of our clients. On the other hand, I can respond with a great deal of agility to those needs and expectations because we are still developing and refining our core processes.


Your leadership is evenly split between design, development and business strategy. How does that affect how you work, vs. other agencies that are more heavily weighted towards just one of those areas?

After speaking with a lot of my designer friends, I realized that a lot of places, at least it seemed this way from their accounts, were too focused on design, or too focused on development, and almost never focused on content. I believe that design best serves its masters when it helps to more effectively communicate the content; not serve as a vehicle that necessitates content. Strategy, and therefore content, should come first. Design and development then support that broader strategy.


Describe your work environment/office.

Right now? I'm in a Caribou Coffee in Midtown Atlanta. Kent is probably in his basement lair in South City. Erin is likely on the L in Chicago heading back to her apartment. I generally work from my condo in the Loop but we don't have an office space yet. That's our big goal for the end of 2009.

You might expect that to hinder our efforts, especially when wooing clients, but that hasn't been the case yet. I let my enthusiasm for a client's project give me all the credibility I need. If a client is put off by us not having an office space yet, that's okay with me. It probably wouldn't have been a good fit anyway.


What's your work schedule like? 9 to 5, 10 to 10, completely random?

I always tell people that I'm too young to be overworked. I truly believe that. While I always maintain a balance in my life, I'm basically on call for most of my clients. My day ends when the work is finished and no days are off limits.

If there's one thing I learned during my time in Ireland though it's that you should take off every beautiful afternoon and go outside. I'll get my work finished later. Besides, insomnia runs in my family and I live way too close to Forest Park.


St. Louis and the country are in a pretty serious recession, have you found it hard to land new clients and start a company?

I think the recession actually plays into our favor. We have such limited overhead and we're so young that we have to price ourselves very competitively anyway. With more companies looking harder and longer for value we are more likely to get the nod, or at least a serious look.


What sets you apart and gives you an advantage over other creative companies?

I think it's our balanced approach to design, development, and strategy. We're also very charismatic and engaging. Our clients really appreciate that. I also take every possible opportunity to find a way to say 'yes' to my clients, even if it requires rethinking the entire strategic approach or cutting a budget.


What are your biggest challenges as a company right now?

Positioning ourselves for growth. We desperately need to meet some talented, hard-working developers who might like to do some contract work for us. As we meet more people and get our name out there, we're getting a lot of attention. I can only hope the momentum continues and being prepared for growth remains our biggest challenge.


Does being located in St. Louis make it easier or harder to find and keep clients (or no different), and why?

That's a great question. I can't really answer beyond anecdote. On one hand, there are fewer potential clients than in a place like Chicago but there is also less competition. Ultimately, I love this city and think it deserves world-class design so I try my best to seek out and retain clients that appreciate our vision.


St. Louis has an issue with attracting/retaining creative talent, have you encountered this when hiring, and if so what did you do about it?

Since I'm still so close to Maryville and some of my old professors, I get to see the real deal talent coming up the ranks before they even hit the streets. I have a handful of names in my pocket when the time comes to hire some designers.


Do you have a particular type of client or industry you focus on?

We're doing several boutique e-commerce sites right now and I'd love to do more of those. From an intellectual standpoint, there is a lot to consider when designing and developing online stores.

Otherwise, I hope to get my hands on some non-profit projects so I can contribute great design to smaller non-profits that otherwise don't have a chance to get beautiful materials.


What size client do you normally deal with?

We've been handling a lot of small businesses so far but we're in the proposal process with a couple of pretty big companies that would likely lead to great long-term relationships and require a lot of hours.


Describe for me the process you use on a project. Do you use wireframes, mood boards, brainstorming sessions, discovery phases, etc.?

We meet with our clients first and I always ask the same question right away: What do you want this business to achieve? That questions goes a LONG way to identifying the appropriate approach to their project. More importantly, it answers whether or not the project even makes sense.

After thoroughly investigating objectives, Kent, Erin, and myself reconvene and think about the long-term impact of possible solutions, not only from a branding standpoint but also from a business standpoint. We then provide for the client a detailed report of our ideas, with the associated costs and components of each plan.

Once we decide on a direction, it's time to get down to work. Our process in that regard is pretty standard: design, refine, get approval, develop, test, etc.

We use wireframes for web projects that involve tons of information and sometimes I do mood boards for identity projects. As I said before though, we like to stay really agile and just react to the personality and needs of the client so we don't push these processes on them unless it makes sense.


What kind of software do you use (Adobe suite, Visual Studio, open source alternatives, etc.)?

I dream in Adobe, man. I readily admit my over-reliance on Photoshop but I have pretty good chops with InDesign after working for a shop that did almost all annual reports.


What platform do you build your websites on, LAMP, Java, .net, Cold Fusion, Flash?

Kent is a LAMP guy but he can work in a .net environment if he has to. We both try to avoid Flash unless it's absolutely necessary. Since it's not 2002 anymore, that hasn't been too much a problem. Speaking of Flash, we really, really love jQuery as a substitute for things that Flash would have been used for a few years ago. It's so light and easy and marries beautifully with CSS.


Do you use frameworks or CMSes in your web development, is so which ones and why?

Kent has developed a modular and extremely agile CMS that we use for all of our web projects. It's light weight and very easy to deploy. The CMS makes it easy for our clients, or us, to manage sites. As we come across new client needs, we devise new modules for the CMS and deploy them as necessary. It's been a great approach so far.

Before I met Kent, I was doing all of my development within Expression Engine, which is an awesome CMS. It's just a little more robust than necessary for the average site and eats up a lot of hours. Clients also forget how to make updates pretty quickly since the admin area is a little intimidating.


Hand code or Dreamweaver (or hand code in Dreamweaver)?

I hand code in Coda since I'm a Mac nerd and Kent hand codes in Dreamweaver. He wishes he could use Coda and he's jealous of my Mac.
(Kent's note: That claim is entirely false.)


Would you like to mention any other tools you use?

Graph paper and my trusty Pilot Precise V5 for sketching letters and logos.

I also dabble in FontLab but I'm a total novice and could really use some help with my metrics.


Pontificate for me for a minute on how the industry is changing, and where you think it's going.

For better or worse, it's going digital and, more specifically, mobile. At some point in the near future we'll all be even more connected to the internet than we already are. The iPhone has provided something of a blueprint for a platform that finally addresses connectivity, usability and beauty. Its success has already spawned copycats. Companies will realize that they need an effective mobile presence as they vie for the eyes and ears of potential consumers. Furthermore, the imminent death of printed newspapers is a harbinger for this change in my opinion.


Any big plans for The Creative Outfit and the future?

I want to own a warehouse like Rob Dyrdek and his Fantasy Factory, but mostly for the zip line. Having two bulldogs would be cool too.

Other than that, I want to see TCO continue to grow, continue to provide a great service to its clients, and also provide my family, Kent's family, and Erin's family with the means to live a balanced and fulfilled life.

Link Roundup - Design and Usability

I've developed a habit of leaving tabs open in Firefox for weeks. Usually they're things I haven't had a chance to look at, or that I plan to write about or share. They've started to get out of hand again, and it's time to admit I won't be writing anything insightful about them any time soon. Instead, I'll share them here and then close those tabs forever.

This time most of them relate to Usability, Web Design and User Experience Design (UX or UXD).

10 Most Common Misconceptions About User Experience Design - A nice overview of misperceptions about UXD.

Simplifying Website Usability: The 3 Step Approach - a pile of excellent examples of sites that break down user actions into 3 easy steps. That's a good way to increase user participation and completion. The designs are inspirational too.

The 21 Most Popular Blogs for Web Designers - are they really the most popular? I don't know. But it is a good list of design blogs you should be reading. I have most of them in my Sage list. Some of my favorites: devsnippets, noupe, webdesigner depot and WebDesignerWall.

10 Tips to Create a More Usable Web - some nice, often forgotten tips on making sites more usable.

Pushup - a cute, non-offensive way to remind people to stop using ancient, broken browsers.

1 line CSS Grid Framework - a clever example of creating a CSS grid with just one css class. It might not be something you would use, but it does a good job of showing CSS grids don't have to be complicated to work well.

7 Quick CSS Enhancements for Better User Experience - some great tips, the "Prevent Firefox Scrollbar Jump" is one I wish I'd had on many past projects.

The GOOD Transparencies Archive - a collection of amazing information graphics.

Designing For Sign Up - an absolutely brilliant presentation on making better sign up experiences for web applications.

The Superb Abduzeedo's Illustration Team - a bunch of really awesome, inspirational illustrations. Some are NSFW, so don't click the link if that's a problem.

If Clients Dealt With Everyone The Way They Deal With Designers...

The Vendor Client relationship - in real world situations

Designers Have More Taste Than Talent

Dustin Curtis redesigned the American Airlines homepage after being frustrated with it, and received an illuminating email from one of their UX specialists. Rather than stop there, he spun it into a very interesting post on one of the things that makes a great designer.

To paraphrase, a great designer has more taste than talent. Their ability to see the quality in other things is greater than their own ability to produce it, which leads them to constantly push themselves to do something better. It is from this constant dissatisfaction that greatness springs.

I'm not entirely sold on Mr. Curtis's extension of this idea to corporate culture in general. Perhaps a better way to put it is that when a corporate culture loses it's ability to see the whole, and starts focusing on meaningless details, it suffers. When it cares more about price, prestige, rules, profit or fads than it cares about holistic excellence, it fails. This is no different from design, where every project must succeed as a whole, not as disparate parts.

Ngage To Remain Separate From Hughes

Wow. This one's a shocker. Ngage and Hughes have called off their merger, according to the St. Louis Business Journal.

This is especially surprising considering the amount of press they'd already done, and the many logistical moves they'd already made. Best of luck to both of them, this can't be easy for anyone involved.

McAfee, and What's Wrong with the Internet

We just installed McAfee's security suite this week, after a coworker got hit by a virus. It's turned out to be a very unpleasant experience. Every day I discover a new program that requires jumping through hoops before McAfee will stop blocking or breaking it (IM, iTunes, my entire Adobe suite, Visual Basic... Skype still randomly drops messages).

The final straw today was when I tried to look up an old message on this blog. My blog. McAfee blocked the site because it thought it was a phishing scam.

WTF?

Sure, it's a minor thing to add my own blog to the "do not warn" list. But it's ridulous that I had to do it at all.

This is the real reason walled gardens like Facebook are so successful. The restrictions they put on you mean you can actually communicate with other people without constantly being hit with spam, viruses, scams, and other criminal activity. As more non-techie people get on the internet, this trend will only continue, until the bulk of people experience the internet as nothing other than Facebook, Amazon, and a handful of other walled sites.

Update: it turns out McAfee blocks any blog from blogspot.com. Stupid McAfee.

Design BS: The Pepsi Logo Rebranding Document

I'm a little late to the party, but I've just found the Arnell Group's "Breathtaking Design Strategy" document for the Pepsi logo design online. And all I have to say is...

Seriously?

I mean, really guys, this is retarded. I've worked in big agencies, and I know exactly how this process goes.

1. Art directors look at old logos and a pile of Print Annuals, and curve up the logo a bit. This takes 3 hours. Maybe 5 if they do a lot of sketching.
2. Art directors spend 4 weeks and several cases of beer creating a document that justifies charging several million dollars for 3 hours of work. They do a wiki search for Davinci, Relativity, and Pompous Crap That Makes You Sound Important.
3. Pepsi pays several million dollars to lose their brand credibility. Arnell cashes their check and looks for a new sucker.

Welcome to the internet, Pepsi and Arnell. The days when you could screw a client over with glib words and a pile of big words are dead. And good riddance to them.

Thanks to Gawker by way of Fast Company.

Share Icons

When did these become the official internet icons for sharing?

Print is Dead, Crowdsourcing has Sprung from its Corpse

There are two stages to all industries. Invention, and Implementation. When an industry is in the Invention stage, people with ideas and skills make a lot of money inventing new things. When it moves to the Implementation stage, the only thing that matters is repeating the process as efficiently and cheaply as possible.

Graphic design is now in the Implementation phase.*

There are a finite number of ways to combine words and images on a page. That number is very high, but it's still finite. After decades of modern print design, we have hit that number. To put it simply, there just aren't many new ideas left in the world of static graphics. We've figured out what works, and we have really easy to use software to make it. All that's left now is to find the cheapest way possible to select and produce the optimal graphic design for any project.

Not convinced? Look at the last 10 years of Print annuals. Look hard. Other than some slight stylistic changes, you could feed them all into a computer and end up with 20 templates. Train someone to input the text, pick some colors and stick a stock photo in the right spot for minimum wage, and you'd have a design factory that wins awards and competes with any random Omnicom subsidiary.

Still not convinced? Think for a minute about all those evil people crowdslaving design. They're doing exactly what I'm describing, and they're making giant piles of money while doing it. That wouldn't be possible if print and identity design still required innovation.

Does this mean the design market is going to implode tomorrow? No. It took a long time for people to stop using lead type, this will take a while too. But don't get comfortable. Every day another client will realize print design is a commodity, and they'll switch to the lowest bidder. Graphic design has become like baking cakes. You don't need to be a cook, you just need a bag of instant cake mix and an oven. And even then, the cake factory makes them better and cheaper than you do.

What Should You Do?

Look for areas that are still being invented. Web and application design are two such areas. We're still figuring out what works the best on the web, that leaves plenty of room for skilled people with ideas. Get into interactive design as fast as you can, and never look back.

If you can't/won't do that, then your best hope is to start making things. There are tons of options for creating things through the internet and selling them. Whether it's magic islands on Second Life or custom shirts on CafePress, you can now earn a living being purely creative. There's a ton of risk and competition though, so I wouldn't count on paying your mortgage with it.

And if neither of those pan out, there's always a job at Wal-Mart.

*For the purposes of this post, I am considering graphic design to be print design, packaging design, identity design and anything else that deals with static text and images.

**I am sure some of you are thinking, 'wait a minute, I thought this guy hated crowdsourcing and lowballing clients?'. You're right, I do. I'm also moderately intelligent, and I never let what I wish was true get in the way of what I know is true. The graphic design industry is over, people. Be smart and move on now, while there's still room in the lifeboats.

Inkd

More fuel for the Print is Dead fire. Inkd is essentially an iStockPhoto for print templates. Fairly decent looking ones. Pay $30-100 for a template, change the text and photos, and you're done.

Somewhere, a smart and shameless designer is probably making a bundle selling these to their clients as their own work.

The designers only make 20% of the sale, which is kind of crap. And they ask you to upload your fonts. As far as I know, that's illegal (yes, everyone does it, doesn't mean you're not breaking the law). They attempt to sweeten the deal by dangling the carrot of letting you work directly with the design buyers to further customize your templates. Mmm... how tempting, you get to work freelance with clients that are too cheap to hire you directly to do original work for them.

This is the future of the print industry, people. It's not a happy place.

If Your Customers Were Right, They Wouldn't Need You

It's an old saying, but it's just as true today as it was when we first came down from the trees:

Never give people what they want. Give them what they need.

Scoble points out today that Facebook is so successful precisely because they do this. Their users have howled in protest and flung their poop every time Facebook has changed things. And every time, 6 months later everyone was happily using the new design/features/whatever with no trace of hypocracy. Facebook doesn't listen to what its users claim they want, it figures out what they really need, and does that instead.

Apple is another great example of a company that does this. They pay attention to their users, but they ignore what their users say they want. Instead they peer deep inside their user's minds, and create new things their users can't even imagine. And when they do, at first people complain and fling, and 6 months later everyone hails Apple as genuises.

Another example? How about that guy that got elected president? Remember how there was no way he was ever going to win? Funny how everyone acts as if it was obvious all along. Maybe Chris Hughes learned something at Facebook.

People are afraid of change, and they're especially afraid of change that is completely awesome. Something that is awesome threatens to change the way you think and/or the way you live. Even if that change is for the better, it's terrifying. It means letting go of old bad habits and admitting you were wrong about dumb ideas.

As a designer, you need to challenge people. Listen to your clients, but ignore what they say they want. They are wrong. If they really knew what they wanted, they wouldn't need you. They'd just need some pixel monkey to run Photoshop. They're hiring you because what they want is not what they need. If you want to barely survive, you can be that pixel monkey. But if you want to succeed, you have to figure out what your clients need, and punch them in the face with it.

They'll scream and flail and throw things, and once the pain of changing their mind has faded, they'll insist they knew you were a genius all along.

"If your ideas are any good, you'll have to ram them down people's throats.”
-- Howard Aiken quotes (American computer engineer and mathematician 1900-1973)

The Future is Coming

Newspapers are Dead. Really, Really, Really Dead.

A couple of great articles on the death of the newspaper hit my screen last week, and I've just now had the chance to write something about it. No one that's read this blog for long should be surprised that I live in reality when it comes to the question of the future of print (hint: there isn't one). It's nice to read the thoughts of people smarter than I am on where things are going, and why they are going there.

Old Growth Media And The Future Of News

A transcript of Steven Berlin Johnson's speech from South by Southwest.

Newspapers and Thinking the Unthinkable

Clay Shirky on the failure of newspapers to adapt to the web.

The primary point of both of these posts is that there is a need and a desire for news, but the old methods of delivering it are not just broken, they have been dead for years. The corpse just hasn't stopped rolling yet.

Clay focuses more on what comes next, and points out that none of us know what it is. None of us can. It might be newspaper websites, it might be blogs, it might be twitter. It might be something being invented by a 14 year old kid in his spare time. The only thing we can know is that it will be something different.

It's going to be exciting, and scary, and painful and wonderful. Thousands of people will lose their jobs and have their lives ruined. Millions more will benefit from whatever amazing thing rises from the news industry's ashes.

What Is St. Louis Doing to Attract and Retain Talent?

One of the biggest challenges to running a cutting edge business in St. Louis is finding talented people. There aren't enough skilled web designers, UX specialists, Flash/Actionscript gurus, java/.net/ruby/etc. developers, or other people with "future skills" in the city. If we want local businesses to grow, we need to attract more top talent, and we need to do a better job of retaining the people we already have.

Fast Company much too briefly mentions 4 cities doing exactly that today. The story reports on the annual meeting of CEOs for Cities, a nonprofit that works to build urban leadership and development.

Especially interesting is CreateHere in Chatanooga, TN. I was recently in Chatanooga judging a design show, and I was impressed at how vibrant and sophisticated the local design scene was. Much of the credit is no doubt due to CreateHere.

Can St. Louis do the same? Is the Downtown St. Louis Partnership working on something like this? Or Greater St. Louis Works?

Buckling Down

We're developing some really incredible stuff right now, but we're starting to realize how much we've got to do between today and the launch date. It's unfortunate, but I've had to set aside several smaller projects with freelancers. We'll get back to those in May, after things have calmed down again. Between now and then, posts may get a little scarce(er).

Expect to hear some amazing stuff from BusyEvent in mid-May or so.

No More Meetup Alliance

Meetup just sent me word that they're shutting down Meetup Alliance. It's a pity, it was a neat idea, but one that never took off. I think it was just never implemented properly, with enough clear advantages to member groups. Not that I'm slamming them, creating umbrella sites for groups is a hard problem.

Design is What You Need, Not What You Want

A brief note about all the online nonsense about crowdslaving design work. Anyone that thinks crowdslaving works for design has a fundamental misunderstanding of what design is. Design is not giving you a buffet of options and letting you pick whatever you want. Design is researching your problem and then giving you what you need. Which is often not what you'd have picked on your own.

Real design is valuable because it provides expertise the client does not possess. Being able to make PhotoShop go is the most minor part of design. That expertise is what designers are really selling, and to confuse the design process with picking random graphics is like comparing a gourmet meal custom tailored to your tastes with a McDonald's Happy Meal. Clients that buy what they want, instead of hiring an expert to help them find out what they need are only harming their business and limiting their success. Just like the Happy Meal, it may make them happy in the short term, but in the long term all that cheap, poorly made food makes them fat and unhealthy.

Hiring a Freelance CSS Designer

We're looking for a web designer to Zen Garden our application.

We'll give you 3 static HTML pages that duplicate dynamic pages our web app creates, along with the css files for them. You will create a new style sheet and image folder that dramatically redesigns those pages.

Our goal here is to show off the flexibility of our application's visual design. You won't have many constraints, you can make it look like whatever you want, as long as it's something we can show to clients. We won't use your code for actual applications, just as part of a demo. This should be a lot of fun, and a good chance to stretch your creative muscles.

If you're interested, send us proposal with a resume and links to 3 or more live sites you designed and wrote the CSS for. All of the layout should be done in CSS, and strong preference will be given to designers that use clean, standard-compliant code. On the other hand, we believe in getting things done, so we're not going to worry about perfect code if your awesome design work required a few ugly hacks to make it work.

Include your pricing and a rough timeline in your proposal, and send it to hireme /at sign/ pmgstl.com

BTW, this includes the usual carrots of "if this goes well, it could turn into more" etc. etc.

The Agency.com Skittles Thing

The first rule of 2.0 is this: Be Real.

Any wiff of being fake, lying, trying to be something you're not (in a non-ironic way) or otherwise acting like a typical 1.0 sleezeball marketer is instant doom on the internet. Like starving sharks, the internetorati will devour any fat clumsy fish stupid enough to wander in and bleed all over the place.

That's what is happening to Skittles, Agency.com's latest victim.

Rather than repeat what's been better written here, I'll provide some links and a bit of commentary.

Summary: Skittles replaced their site with live copies of social media pages related to Skittles. Ten seconds later, those pages became filled with profanity and sarcasm. So far they've had the balls to leave it in place, but rather than being cutting edge, it mostly comes off as cheap, dumb and clueless.

Agency.com redeemed by its Skittles work? - asks if this erases the Albatross of their Subway disaster. I say no.

Skittles Re-Skins Website With Twitter Search Page, World Still Revolves Around Sun - points out that this is stolen from Modernista, and kind of stupid. I completely agree.

Skittles' New Site Is the Social Web - Ad Age confirms it is still a tool by being a mouthpiece for Agency.com. On the other hand, they get points for admitting this is all a sad rip off of ideas other people have already had.

Hey! Who Stole My Twittles? I Mean, Skittles? - a really insightful piece, pointing out that with everything else going on in the world, this sort of vacuous stunt is just a distraction.

STL Tweetup

A bunch of St. Louis technorati types are getting together at Pujols on Friday, March 13 to hang out and be twitterific together.

Sign up on LinkedIn here.

I'm going to be there.

Awesome Information Design Video - The Crisis of Credit

The Crisis of Credit Visualized from Jonathan Jarvis on Vimeo.


This video is pure infographics gold. Excellent design, excellent illustration, great stuff top to bottom.

Defeat Web Sweatshops By... Using Them

160 over 90 has a great thread detailing his efforts to waste the time of one of the many internet logo sweatshops. Since they have very little organization or bookkeeping, he's been able to get a hilarious string of ridiculous logos out of them, all for $50.

The lesson here is that if you really want to get rid of these things, all you need to do is use them. And then act like the same kind of bad client you've had to put up with yourself. Demand endless revisions. Haggle over pennies. Insist everything be reworked from scratch in different colors. Ask for a gradient that is also a solid color. Insist the drop shadow have it's own drop shadow. And a glow. Stretch it out over months.

Let them find out what working in the design world is really like.

My Eyes, They Burn - Future History's Horrible Website

I followed a link today that should have been marked "Warning: May Be Equivalent to a Punch in the Eye." It was the site for Future History 3, an interesting design conference in Chicago. Unfortunately, their web design included possibly one of the most hideous backgrounds I've ever seen.



I've really got to wonder if the diagonal stripes are some kind of mistake. Surely no one could have done that on purpose, right?

I'm not overreacting, either. Looking at this site right now (I'm typing using the awesome ScribeFire and Firefox) is literally causing me pain. My eyes are straining and my head hurts. Very possibly if I look at it much longer I will have to sue them for assault.

People wonder why the design industry is having trouble...

Hiring a Freelance Social Media Writer

Panamedia is hiring a freelance social media writer.

We're looking for someone that has serious experience with social media. That means viral campaigns, blogs, twitter, facebook, and all that other 2.0 stuff that was hot 2 years ago and is mainstream now.* You don't have to be the genius behind the 25 Things meme, or the creator of lonelygirl15, but you should probably know what those things are, and why they were successful.

Your initial projects are going to be things like writing some copy for our web site, press releases, and some help with articles on our blog. We'd also like you to help us use social media to get our name out there. We've got a bunch of people in our target demographic that read our blog and follow us on twitter, your job will be to help us expand that and turn some of them into happy customers. You'll also help us brainstorm new ways to reach more people, and do even cooler things with the web.

This is a freelance, project-based job, you can work on your own but we will need you to come into our office when we start each project, and periodically after that. We do have a spare desk, so you're welcome to work in our office if you prefer. The usual carrots of "if this goes well, we'll do more together" apply.

You can find out more about us at www.busyevent.com. We're a startup, we've got 6 or so people, depending on how you count them (I like to think I count as 2.5 people). We've got an office in Maryland Heights, right below the best place for Gyros in St. Louis. We have solid funding, real income, and despite the economy a growing client base and a lot of interest in our products. We just need the right person to help up boost our marketing efforts while we're busy making awesome software instead of twittering and posting to blogs.

*for anyone that matters. If you have no idea what a tweet is, you should just retire now, your expiration date has arrived.

Design Fake Watchmen Merchandise

Someone's made fake Watchmen ice cream, Ozycandias.

This needs to be a design meme immediately. Everyone should post fake Watchmen merchandise.

A Few Thoughs On the Death of Old Media

Gordon Comstock has a nice, if slightly raunchy, commentary on the rise of amateur media over at Creative Review. Though be warned, his commentary compares the ad industry's woes to those of the adult industry, so if that sort of thing bothers you, don't click the link.

His central premise is right. The internet has made distribution almost free and virtually frictionless. Coupled with the cheapness of computers, software, and tools like cameras, almost anyone can create nearly any kind of media for free. Mostly this means thousands, if not millions of people with no talent flinging crap onto the internet. But get enough random crap thrown around, and some of it will accidentally be good.

Just like newspapers didn't have to lose 100% of their readers before they collapsed, old forms of media won't need to lose 100% of their customers to YouTube and blogs before they go under. It won't take many people deciding they can save money by watching movies put together by hobbyists and people with delusions of making it big before the movie studios are in big trouble.

Big media knows this. Just like the adult industry, rather than fight it, they're going to use it as an excuse to make their own stuff more amateurish. Hence the rise of reality TV. And stock photos. And "user generated content". The mass acceptance of amateurism is a great way to save money. Why hire talented professionals when you can delay the collapse of your empire for a few more years by churning out crap?

It's not all gloom and doom. The same forces destroying the old media world also make it easier for people with real talent to get their work out there. That's the key to survival. You're going to have to take it upon yourself to create projects and put them out there. You'll earn all the money, but you'll take all the risk. On the upside, you'll be putting out high-quality products while everyone else is racing to the bottom.

Fast Company is Also Clueless About Design

Aaron Perry-Zucker has chimed in on the debate about CrowdSpring over at the Fast Company blogs, with comments that prove he has no idea what design is. It is NOT creating pretty graphics. Design is a process that solves clients problems. A tiny part of the solution may include pretty graphics, but suggesting the graphics is the whole of the design is like saying the flames some modder paints on the side of his car is the engineering that built the car.

I applaud Aaron for keeping a blog on Fast Company, but it's unfortunate a student of design is so misguided as to what design is.

CrowdSpring = Porn?

CrowdSpring and it's ilk are to professional design as porn is to real movies. How so? Read on...

The porn industry lures in people that aren't talented enough for real film work with false promises it's easy to be a star. They burn out and are left with no chance at a real career in film (or anything else). The people making money are the ones burning through untalented people and selling their work to desperate loners that can't get the real thing.*

Sound familiar?

CrowdSpring etc. do the same thing. They lure innocent fools that think design is easy into "design contests," and by sheer numbers end up with something that can be sold to the desperate client that can't/won't pay for the real thing.

Those would-be designers will keep throwing themselves into the contest mill until they're burned out, without ever earning significant money or learning real skills. The ones making money are running the contest, while the participants, both "designers" and clients, blow their time and money pretending they just experienced real design.

This sort of thing has flared up now and then on the internet. Eventually we'll admit it's not going away, and we'll learn to ignore it. These sites will linger in the back alleys and low-rent strip malls of the internet, selling empty promises and fake design to furtive clients that dash in with the collars of their overcoats turned up. It won't end the design industry any more than porn ended Hollywood. But it will leave us with a lot of idiots that don't understand the two aren't the same.

*I'm as open minded as the next guy, and I'm sure that not everyone that goes into a dirty video shop is a desperate, creepy weirdo. But most of the people I've met that think they can get a logo for $50 have been desperate, creepy weirdos, so I think the comparison works.

What if Forbes Followed its own Design Advice?

Forbes is causing an uproar with their poorly written advertisement article on CrowdSpring, one of many sites that has sprung up lately to exploit naive people that wish they could be designers and ignorant business people that think design is just slapping random graphics together. Sadly, both lose out, even though both will swear they're happy with the results.

I haven't finished formulating my own thoughts on the matter, but in the meantime, I wonder if Forbes has considered using the same principle to write and design their magazine? Maybe they can save some money and stay afloat by turning to CrowdSpring...



Read more reactions:

Why CrowdSpring Owners Should Be Ashamed of Their Business - Brian Yerkes

Forbes Says Designers are Snooty - NO!SPEC

Forbes Promotes Graphic Design Kitsch - Steph Doyle

Design is a ’snooty’ business: Forbes - The Logo Factor

Designers = Snooty? - design to define

Forbes Magazine: Graphic Design is a Snooty Business - Jeff Adrews

Snotty Designers & Pompous Elitist Businessmen - Christopher Ross

The writer, Christopher Steiner's Linked In profile, just in case you're curious who you should never work with after he's been replaced by some person with Notepad.

UI Patterns

12 Standard Screen Patterns is worth reading for anyone that does website or application design. It's an overview of 12 common screen templates. Each template describes a common arrangement of information/controls, such as search+results or column/browse (think most email applications).

UI Patterns can be very helpful when you're designing interaction. There's no need to reinvent the wheel most of the time, and UI Patterns like those in the link above are basic enough you won't get distracted by details like you can when looking at actual websites or apps. They're great starting places when you're concepting a screen.

I'm also a fan of the following UI Pattern sites:

UI Patterns
Welie.com
The Yahoo Design Pattern Library
PatternTap

Apple Spends Months on Each Design

I just stumbled across an old report by Helen Walters at BusinessWeek on a presentation Michael Lopp, senior engineering manager at Apple, did at SXSW on how Apple achieves such incredibly awesome design in all their software.

The answer, it turns out, is they spend months making each screen..

Yes, that's right. They spend "enormous amount of time" getting to the first 10 comps. Each one pixel perfect, no greeking, everything nailed down and polished and exactly how the final screen will look. Then they whittle them down to 3. Then they spend several more months on those three. Then they pick one and spend more time on it.

Kind of puts things in perspective when you've got 3 days to design something, and the client wants to know why "you can't just make it cool like Apple does?"

You can find some other good notes on the presentation over at pictureimperfect.net's You Can't Innovate Like Apple, and Mike Rohde's sketchbook notes.

jQuery for .NET Websites... and Every Other Website

I've been looking at jQuery for a long time now in my search for an easier way to add rich interactivity to our web sites and applications. I'm also a Flash des/dev, which leads to a lot of frustration at the limitations of building applications with HTML (especially page refreshes.... oh, how I hate page refreshes). This morning I discovered Microsoft has put its support behind jQuery, including tech support and intellisense, and since we're a .NET/C# shop, that makes the decision for us.

(Nokia is also supporting jQuery, BTW)

What is jQuery?

jQuery is a javascript library. A very advanced, popular javascript library with a lot of powerful functions. It makes adding animation and interactivity to your pages relatively easy, and it adds a lot of slick AJAX features that you can implement through plug-ins. It is fast and small, it's cross-browser and there is a ton of online support for it.

I'll be writing more about jQuery as we explore it, in the meantime here are some of the best links I've found for designers interested in learning more about it:

jQuery Tutorials for Designers - a very good set of step-by-step tutorials on simple, but cool, jQuery techniques

The jSkinny on jQuery - a little more technical, but still good, it goes more in depth on how jQuery really works

Smashing Magazine's jQuery Articles - more jQuery goodness than you can shake a stick at.

NETTUTS's Javascript and AJAX Section - NETTUT has several good articles on jQuery along with other javascript and AJAX articles

Dumb CSS Tricks: Min Height Hack for IE

Just in case you've never seen it, here's the best minimum height hack I've found for Internet Destroyer. It only requires 2 extra lines, and doesn't mess up other browsers.

min-height:15px;
height:auto !important;
height: 15px;

Works great for definition lists. If you're running into trouble with IE randomly collapsing divs, just stick this in and you'll be gold.

Excess Shiny Dilutes Your Message

It is an endless temptation to pile on decoration and meaningless shiny bits onto designs. You do so at the peril of burying your message under a mountain of distractions. That may be good graphic art, but it's terrible graphic design.

In an interesting paper in the Journal of Experimental Psychology, details are provided on experiments that proved this. Students were given educational materials. Some included mildly interesting distracting information. Others included very interesting distracting information. The information was related to the topic (facts about viruses, for instance, in media explaining how a cold virus infects your body), but it was not part of the central message.

Instead of making the students more interested and engaged in learning, the result was they were much less likely to remember the main lesson of the media (PowerPoint slides, an illustrated booklet, or a narrated animation). They didn't have a chance to focus on the important facts, so the impact of the message was shallow and weak.

The same thing holds true for your design work. Distractions are hard to keep out of design. You and your client are both very familiar with the message you're trying to send. It's boring to you both. That creates pressure to "jazz things up" by adding new, superfluous elements or data. That might make you or your client interested and excited again, but it comes at the price of destroying the effectiveness of your work. Stay focused on the primary message of the design, and remember that to the end user, it will always be fresh. You might be on the 20th revision, but they'll be seeing it for the first time.

Special thanks to Dave Grey through Facebook for the link.

Install IE 3, 4, 5, 5.5 and 6 on Your Windows XP Machine

Multiple_IE is a handy little app that will install versions 3 through 6 of Internet Explorer on your Windows XP machine. It's very handy for testing your web pages, since not everyone has upgraded to a more modern browser.

(and by more modern, I mean FireFox, of course)

Pre-Xmas Design Link Roundup

Before I head off for a few days of holiday cheer, here is a list of the best design links currently clogging up my Firefox tabs.

The Secrets of Marketing in a Web 2.0 World: a good article on Web 2.0 Marketing in the Wall Street Journal? The world has truly ended. Not only is it worth reading, there's a chance you can get your boss to read and internalize it too.

Intro to Drupal:

A Closer Look At the Blueprint CSS Framework: a nice step by step analysis of Blueprint. Good if you're wondering how CSS frameworks work.

BlueTrip: a combination of Blueprint, Tripoli, and some other CSS frameworks.

reCAPTCHA: a free captcha system that uses the free labor of people hitting your system to digitize books. Plus, it has a snazzy home page.

UXmatters: a good blog on user experience design (UX) and usability. Weird purple color, unfortunately. Is looking like a lavendar air freshener exploded on your site good usability?

Why Designers Fail: this was going to be a full blog post, but time got away from me. In short, it's a report on a survey that seems to indicate the main reason design projects go awry is not design, it's management and organizational inefficiency. In other words, the non-designers involved in the project frak everything up.

50 Extremely Useful And Powerful CSS Tools: exactly what it sounds like. Some are extremely marginal, and clearly only included to get to a nice, round number (postable and Graph Paper, I'm looking at you), but others like ReCSS and 15 Must-Have Bookmarklets For Web Designers And Developers are pure gold.

45 Excellent Free Wordpress Themes: a whole bunch of good free themes for WordPress. I especially like Premium News, Monochrome News, and Rebel Magazine. Lots of graphic-heavy themes that don't appeal to me, but might to you.

Case-insensitive E4X Filtering: a simple way to filter XML in AS3 without having to worry about what case the characters are in. This is something I'm incorporating into our log in tools, since you can never count on people to capitalize their names and email addresses the same way.

Making Modular Layout Systems: Jason Santa Maria writes his CSS a lot like I write mine. You can be a lot more efficient and flexible by modularizing your CSS, so that rather than every element having its own style, they all have a set of styles applied to them that create the desired effect. This is how I style the buttons on www.busyeventxp.com, all have a base button class, then a series of other classes to add icons, borders, and other features. It's a huge time saver.

Sort XML by Attribute in ActionScript 3: the only example I could find on the internet of how to take a piece of XML, disassemble it, sort it, and reassemble it. Maybe Flash CS4 finally has sortOn for XML?

The Five Second Design Test

I'm in the middle of redesigning BusyEvent.com to promote the Beta release of our new product. As part of the redesign, I've submitted the current design to fivesecondtest.com. It's a fascinating tool that allows anyone to get anonymous testing of any web page or application. The testing is limited, but it does work well for very basic level design testing.

If you have a moment, spend 30 seconds doing a 5 second test of our site.

What the Recession Means for St. Louis Design

A recession is a scary time to work in design, especially in a town like St. Louis. The Drive Agency just went under, multiple agencies are having layoffs, and the AB buyout is cutting off the oxygen that many local agencies depend on. It's hard to tell what's going to happen, and what you should do. The following are my thoughts on what is going on, where it's all going, and how you can come out ahead.

1. It's not just the recession. The St. Louis design industry was already in trouble before the recession. Several agencies have collapsed over the past few years. The truth is Saint Louis has been declining for a long time (unless you're in medicine or biotech). In addition, two other trends have been chipping away at the foundations of the STL design world.
   
   • Print to Web: the print to web transition has been particularly hard here. Only a few of our larger agencies moved quickly to build interactive teams, and the ones that did, like Fleishman-Hillard and Rogers Townsend, have vacuumed up most of the available talent. No one else in town offered competitive wages for interactive talent, leading to our best people fleeing to other cities. That's made it very hard for design agencies in town to adapt. Add to this old guard art directors and creative directors that still don't "get" the web, and you have the current big players slowly starving to death while pretending everything is fine.
   • Big to Small: While the dinosaurs have watched the skies go dark, smaller, quicker companies have adapted and thrived. Agencies of 30 or less people with low overhead have been successful in STL. In many cases they end up getting the interactive work the big agencies can't do outsourced to them. It's only a matter of time before they cut out the middle men. When budgets are tight, no one's going to pay 50 people to do what 10 can do better.
     
2. A recession is like a wolf. It eats the old and the weak. We're going to see more agencies in St. Louis fail. They're going to fail because they don't have the right talent or the right vision. They're bloated with old ideas and ways of doing things, and they can't change fast enough. The implosion of local agencies is going to flood the market with designers looking for work, a market already packed with unemployed print-only designers. Designers in St. Louis are going to have to be very aggressive about networking and improving their skills if they want to survive.
3. This is a great opportunity for a few. The demand for interactive work is only going to increase, regardless of the recession. If you are smart, talented, on the bleeding edge of web technology and able to adapt quickly, you will not lack for work. All of those big clients that are slashing their budgets still need work done. When an account goes from a million dollars to $200k, it might mean the death of a large, old agency. For a small, agile agency that could be a feast. Figure out how you can offer better and smarter ways of using the design dollars that are still out there, and you'll not only survive, you'll prosper.
   

It's going to be a very rough ride, with a lot of turmoil and bad news. At the end of it some people will come out on top. Many of them will not be the same people currently there.

Hiring C# Developer, Web and Flash Designer

We're hiring a new C# Developer and a web/Flash developer/designer. Full-time, salary positions, benefits, blah blah blah. We're just about to launch a beta version of a new product (that's where I've been the last two months), and it's time to expand the team.

C# Developer:

• 3 to 5 years of experience developing web applications in C# and SQL.
  
• A real understanding of programming theory and OOP (no cube drones here).
  
• Basic skills with HTML and CSS. You won't do design, but you will be working with web pages.
• Know XML, AJAX and Javascript. I shouldn't need to tell you why you should know these.
  
• We'd really like you to know how web servers work, this isn't an IT job but basic knowledge is appreciated.
  
• Some experience with ActionScript 3 or Mobile platforms would be a plus.
  
• A degree in Computer Science is best, but if you know your stuff we don't really care where you learned it.
  

Web and Flash Designer/Developer

• 2-4 years of experience designing and coding web pages
• 1-3 years of experience building Flash applications (not just animations)
  
• Hard-core knowledge of ActionScript 3, including XML and integrating with backends (we use .NET)
• AIR experience is a plus, as is Flex experience
• Experience working with .NET and Visual Studio is a big plus.
  
• Solid knowledge of CSS, UX, Usability, and all of that. You should be a designer, not an artist.
• This job will focus on designing and coding applications in Flash/Flex, but you'll also be doing web design daily
• A degree in Design is nice, but there aren't a lot of colleges teaching real web design, so we're not too concerned with your degree
  

In both cases, these are intense, high-level positions. We are looking for motivated, talented, dependable people that love a startup environment. If you'd rather work in a dull, predictable cube churning out crap all day, then we don't want you. We're entrepreneurs, you should be too. We're growing and successful, and we'd like to have you grow with us.

The 25 Best Resources for Learning CSS and Web Design

There is a huge demand for web design, and very little demand for print design. The design market has been shifting from print to web for the last decade, and that transition is almost over. The current recession will finish off the old media giants that have been clinging to life, and lead to huge growth and prosperity for the companies and designers that survive and master web design.

If you haven't learned web design yet, you need to do it now. It's not going to be easy. While the principals of design are universal, there's no Photoshop for web design were you can just draw what you want on screen and press a button to make it happen.* You need to learn the technology of web design as well as the design theory.

To help you do just that, I've assembled the best resources I know of for anyone that wants to learn web design. These links assume you have some experience and talent in design, and you're reasonably computer savvy. They also assume you've used the web enough to know what HTML, CSS, links, sites, SEO, and other web terms are.


Tools

1. Firefox: the first thing you need is a good browser. That means Firefox. Period. You need to keep IE around so you can run tests for all the poor, ignorant masses that have yet to see the light, but other than testing you should never, ever use it. Use Firefox for everything. Not only is it a better browser, you can add on the following vital web design extensions:

2. Web Developer: very handy for turning CSS on and off, editing CSS on the fly, and other useful under the hood modifications. It can validate your code, zoom a page in and out, and it has an awesome Show CSS mode that highlights elements and shows the styles affecting them. You will use this almost every single day.

3. Firebug: you have to see Firebug to understand how useful it is. It shows you the structure of your site and allows you to edit the html and css live, with the changes being instantly shown in your browser. Much easier than editing your code and resaving, FTPing to the server and refreshing. Also very handy for tinkering with other people's sites without damaging them while you're learning web design.

4. FireFTP: why bother with a separate FTP program? FireFTP lets you FTP straight from Firefox, and handles 99% of anything FTP-related you'll ever want to do.

5. Adobe Creative Suite 4 Web Premium: if you have the money, the combo of Dreamweaver + Flash + Photoshop + Fireworks + Illustrator (for icons mostly) is killer. It's industry standard and incredibly powerful. This is what I use for all my work. Pay attention to the upgrade options, they're different depending on what previous version you have. They've also closed some loopholes, so you can't just go buy an old copy of Photoshop on eBay and expect to get the upgrade price to the full suite.

6. Free Text Editor: on the other hand, if you have no money, you can do everything mentioned here with the text editor on your computer (though I like NoteTab, the pro version is worth the $30, and it comes with HTML automaters). Make your graphics with the Gimp, and you're fully capable of being a professional web designer without spending a dime.

Websites

7. w3schools: Start here. It's full of good tutorials for beginners, and it's a useful reference tool for advanced users. It also has good tutorials on topics like XML, .NET, AJAX and even more arcane acronyms.

8. HTML.net Tutorials: a pretty comprehensive set of web design tutorials. I like how each lesson is small and easy to digest, with clear, useful examples. They do a good job of explaining complex topics like floats.

9. WestCiv Hands On CSS Tutorial: a little meatier and more complex than the HTML.net tutorial series, this tutorial is good for another that wants a detailed walkthrough for making a website, with careful, step by step instructions on how to build each piece.

10. HTMLDog: this site is very helpful for absolute beginners. They don't assume much prior knowledge, and everything is explained very clearly in short, easy to absorb steps. A bit too short for some, but if you find the other sites aren't clear enough, you should try this one out.

11. MaxDesign: while it's not a tutorial site, the articles have rock solid code examples explained very clearly. I go back to the article on Definition Lists every few months, it's full of useful tricks and techniques. Listamatic is also a goldmine for ideas on how to handle lists of all kinds.

12. Once you've got a grip on the basics, read through 70 Expert Ideas for Better CSS Coding over at Smashing Magazine. It's a round up of very useful tips for making your CSS cleaner, more organized, and easier to understand.


Books

13. Cascading Style Sheets: The Definitive Guide, 2nd Edition: the title isn't kidding, it really is definitive. This is the book that finally turned the lightbulb on for me, and gave me a true understanding of how CSS really works. On the other hand, it's not light reading. If you don't have a tech background, you may have to reread parts of it a few times before it makes sense. This is a good book if you've already gone through tutorials and learned how to handle basic CSS, and feel like you're ready for a deeper understanding of how it all works.

14. Bulletproof Web Design: I pulled this book out today for some advice on a tricky definition list. It is full of step-by-step explanations of CSS techniques that are simple, clean, visually stunning and work in all browsers. This is the work of a true master, and at the same time it is totally accessible.

15. Beginning CSS Web Development: a good, and very detailed guide to basic CSS. I don't have it, but it comes heavily recommended, and I've flipped through it enough to say it looks like it delivers the goods. It's available on Google book search if you want a preview.

16. Beginning HTML with CSS and XHTML: also looks good, though I haven't read it myself.

17. Don't Make Me Think: this isn't a book on the technology of web design, it's a book on the design theory of web design. It should be required reading for all web designers. It's short and easy to read, and will open your eyes to how real web design should work. It's less about how to make your sites beautiful, and more about how to make them usable.

18. The Design of Sites: I love this book. It's a detailed analysis of common web design problems and how real, professional web sites solve them. It takes you deep into the theory and practice of site design. It's great for beginners and experts, and works well as a reference you can grab off the shelf whenever you need some new insight or inspiration. The Design of Sites is also available for free online reading.

(some of these books have been in print for a while, do yourself a favor and try to snag a used one on Amazon. You'll save a bundle and the information is just as good)


Other Useful Links

The following are useful examples, techniques or sites that will help you be a better web designer. They aren't complete solutions or something you'll use every day, but they are work your time to look at.

19. Noupe: 101 CSS Techniques Of All Time- Part 1 and Part 2: it should be "101 Best CSS Techniques of All Time", but I'll keep the link as-is. A huge round up of links to CSS code that will accomplish what used to seem impossible. A lot of them, like sliding door navigation or turning a list into a navigation bar are standard tools all web designers should have in their pockets.

20. 9 Top CSS Essential Skills That Every Web designer Should Learn: exactly what it says it is. Nine vital CSS skills for any web designer.

21. 53 CSS-Techniques You Couldn’t Live Without: more wild and inspirational CSS tricks than you can shake an unfloated div at. Look through it, you'll find at least one thing you want to try right away.

22. A List Apart: there's always a good article or two here on some CSS technique you can try. Not to mention articles on usability, the philosophy of the web, internet industries, and anything else related to making web pages.

23. 40+ Tutorials, Tips, Demos and Best Practices: Noupe again, with one of the best collections of CSS tutorials from across the internet.

24. 10 SEO Rules for Designers: some scurrilous guest writer wrote this helpful guide to best site design practices for Search Engine Optimization

25. Design Float: one of the best sources for web design articles on the web. Like Digg for design.


*yes, I know. There are applications that try. Fireworks comes kind of close. But the reality is that any site built this way will be vastly inferior to something hand-coded by a designer that actually knows what they're doing. You might be able to get away with it for small brochureware sites, but any client that cares about SEO, accessibility, or any kind of integration with a back end is going to demand real code typed by hand.

September 5th ActionScript, Flex and Flash Links

Oops. This post got stuck in the "to be finished and posted" pile. Better late than never.

Here's another list of my favorite Flash links this week:

Scalenine's Skin to Win Challenge: build a Flex theme and you could win a MacBook Air with SSD, the Adobe CS3 Master Suite, and a ticket to Adobe MAX!

The 25 Line ActionScript Contest: win an Adobe CS4 Suite by creating something awesome in just 25 lines of AS3 code.

43 Hot Flex and ActionScript 3.0 APIs, tips and tools for Autumn 2008: a long list of some very good Flash, Flex and AS3 resources. It has several links to frameworks like Flest, Gaia and swiz, and libraries like gTween. Most of it is pretty advanced, if you tend towards the dev side of Flash you should find plenty to interest you.

Flash tutorials | AS3 Drag and Drop: lemlinh.com has a good list of Flash drag and drop tutorials, including some good alternatives to startDrag()

Storing data locally in AIR: This tutorial by Mihai Corlan is awesome. It spells out how to read and write to AIR's built in SQLite database, store objects in files, and store external assets locally in plain, easy to understand language. The examples are clear and direct, anyone that is getting into AIR should give this post a look.

The future of Flash Player, Flex, AIR, Thermo and more: a keynote by Mark Anders on the future of Flash. Interesting stuff.

RIA (Flex and AIR) Frameworks: a good review of RIA frameworks

Woork by Antonio Lupetti

If you're a web designer, Antonio Lupetti's Woork blog should be on your weekly reading list. He's not unique in covering topics like writing clean CSS or using MooTools, but he is unique in how he explains things clearly, in an easy to understand, step by step manner, with lots of code examples and comments.



Do yourself a favor and go read his blog right now. You'll be a better web designer for it.

Today's Questionable Design Links

The internet is an amazing place full of interesting and useful data. To spare you from having to look at any of that, I present today's list of Questionable Design Links, all of which are guaranteed to be only somewhat useful.

corkdump: a user-generated list of design resources. If you love gigantic lists of links that lead to sites with more lists of links to other sites, then you'll love this site like a fat kid loves icecream.

Get Started with CSS 3: webmonkey does three cool things in this article. First, it reminds us that Firefox is the greatest web browser ever, in this case because it has features from CSS 3 right now, despite the fact that CSS 3 doesn't even exist yet. Yes, that's right, Firefox is so awesome it actually travelled back from the future to give us the rounded corners we need to prevent SkyNet from destroying humanity. Second, it shows us how we can add CSS 3 tricks like text with drop shadows and gradient borders (and IE users don't get to see them, take that Microsoft!). And finally it gives us examples that should make it clear to all designers why we should never, ever, EVER use any of this code. Ever.



I mean, seriously.



20 Famous Logo Designs: exactly what it sounds like. 20 images of famous well designed logos, the same ones you've been staring every day your whole life, only this time they're on some guy's blog instead of on your shoes or splattered across the crumpled wrappers littering your filthy apartment. This site is invaluable for anyone that's never seen the Nike or Coca Cola logo.

21 Must Read Tips to Write Better Web Content: it's really 21 links to articles other people have written about writing better. Go read them, so you'll have something better to write than another dumb list of stuff you didn't write.

History of Graphic Design: finally, a site that proves graphic design wasn't invented 2 years ago by a couple of 14-year-olds on MySpace. Go read the articles and you might actually learn something.

LED Throwies: if you can't think of a dozen clever guerilla marketing application for cheap do it yourself lights that stick to metal surfaces, then you have no business calling yourself a designer.

Wearable Motorcycle: let this be a lesson to all of you. All you need to do to get your 15 seconds of internet fame is to make something outlandish but kind of cool in a 3D app. The next thing you know you'll have brainless web writers blathering on and on about how you're a genius inventor. News flash: drawing a picture of something isn't inventing diddly-squat. Not even a really pretty picture. The last time I checked, "inventing" required stuff like engineering, prototyping, knowledge of mechanics, and other minor things like blueprints or some vaque idea of how to actually build something.

Design Science: Why Sound Cues Matter in Interactive Media

Adding sounds to interactive elements in your application can be a vital part of the user experience. It seems obvious, but it's all too easy to skip the sound, or assume making buttons click isn't important. After all, most computer programs and web sites don't make noise when the user interacts with them. The problem is that skipping sound creates a disconnect between how our brain expects to interact with real-world things and how it interacts with your application.

LiveScience has an article that reveals the audio section of your brain directly feeds into the visual section of your brain. When your brain can see and hear something at the same time, you can literally see that thing better. The sound cue reinforces the impression the visual cue makes on your brain.

This has a pretty big implication for application design. When the user clicks on a button, or moves a slider, if they see something happen on screen and at the same time hear something, the interaction has a much bigger impact on their brain. They will remember it more easily, and it will be more intuitive. Adding a little sound doesn't take a lot of work, but it can have a huge payoff in usability.

This is Why You Hire a Designer

When you're a new hip, happening nightspot in St. Louis, a sure path to success is to go cheap on your website and slap together something using an online site builder, right? A 3d animated email gif straight from 1997, Courier text and pink on grey send a strong message to anyone that finds this site. That message is "We suck, please don't come here."

The only way I can imagine this website would make me want to go to Par is if I did it ironically. And I'm not quite hip enough to do that.

It's a pity, really. The photos make it look like they spent a lot of money on a nice place. Which must be why they didn't have any left for their web marketing. If you're an enterprising young web designer, you might try and trade some free drinks for a new site design. I can't imagine doing something better would take more than an hour or two, even after you've had the free drinks.

UPDATE: evidently Par's webmaster reads this blog, and has decided to "show me who's boss" by changing the attribution line at the bottom of their site to my name. I'm sure many people will be totally fooled by their clever deception, and my reputation will be horribly damaged. Oh gosh, I sure learned my lesson.

UPDATE 2: a sternly worded email and the threat of a fraud lawsuit seems to have gotten their attention.

jQuery for Designers: a List of Lists

If you're working in web design, you need to know about jQuery. It's a JavaScript library that's being used to add very cool, sophisticated AJAX effects to websites. Interactions that used to be possible only with Flash or a huge amount of custom javascript are relatively easy with jQuery. It's cross-browser compliant, very small (around 14kb), and it's massively supported in the web dev community. High-quality tutorials and code snippets are being posted every day.

Note that jQuery UI is a slightly different library focused on adding high-end User Interface capabilities to the core jQuery library.

Below is a list of recent blog articles with links to tutorials, code snippets, plugins and other useful material for web designers looking into using jQuery.


Nettuts: 15 Resources To Get You Started With jQuery From Scratch - a great list of tutorials focused on designers and people new to programming. Start here if you don't know anything about coding or jQuery. Nettuts has many other good tutorials on jQuery, among other topics.

Noupe loves writing about jQuery. Read the following posts for great tutorials, examples and plugins that will add amazing UI functions to any website:
50+ Amazing Jquery Examples
37 More Shocking jQuery Plugins
45+ Fresh Out of the oven jQuery Plugins
51+ Best of jQuery Tutorials and Examples

specky boy has two fairly good articles on jQuery, both have some really cool jQuery examples.
20 Amazing jQuery Plugins and 65 Excellent jQuery Resources
65 Excellent jQuery Resources (tutorials,cheat sheets,ebooks,demos,plugins…)

TUTORIALBLOG links to some tutorials for designers.
8 Fantastic jQuery Tutorials for Designers
Their 25 Code Snippets for Designers series has all kinds of useful web code, including jQuery

How to Disable the Print Dialog in Flash

A huge problem for Flash kiosk applications is avoiding the print dialog window. You want users to be able to print a receipt, a ticket, a schedule, or whatever, but doing so will bring up the system print dialog, which knocks your application out of full screen mode and forces the user to click "print" a second time. After much digging, I have finally found an answer.

SWFkit can disable the print dialog in Windows with a single line of code:

FlashPlayer.showPrintDlg = false;

SWFkit is a swf wrapper, you add the code to their external script window and compile the executable. Works like a charm.

I looked hard at tools like Zinc (which I've used before very successfully), mProjector and Jugglor. None were able to skip the print dialog, at least not in a simple, direct way. According to the Adobe forums, AIR can't do it either, though it might in the future.

Design Matters, an Example

Good website design directly affects your bottom line. I've been researching .NET barcode controls for our BusyEvent product, and I narrowed things down to two companies. Their products appear to be equivalent and the prices are similar. There is one rather important difference.

One website looks like this:



The other one looks like this:



One of those companies just got our money based almost entirely on the design of their website. I guarantee they're glad they spent a little extra hiring a professional designer.

Four Lists of the Best Wordpress Theme Lists

Everyone likes to make lists of the "best" Wordpress themes. Here's a list of the best lists.

20 of the Best Free Magazine Wordpress Themes (Pingable)
Magazine themes are starting to become very popular for Wordpress. A magazine theme is laid out similar to a mainstream print magazine, and features a landing page with featured stories and many teaser links that lead deeper into the site. If you are building an "evergreen" site that has many long-lasting articles, and that you expect to be visited by a large audience with diverse interests, a magazine theme is a good choice.

I am a particular fan of Options and BranfordMagazine.


25 Outstanding WordPress Designs (Six Revisions)
This list focuses on themes that are artistic and unusual. If you'd like some inspiration for a theme that goes beyond the typical WordPress layout, this is a good place to start.

Especially interesting themes include BlogSolid, ISO50, and 3.7designs.


43 Phenomenal and Advanced Groundbreaking Wordpress Themes (specky boy)
Let's face it, this is just a random list of interesting themes. Quantity over quality. But there are some gems in it.

Take a look at Blue Zinfandel (and Revolution on the same site), The Morning After, and WordPress Premium


18 Minimalist Design Wordpress Themes (cssjuice)
If you like clean, minimalist design, this is a good place to start.

I like Cutline (and so does everyone else), and Upstart Blogger. Simplr is about as minimalist as you can get.

Pencil Project: Web Prototyping Tool in Firefox 3

I just stumbled across Pencil Project. From the first glance, it appears to be a very handy light weight web prototyping tool that you can run as a standalone or as a plugin to FireFox 3.

It's much more primitive than Fireworks (my preferred prototyping tool), but it does have the advantage of being purpose built to prototype web applications and sites. If you need a free tool for doing exactly that, this might be a good option.

If/when I get a chance to test it out, I'll post a review.